Diseño Web

Por qué tus páginas en chino cargan más lento — y 3 arreglos de fuente que cierran la brecha

Las páginas en chino de un sitio bilingüe suelen cargar más lento porque las fuentes chinas deben cubrir muchos más caracteres. Según web.dev de Google, una fuente CJK cubre entre 15 y 20 veces más caracteres que una fuente latina — y tres arreglos (fuente del sistema, subconjuntos de caracteres y unicode-range) cierran la brecha sin rediseñar el sitio.

Las páginas en chino de un sitio bilingüe suelen cargar más lento que sus versiones en inglés, y la causa casi siempre es la fuente tipográfica: una fuente china debe cubrir muchos más caracteres que una fuente latina, así que el archivo que el navegador descarga antes de mostrar texto chino es mucho más pesado. La solución no requiere rediseñar el sitio: basta con enviar solo los caracteres que la página realmente usa, o evitar por completo la fuente descargada para el texto chino.

¿Por qué la versión en chino de mi sitio se siente más lenta?

El inglés solo necesita unos 100 caracteres (alfabeto latino, números y puntuación). El chino usa miles de caracteres comunes. Según la documentación oficial de Google en web.dev, una fuente CJK (chino/japonés/coreano) cubre aproximadamente de 15 a 20 veces más caracteres que una fuente latina, por lo que el archivo de fuente china suele ser varias veces más pesado que el inglés en la misma página.

¿Vale la pena arreglarlo en un sitio de pequeña empresa?

Sí. El tiempo que tarda en aparecer el contenido principal (Largest Contentful Paint) es parte de los Core Web Vitals de Google y afecta tanto la experiencia del usuario como el posicionamiento. Además, el problema es fácil de pasar por alto: la mayoría de los propietarios solo prueba la versión en inglés y nunca abre la pestaña de red en la página china.

La solución más simple: no descargar fuente para el texto chino

Todo sistema operativo moderno ya incluye una fuente china de alta calidad: PingFang SC/TC en Apple, Microsoft YaHei en Windows, Noto Sans CJK en Android/ChromeOS. Colocar estas fuentes del sistema antes de cualquier fuente personalizada hace que el navegador muestre el texto chino al instante, sin descargar nada:

font-family: "PingFang SC", "Microsoft YaHei", "Noto Sans CJK SC", sans-serif;

Si necesito una fuente china personalizada, ¿cómo la mantengo ligera?

Desde 2011, Google permite agregar un parámetro text= a una solicitud de Google Fonts para que la API devuelva solo los caracteres indicados, no el archivo completo, también para fuentes CJK. Combinado con unicode-range en CSS, la propia documentación de web.dev indica que este enfoque puede reducir la transferencia del archivo de fuente en alrededor de un 90%.

Lista de verificación rápida

  • Abre la página de inicio en chino (no la de inglés) en las DevTools de Chrome, pestaña Red, filtro "Font".
  • Compara los KB transferidos en fuentes entre la versión china y la inglesa.
  • Confirma si ya usas una fuente del sistema o estás descargando una fuente china completa.
  • Verifica que tu CSS use font-display: swap.

Preguntas frecuentes

¿Cambiar a una fuente del sistema altera el diseño?

Muy poco. PingFang SC, Microsoft YaHei y Noto Sans CJK son tipografías chinas limpias y legibles por diseño.

¿Esto también ayuda a mis páginas en inglés?

Las mismas técnicas aplican a cualquier fuente, pero la brecha de tamaño que describe este artículo es específica de las fuentes CJK.

¿Necesito rehacer todo el sitio?

No. Es un cambio de CSS y carga de fuentes, no un rediseño.

Así construimos sitios bilingües en nuestra página de diseño web, o solicita una revisión gratuita de la carga de fuentes de tu sitio.

Fuentes