Optimización de documentos para lectura en dispositivos ...di002.edv.uniovi.es/~luciano/ICE/Diseño...
Transcript of Optimización de documentos para lectura en dispositivos ...di002.edv.uniovi.es/~luciano/ICE/Diseño...
Optimización de documentos para lectura en dispositivos dedicados
Luciano Sánchez
Indice
• Fuentes
– Tipos de fuentes y sus usos. Hinting y antialiasing. Fuentes embebidas. Fuentes para e-ink.
• Diseño de documentos
– Estructura de una página y posicionamiento
– Kerning, tracking, longitud de líneas, leading, encabezamientos
– Dibujos y ecuaciones
Qué es una fuente
• Familias tipográficas: grupos que comparten propiedades visuales: “Arial”, “Times New Roman”, etc.
• Caras tipográficas: diferentes estilos dentro de una misma familia: “Arial Italic”, “Arial Bold”
• Archivos de fuente: contienen una o más caras, de una o más familias.
Familias tipográficas
• Las serif se clasifican en Romanas Antiguas, Romanas de Transición, Romanas Modernas y Egipcias
• Las sans serif pueden ser Grotescas, Neogóticas, Geométricas y Humanísticas
Romanas antiguas
• Con serif
• Espaciado ancho
• Peso y color intenso
• Garamond, Caslon, Trajan
Romanas Antiguas
Romanas de transición
• Serif más agudo que las antiguas
• Diferencias más marcadas entre trazos finos y gruesos
• Baskerville, Times, Century
Romanas de transición
Romanas modernas
• Serif lineal
• Trazos marcadamente variables
• Cursivas muy inclinadas
• Bauer Bodoni, Didi, Caxton, Ultra Condensed
Romanas modernas
Egipcias
• Serif muy grueso, cuadrado (Lubalin Graph, Robotik) o redondo (Cooper Black)
• Clarendon o Egyptienne son actuales y se emplean en textos de libros y en fotocomposición.
Egipcias
Grotescas
• Grotesque en Europa, Gothic en América
• Derivadas del tipo egipcio
• Futura Haas o Helvética, Univers, Franklin Gothic
Geométricas o de palo seco
• Letras basadas en estructuras geométricas, normalmente monolíneas
• Futura, 1927, Eurostile, Industria
Humanísticas
• Basadas en las proporciones de las romanas
• Gill Sans, Stone Sans, Optima
Humanísticas
Manuscritas, ornamentadas
• Se usan en carteles, títulos, etc.
Fuentes para pantallas
Fuentes para libros electrónicos
• Kindle: PMN Caecilia
• Nook: Helvetica Neue, Amasis, Light Classic
• Sony: Dutch Roman (Dutch 801), Swis701 para el interface
Kindle (PMN Caecilia)
Nook (Amasis)
Sony (Dutch 801)
Cuándo se usa cada fuente
• Los tipos Serif son adecuados para textos extensos (libros)
• Los tipos Sans-Serif se usan en títulos, cabeceras y presentaciones
• No se deben mezclar varios fuentes en una página
• Algunos fuentes han sido diseñados para la pantalla de un ordenador (bitmaps, algunos truetype), cuya densidad es cercana a 100DPI.
• El texto impreso tiene densidad superior a 600DPI.
• La elección correcta de un fuente influye en la legibilidad del texto
Archivos de fuente
• Un archivo de fuente contiene imágenes de los caracteres, llamadas glifos (glyphs).
• También contienen la métrica necesaria para disponer el texto correctamente.
• Pueden contener tablas para soportar disposiciones más complejas, como las ligaduras.
¿Qué es una fuente bitmap?
• Una fuente bitmap es un fichero de fuente que contiene imágenes almacenadas como mapas de bits.
• Cada bitmap se relaciona con un tamaño de fuente, por lo que el fichero suele contener imágenes correspondientes a diferentes tamaños.
¿Qué es una fuente escalable?
• En una fuente escalable, los glifos no se almacenan como bitmaps, sino como formas vectoriales (outlines), descritas mediante segmentos y curvas de Bezier.
• Se dibujan más lentamente, pero pueden ser ampliados y rotados sin distorsión
• No son legibles a baja resolución sin hinting
¿Qué es el hinting?
• “Hinting” es un método de redondeo de la posición para definir qué pixeles se usan para crear el mejor bitmap posible en tamaños pequeños o baja resolución
Hinting
• Si el sistema no puede usar tonos de gris, el redondeo produce efectos poco agradables a la vista
Hinting para mantener color
• Grosor constante de los trazos
Hinting para legibilidad
• A bajas resoluciones es complicado representar un carácter
Hinting para espaciado
• El espaciado entre palabras es sensible a los redondeos
Hinting y peso
• Diferencias entre la negrita y el texto plano
Hinting y alineación
• Altura de los diferentes elementos de la misma familia y entre distintas familias
¿Que es el hinting TrueType?
• En el formato TrueType, el hinting se define mediante pequeños programas que se ejecutan en una máquina virtual de pila, almacenados en el propio archivo de fuente.
• Como consecuencia, el resultado es adecuado tanto a baja como a alta resolución.
• Muy costosos (“Times New Roman” necesitó 12 años-hombre).
¿Qué es el hinting Postscript?
• En el formato Postscript, los hints son más sencillos. Son parámetros de un programa que optimiza el bitmap.
• Normalmente no se consiguen tan buenos resultados como con TrueType, pero el diseño es mucho más sencillo
Auto-hinting
• Algoritmos inteligentes que pueden aplicarse durante el diseño de una fuente o incluso en tiempo de ejecución (p.e. el motor de FreeType 2 determina el hinting al cargar el fichero de fuentes)
Antialias
• Si se dispone de más de dos colores, el hintingse completa con un suavizado de los trazos
Antialias
• El antialias permite leer texto de pocos puntos en una pantalla con poca densidad
Antialias subpixel
• En TFTs se pueden usar por separado los tres elementos de colos constituyentes de cada pixel
Cómo se dibujan las letras en la pantalla de un libro electrónico
• Hay antialias, pero no es subpixel
• Hay menos niveles de gris que en un TFT, luego el hinting es crítico
• Los resultados dependen de que el fuente esté embebido en el documento o se procese por el motor de fuentes del libro
Fuentes embebidas en documentos
• PDF: Se pueden insertar todas las fuentes, pero no lo hace por defecto
• ePub: El formato lo soporta, los lectores no siempre
• Mobipocket y AZW: Sólo el fuente por defecto en el lector
• LRF: Limitado por los fuentes en el lector
• Topaz: Soporta fuentes embebidos
Diseño de documentos
Tamaño de fuente
• Sistema Didot: La unidad es el cícero y la unidad menor es el punto. 1 punto = 0.375 mm
• Sistema Angloamericano: La unidad es la pica. Un punto de pica = 0.353 mm
• Una letra de 12 puntos en Pica es de 11 puntos en Didot
El área de escritura
• Componer documentos extensos requiere que el área de escritura se adecúe al contenido y al medio
• Hay diferentes escuelas que estudian cómo distribuir en el papel el texto, las figuras y los restantes elementos del libro
Tamaños de página
• En la norma DIN la proporción entre ancho y alto es 1:1.414
• El formato de un libro que se mantiene en la mano al leerse es diferente del de un libro que se apoya en una mesa: los primeros son más altos que anchos 2:3 ó 1:1732.
Tamaños de página DIN
Ancho frente a alto
Legibilidad
• La línea debería tener 70 caracteres incluyendo espacios
• Cuanto menos decorativos sean los fuentes, más legibles serán
• Times Roman es más estrecho que Times newspaper. Los fuentes menores de 8 puntos no se leen fácilmente
Posicionamiento
• Posicionamiento canónico
Posicionamiento
• Posicionamientos de Tschichold y van de Graaf
Corrección para encuadernado
• En textos impresos, el posicionamiento se corrige para corregir el encuadernado
• En libros electrónicos, para aprovechar el área, es frecuente eliminar los márgenes externos
Resumen de las reglas
• Si el área de escritura debe ser tan alta como el ancho de la página, papel 3:4 y texto 2:3
• El método de Graaf sirve para cualquier proporción
• La longitud de una línea no debería superar los 70 caracteres
• El ancho se ajusta de acuerdo con el tamaño del fuente
Kerning
• Es el espaciado entre las letras. Hay espacios poco visuales entre W, Y, V, T, L
• Se ajusta cuando el tamaño del fuente es grande
Tracking
• En algunos fuentes se ajusta globalmente el espacio aunque el tamaño sea pequeño
Longitud de las líneas
• Es el parámetro más importante
• 7 a 12 palabras por línea (o 70 caracteres)
Longitud de línea
Leading
• Espacio entre líneas de un párrafo
• Generalmente al 120% (texto número 3 en la figura)
Encabezamientos
1. Distancia
2. Tamaño
3. Línea abierta
4. Sin espacio
5. Mayúsculas y negrita
6. Color
7. Subrayado al inicio
8. Subrayado intermedio
Dibujos e ilustraciones
Ecuaciones
• Hay un conjunto bastante extenso de reglas de tipografía para los documentos de ciencias y de matemáticas
• Algunos sistemas de composición (TeX, LaTeX) cumplen automáticamente esas normas