Tema: typography
-
Carga de fuentes web: font-display, preload, subconjuntos con unicode-range y alternativas ajustadas por métricas
Mostrar texto en el primer renderizado y cargar la fuente de marca sin saltos de maquetación: crear subconjuntos de las tipografías con unicode-range para descargar solo los sistemas de escritura usados, elegir font-display según el papel (optional para el cuerpo de texto, swap para los títulos), precargar con crossorigin los archivos del primer renderizado y declarar una fuente alternativa con size-adjust y las anulaciones de ascent/descent para que las líneas se ajusten igual antes y después del intercambio.
-
Texto de cuerpo legible: longitud de línea, interlineado y contraste
Tres propiedades deciden si un texto largo se lee cómodamente: la longitud de línea (el criterio AAA de las WCAG la limita a 80 caracteres), el interlineado (debe ser posible al menos 1,5 veces el tamaño de la fuente sin que el diseño se rompa) y el contraste (4,5:1 para texto normal, 3:1 para texto grande). Fijarlos en unidades relativas para que las personas usuarias puedan ampliar el texto y reespaciarlo.
-
Texto de cuerpo legible: medida, interlineado y contraste
Tres propiedades determinan si un texto largo se puede leer cómodamente: la longitud de línea (el criterio AAA de WCAG la limita a 80 caracteres), el interlineado (debe ser posible al menos 1,5 veces el tamaño de fuente sin romper el diseño) y el contraste (4,5:1 para texto normal, 3:1 para texto grande). Establecerlos en unidades relativas para que los usuarios puedan cambiar el tamaño y el espaciado del texto.
Legible por máquina: JSON