Toda conversación sobre estrategias de carga de fuentes — preloading, subsetting, ajuste de font-display — es consecuencia de una decisión que la mayoría de los equipos nunca toma conscientemente: si cargar fuentes siquiera. Para una gran clase de aplicaciones de alto rendimiento, la selección tipográfica correcta es la que ya está instalada en la máquina del usuario. Cero kilobytes, cero peticiones, cero desplazamiento de la maquetación, legible en el primer pintado.
Qué significa "pila del sistema" hoy
No estoy describiendo la vieja salida fácil de Arial, sans-serif. Una pila del sistema moderna es una composición deliberada:
font-family: ui-sans-serif, system-ui, -apple-system,
"Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;Esa única declaración te compra San Francisco en dispositivos Apple, Segoe UI en Windows, Roboto en Android — tres tipografías en cuyo perfeccionamiento los fabricantes de plataformas han invertido, en conjunto, cientos de millones de dólares para sus propias pantallas, con hinting y renderizado a cargo de los motores que mejor las conocen. Tus usuarios las leen todo el día; la familiaridad es en sí misma una característica de legibilidad, un punto que el capítulo de la Web Universal sobre selección de tipografías desarrolla con detalle.
Las pilas de serifa y monoespaciada merecen el mismo cuidado: ui-serif/Georgia/Charter para superficies de lectura, ui-monospace/SF Mono/Consolas/"Cascadia Code" para código y datos. La propia fuente de titulares de este sitio se apoya exactamente en esta lógica — una fuente comercial para quien la tenga, una cadena de respaldo afinada para todos los demás.
Cuándo cero es el número correcto
La decisión gira en torno a qué es la interfaz. Las pilas del sistema ganan cuando el producto es una herramienta: paneles de control, paneles de administración, interfaces de trading y monitorización, productos para desarrolladores, cualquier cosa que se use a todas horas y donde el trabajo de la tipografía sea desaparecer. En estas aplicaciones la fuente es pura infraestructura — nadie admira la tipografía de la cosa que le manda una alerta a las tres de la madrugada — y el presupuesto de rendimiento se gasta mejor en datos.
La fuente de marca se gana sus bytes cuando el producto es un lugar: superficies de marketing, lectura editorial, cualquier sitio donde la tipografía carga con la identidad. Este portafolio sirve fuentes web, deliberadamente; su tipografía es el contenido. Esa es la prueba — si borraras la fuente personalizada, ¿el producto significaría menos, o solo cargaría más rápido?
Diseñar el respaldo como si fuera la fuente
El oficio de una pila de cero kilobytes es disciplina métrica. Las distintas fuentes de plataforma tienen distintas alturas de la x y anchuras, así que una maquetación afinada solo en macOS respirará diferente en Windows. Tres herramientas cierran la brecha:
font-size-adjustnormaliza las alturas de la x de los respaldos para que cada fuente de la cadena se lea al mismo tamaño efectivo.text-wrap: balanceyprettyabsorben las diferencias de salto de línea entre fuentes métricamente incompatibles.- Probar en la pila real — la disciplina que nadie practica. Captura la interfaz en Segoe, SF y Roboto; allí donde el diseño solo funciona en una de ellas, el diseño está mal.