9. Imágenes, fuentes, audio y vídeo

• Fuentes en la Web
• Formatos de Imagenes
• Formatos de Audio
• Formatos de Video

• Formatos de imágenes con compresión

Para fuentes grandes (títulos) que sea menor la altura de las minúsculas (x-height) y menos espaciado entre letras. Para fuentes pequeñas que sea mayor la altura de las minúsculas (x-height) y mas espaciado entre letras.

• Herramienta:
  • Type Anything: Herramienta para ver como queda una página según la tipografía
  • Interactive Typography Tutorial – Learn UI Design
• Diseño
  • Elección de las fuentes para el diseño de una página web
  • Mi método para elegir y combinar tipografías
  • Universal Sans: Permite diseñar de forma exacta una fuente sin serif ¹⁾ . Pero vale como ejemplo para ver que se puede cambiar en una fuente.

• Fuentes en la Web
  • Font Awesome, the iconic font and CSS toolkit
  • Indica la fuente a partir de una foto
  • 10 fuentes gratuitas de 8 estilos distintos de enorme calidad
  • Usando fuentes descargadas en una página Web
  • creating_and_implementing_your_own_icon_font_a_tutorial_-_the_media_temple_blog.pdf: Crear tu propia fuente de iconos ²⁾
  • ejemplo_fuentes.zip: Ejemplo de creación de fuente con iconos y uso de fuentes descargadas

• El tipo de la letra "a" hace que sea más formal o informal.

Enfatizar algo no es solo hacer la letra más grande sino usar una fuente con más peso (Weight)

• Formatos de Imagenes
  • GIF, JPG and PNG – What’s the Difference?
• Formatos de Audio
  • Formatos de audio: Todo lo que deberías saber
  • HTML5 Audio
• Formatos de Video
  • Formatos de video: Todo lo que deberías saber
  • HTML5 Video

• El tipo de fuente de la película AVATAR
  • In Defense of Papyrus: Avatar Uses the World’s Second-Most-Hated Font to Signal the Downfall of Civilization
  • "Papyrus" Ryan Gosling en SNL (subtítulos en español)