Durante más de una década, la carga dinámica de fuentes tipográficas desde fonts.googleapis.com y fonts.gstatic.com fue la práctica habitual en temas y plugins de WordPress. Una simple etiqueta <link> en la cabecera bastaba para utilizar miles de tipografías. Sin embargo, a la luz del Reglamento General de Protección de Datos (RGPD) y de la optimización de Core Web Vitals, este esquema genera graves riesgos jurídicos y retrasos en la carga.
En esta guía analizamos la base jurídica derivada de la conocida sentencia del tribunal de Múnich, explicamos por qué la dirección IP es un dato personal y mostramos cómo implantar una arquitectura de fuentes locales WOFF2 sin fugas en WordPress y WooCommerce.
1. La Sentencia del LG München I (Asunto n.º 3 O 17493/20): Hechos y Fundamentos
El 20 de enero de 2022, la 3.ª Sala Civil del Tribunal Regional de Múnich I (Landgericht München I, Asunto n.º 3 O 17493/20) dictó una sentencia pionera que desató una oleada de reclamaciones extrajudiciales y auditorías en toda la Unión Europea.
Los Hechos
La empresa demandada gestionaba un sitio web comercial en el que integró fuentes de Google Fonts servidas directamente desde los servidores de Google LLC en Estados Unidos. Cada vez que un usuario visitaba la web, su navegador enviaba automáticamente una solicitud HTTP a Google transmitiendo:
- La dirección IP pública completa del usuario.
- La cabecera User-Agent (detalles del sistema operativo y navegador).
- La cabecera HTTP Referer con la URL exacta de la página visitada.
Conclusiones Jurídicas del Tribunal
El tribunal dictaminó que este tratamiento vulneraba el Reglamento (UE) 2016/679 (RGPD):
- La dirección IP como dato personal: Conforme al Art. 4, punto 1 del RGPD y a la jurisprudencia consolidada del Tribunal de Justicia de la Unión Europea (sentencia de 19 de octubre de 2016, Asunto C-582/14 Patrick Breyer contra República Federal de Alemania), una dirección IP dinámica constituye un dato personal, ya que existen cauces legales para identificar al titular de la conexión.
- Falta de consentimiento según el Art. 6, ap. 1, letra a) del RGPD: El usuario no había otorgado un consentimiento previo, informado e inequívoco antes de la transferencia de sus datos a Google LLC.
- Rechazo del interés legítimo (Art. 6, ap. 1, letra f) del RGPD): La parte demandada alegó que la llamada externa era necesaria por coherencia estética y rendimiento. El tribunal rechazó de plano este argumento. Indicó que las fuentes se pueden descargar y alojar localmente en el propio servidor web sin necesidad de enviar información a terceros en terceros países (cumpliendo así con el principio general de transferencia del Art. 44 del RGPD).
- Indemnización según el Art. 82, ap. 1 del RGPD: El tribunal concedió al demandante 100 EUR por daños morales derivados de la pérdida de control sobre sus datos personales y advirtió de multas de hasta 250 000 EUR en caso de reincidencia.
2. Por qué los banners de cookies no son la solución adecuada
Un intento habitual de esquivar el problema consiste en condicionar la carga de Google Fonts al botón de “Aceptar todo” del banner de consentimiento (CMP).
Esta práctica plantea serios inconvenientes técnicos:
- Desajustes de diseño (FOIT / FOUT): Si el visitante rechaza las cookies analíticas o de marketing, la página se renderiza con tipografías de sustitución del sistema (como Times New Roman), provocando saltos bruscos en el Cumulative Layout Shift (CLS).
- Carga diferida del texto: Las fuentes no empiezan a descargarse hasta que el script de cookies se inicializa y el usuario interactúa, lo que degrada notablemente el Largest Contentful Paint (LCP).
- Pérdida de conversión: Quien rechaza el rastreo merece una experiencia de compra igualmente nítida y profesional.
La tipografía es un recurso estructural de presentación, no una herramienta publicitaria. Debe residir de forma nativa en el servidor de la tienda.
3. Ventajas de rendimiento del alojamiento local (Core Web Vitals)
La idea de que la CDN de Google es más rápida gracias a la caché compartida entre sitios dejó de ser válida desde que los navegadores modernos adoptaron la partición de caché (cache partitioning). Para evitar el rastreo entre dominios y las técnicas de fingerprinting, Chrome, Firefox y Safari mantienen memorias caché totalmente aisladas por cada dominio de primer nivel.
Alojar archivos WOFF2 en tu propio servidor aporta beneficios directos:
| Parámetro | Google Fonts Externo | Alojamiento Local WOFF2 |
|---|---|---|
| Conexiones externas | 2 dominios de terceros (fonts.googleapis.com, fonts.gstatic.com) | 0 dominios adicionales (mismo host o tu propia CDN) |
| Sobrecarga DNS y TLS | 2 x resolución DNS + 2 x handshake TLS (100-250 ms perdidos) | 0 ms (reutilización del canal HTTP/2 o HTTP/3 ya abierto) |
| Resiliencia | Caídas en la red de Google afectan a la tipografía del sitio | 100% independiente y estable |
| Cumplimiento del RGPD | Riesgo elevado de sanción según Art. 6 y 44 | Plenamente conforme (cero transferencia de datos a EE. UU.) |
4. Opciones técnicas en el ecosistema WordPress
Existen dos vías principales para resolver la carga de fuentes en WordPress.
Opción A: Plugins monopropósito (ej.: OMGF / Host Webfonts Locally)
Desarrollado por Daan van den Bergh, OMGF está diseñado exclusivamente para capturar llamadas de Google Fonts:
- Funcionamiento: Rastrea las hojas de estilo encoladas, descarga los archivos WOFF2 al directorio
wp-content/uploads/omgf/y genera una hoja de estilos local. - Puntos fuertes: Solución directa para quien solo busca gestionar tipografías.
- Límites: Requiere regeneración y comprobación manual de la caché al actualizar temas.
Opción B: Suite integral de cumplimiento normativo (Shoplex)
En el comercio electrónico europeo, una tienda WooCommerce debe atender a múltiples exigencias legales de forma coordinada: la Directiva Ómnibus (precio más bajo en 30 días), la gestión de clientes B2B, el derecho de desistimiento, los sistemas de depósito de envases y las pautas del European Accessibility Act (EAA).
El plugin Shoplex integra todas estas funciones e incorpora el módulo nativo LocalFontsService:
- Filtrado automático sin fugas (zero-leakage): Intercepta las llamadas mediante el hook
style_loader_srcy elimina las etiquetas<link rel="preconnect" href="https://fonts.gstatic.com">antes de emitir el HTML. - Optimización WOFF2: Descarga solo variantes WOFF2 compactas con soporte completo para caracteres latinos extendidos (tildes,
ñ, diéresis), con pesos reducidos. - Caché persistente: Sirve los recursos con la cabecera
Cache-Control: public, max-age=31536000, immutable.
5. Implementación manual sin fugas en un tema a medida
Si desarrollas tu propio tema, puedes aplicar esta configuración directamente en PHP y CSS.
Paso 1: Desen этикетar fuentes externas del tema
add_action( 'wp_enqueue_scripts', function(): void {
wp_dequeue_style( 'theme-google-fonts' );
wp_deregister_style( 'theme-google-fonts' );
}, 999 );Paso 2: Limpiar sugerencias preconnect externas
add_filter( 'wp_resource_hints', function( array $urls, string $relation_type ): array {
if ( in_array( $relation_type, array( 'preconnect', 'dns-prefetch' ), true ) ) {
$urls = array_filter( $urls, static function( string $url ): bool {
return ! str_contains( $url, 'fonts.googleapis.com' )
&& ! str_contains( $url, 'fonts.gstatic.com' );
} );
}
return $urls;
}, 10, 2 );Paso 3: Declarar @font-face en tu archivo CSS
@font-face {
font-family: 'Inter';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url('/wp-content/themes/tu-tema/assets/fonts/inter-v13-latin-regular.woff2') format('woff2');
unicode-range: U+0000-00FF, U+0100-02AF;
}
@font-face {
font-family: 'Inter';
font-style: normal;
font-weight: 700;
font-display: swap;
src: url('/wp-content/themes/tu-tema/assets/fonts/inter-v13-latin-700.woff2') format('woff2');
unicode-range: U+0000-00FF, U+0100-02AF;
}6. Verificación en DevTools
Tras activar la configuración local, comprueba el tráfico de red:
- Abre una ventana de incógnito en tu navegador.
- Abre las Herramientas para Desarrolladores (F12) y dirígete a la pestaña Red (Network).
- Filtra por:
fonts. - Recarga la página (Ctrl+F5 o Cmd+Shift+R).
- Criterios de validación:
- Cero peticiones dirigidas a
fonts.googleapis.comofonts.gstatic.com. - Todos los ficheros
.woff2se descargan desde tu propio dominio o CDN. - La cabecera de respuesta confirma
content-type: font/woff2con directivas de caché adecuadas.
- Cero peticiones dirigidas a
Conclusión
El fallo del tribunal de Múnich dejó claro que la comodidad técnica no puede estar por encima de la privacidad del usuario, máxime cuando la alternativa local es accesible y segura.
El alojamiento local de Google Fonts en WordPress constituye una mejora técnica integral: asegura el cumplimiento riguroso del Art. 6 del RGPD y mejora los tiempos de carga en Core Web Vitals. Tanto si empleas herramientas monopropósito como OMGF, la solución global de Shoplex, o código propio en tu tema, eliminar las llamadas externas a Google Fonts debe formar parte del estándar de cualquier proyecto web moderno.
