Trabajar con Google Fonts

¿Qué son las fuentes de Google?

Las fuentes son archivos que contienen la descripción de cómo el navegador puede mostrar un texto determinado. Google ofrece varios archivos de fuentes en sus servidores. Para muchos diseñadores web, es muy fácil utilizar las fuentes de Google para diseñar el sitio web de una manera determinada.

¿Por qué son un problema las fuentes de Google?

Al utilizar Google Fonts a través de los servidores de Google, el navegador del visitante descargará los archivos de fuentes directamente desde Google. Por lo tanto, Google recibirá la dirección IP, la información del navegador y otros datos del visitante, y podrá utilizarlos para sus propios fines. Varias autoridades de protección de datos ya han confirmado que este uso de Google Fonts va en contra de los principios de minimización de datos del RGPD.

¿Cómo se trabaja con Google Fonts?

La mejor forma de utilizar los archivos de fuentes es descargarlos de los servidores de Google y colocarlos directamente en tu propio servidor. De esta manera, Google ya no interviene y no se incumplen los principios de protección de datos.

La segunda mejor opción es permitir que ConsentManager bloquee estas fuentes.

¿Cómo se descargan las fuentes de Google?

  1. Para descargar los archivos de fuentes de Google, puedes utilizar herramientas como Google Web Font Helper. Te permite descargar los archivos en un archivo ZIP.
  2. Descomprime el archivo ZIP y sube los archivos a tu servidor web.
  3. Actualiza el código HTML de tu sitio web y cambia la ubicación de los archivos de fuentes:

Código original de Google Font (ejemplo):

<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@100&display=swap" rel="stylesheet"> 

Versión actualizada que apunta a tu servidor (ejemplo):

<link href="https://meinserver.de/myfontfile.css" rel="stylesheet"> 

Habilitar el bloqueo automático de fuentes

Por defecto, el código de bloqueo automático no bloquea las fuentes ni las hojas de estilo. Puedes habilitar esta opción en Menú > CMP > Editar > Otros ajustes > Bloquear hojas de estilo:

Ten en cuenta que el bloqueo automático no es seguro para el RGPD. Los navegadores modernos pueden descargar las fuentes antes de que el bloqueo se active y, por lo tanto, el bloqueo no se produzca.

Bloqueo manual de Google Fonts

Si utilizas el bloqueo manual, puedes bloquear las fuentes actualizando el <link ..> código. Ejemplo:

<link class="cmplazyload" data-cmp-vendor="s2612" data-cmp-href="https://fonts.googleapis.com/css2?family=Roboto:wght@100&display=swap" rel="stylesheet"> 

We do our best to keep this purely informative documentation up to date. However, if you notice that any of these guides need a little touch-up, let us know!