Responsive Typography

Libro breve de Jason Pamental, diseñador y referente en tipografía web, que defiende la tipografía como pieza central del diseño web responsive. Escrito en 2014, cuando las web fonts con @font-face ya eran habituales, organiza el tema en cuatro cualidades: que sea eficiente (performant), progresiva, proporcional y pulida. Está dirigido a diseñadores y desarrolladores frontend de nivel intermedio que se manejan con HTML y CSS y quieren usar fuentes web sin perjudicar el rendimiento.

La primera parte cuenta la historia: terminología tipográfica, la evolución de la tipografía en la web (de las técnicas de reemplazo de fuentes a @font-face), los formatos de fuente que soporta cada navegador, el renderizado y el hinting, y el lugar de la tipografía en el proceso de diseño. La segunda es práctica. Compara alojar las fuentes uno mismo con usar un servicio como Google Fonts, Adobe Typekit, Fonts.com o Typography.com, y enseña a cargarlas rápido con Google Web Font Loader y con subsets que incluyen solo los caracteres usados. Explica cómo manejar el FOUT (destello de texto sin estilo) y ajustar el CSS de respaldo, qué unidades de medida usar (em, rem), cómo construir una escala tipográfica modular que cambia con el tamaño de pantalla, el guionado y el espacio en blanco. También cubre los detalles finos: ligaduras, kerning y funciones OpenType con font-feature-settings, viudas, letras capitulares e icon fonts. Los apéndices tratan los servicios de fuentes y la tipografía en correos electrónicos.

Incluye ejemplos de CSS y JavaScript con un repositorio de código de apoyo, pero no desarrolla un proyecto completo. Es una lectura corta y muy útil para entender la tipografía web con criterio de diseño y de rendimiento a la vez. Hay que tener en cuenta que es anterior a font-display, a las fuentes variables (un tema en el que Pamental se especializó después) y a clamp() para tipografía fluida. Por eso varias técnicas de carga están hoy superadas, aunque los principios siguen vigentes.