DSGVO-Konforme Einbindung von Google Fonts

Kurze Antwort im Vorweg: Nein, das dyna­mi­sche Laden von Google Fonts ist nicht DSGVO-konform und kann zu einer Abmahnung führen.

Es ist wichtig zu beachten, dass die Ver­wen­dung von Google Fonts auf einer Website zur Über­tra­gung von Daten auf die Server von Google führen kann. Diese Daten­über­tra­gung beschränkt sich in der Regel auf Standard-Web­ser­ver­pro­to­kol­le, die Infor­ma­tio­nen wie die IP-Adresse des Nutzers und die Seiten der Website, die der Nutzer besucht, enthalten können. Des Weiteren verwendet Google die Daten des Google Web Crawlers, um fest­zu­stel­len, welche Websites Google Fonts verwenden. Die Infor­ma­tio­nen werden dann in der Datenbank Google BigQuery Fonts ver­öf­fent­licht und der Öffent­lich­keit zugäng­lich gemacht. 

Das führte im Jahr 2022 zu einem auf­se­hen­er­re­gen­den Urteil: Das Land­ge­richt München erklärte die Ver­wen­dung von Google Fonts für rechts­wid­rig, wenn diese dynamisch ein­ge­bun­den sind. Doch damit nicht genug, das Land­ge­richt München (Urteil vom 20.01.2022, Az. 3 O 17493/20) sprach dem Kläger zudem 100 Euro Schmer­zens­geld zu.

Als Inhaber einer Website sind Sie also dafür ver­ant­wort­lich, dass Sie die DSGVO und andere ein­schlä­gi­ge Daten­schutz­ge­set­ze einhalten, wenn Sie Google Fonts oder andere Dienste von Dritt­an­bie­tern auf Ihrer Website nutzen. Dies bedeutet, dass Sie die Zustim­mung der Nutzer zur Erfassung und Ver­wen­dung ihrer Daten einholen und in den Daten­schutz­be­stim­mun­gen Ihrer Website klare und präzise Infor­ma­tio­nen über die Daten­ver­wen­dung bereit­stel­len müssen.

Was sind Google Fonts?

Google Fonts ist ein inter­ak­ti­ves Ver­zeich­nis mit kos­ten­lo­sen, soge­nann­ten Open-Source Schrift­ar­ten, das sich im Besitz von Google befindet und von diesem betrieben wird. Google Fonts ist für die Ver­wen­dung auf Websites und anderen digitalen Produkten kon­zi­piert und kann von jedermann ohne Ein­schrän­kung genutzt werden. Derzeit können Nutzer aus über 1400 ver­schie­de­nen Schrift­ar­ten wählen.

Was sind google fonts?
Quelle: fonts.google.com

Wie werden Google Fonts ein­ge­bun­den?

Es gibt zwei Mög­lich­kei­ten, Google Fonts ein­zu­bet­ten: dynamisch und lokal.

Dyna­mi­sche Inte­gra­ti­on = rechts­wid­rig

Bei einer dyna­mi­schen Inte­gra­ti­on werden Google-Domains mit Ser­ver­stand­or­ten teilweise in den USA genutzt, um die Google-Schriften her­un­ter­zu­la­den. Dies hat den Vorteil von kurzen Abruf­zei­ten (je nach Standort der Nutzer), da die Server von Google sehr schnell sind. Außerdem werden sehr beliebte Schrift­ar­ten oft auf den Geräten (Cache) der Nutzer zwi­schen­ge­spei­chert, was ein weiteres Argument für die Ver­wen­dung dieser Schriften darstellt. Der weitere Vorteil ist die Fle­xi­bi­li­tät: Mit dem dyna­mi­schen Laden haben Sie die Mög­lich­keit, die auf Ihrer Website ver­wen­de­ten Schrift­ar­ten im Hand­um­dre­hen zu ändern, ohne eine voll­stän­di­ge Aktua­li­sie­rung der Seite vornehmen zu müssen. Dies kann nützlich sein, wenn Sie mit ver­schie­de­nen Schrift­kom­bi­na­tio­nen expe­ri­men­tie­ren oder das Design Ihrer Website aktua­li­sie­ren möchten.

Sind Google Fonts über den Google-Server inte­griert, baut die Seite bei jedem Laden der Website eine Ver­bin­dung zu Google auf. Um die DSGVO ein­zu­hal­ten, benötigen Sie daher die Zustim­mung des Website-Nutzers in Form von einem ent­spre­chen­den Hinweis im Cookie-Banner, was stan­dard­mä­ßig nicht vor­ge­se­hen ist und daher ein gewisses Know-how erfordert. Und ganz ehrlich, wer will auf seinem Blog die Besucher mit einem Consent-Banner nerven?

 

Lokale Inte­gra­ti­on

Die zweite Mög­lich­keit ist die lokale Ein­bin­dung. In diesem Fall müssen die Schrift­ar­ten entweder manuell oder mithilfe eines Plugins her­un­ter­ge­la­den und dann auf Ihren eigenen Webspace hoch­ge­la­den werden. Auf diese Weise werden keine Daten an Dritte gesendet.

Es gibt einige poten­zi­el­le Vorteile, Google Fonts lokal zu hosten, anstatt sie von den Google-Servern zu laden:

  • Ver­bes­ser­te Per­for­mance: Lokales Hosting kann zu schnel­le­ren Lade­zei­ten führen, da die Schrift­ar­ten von Ihrem eigenen Server geladen werden. Dies kann vor allem dann von Vorteil sein, wenn Ihre Website viel von Nutzern aus ver­schie­de­nen Teilen der Welt besucht wird, da der Weg, den die Schrift­ar­ten zurück­le­gen müssen, kürzer sein kann.
  • Mehr Kontrolle: Wenn Sie Google Fonts lokal hosten, haben Sie mehr Kontrolle darüber, wie und wann die Schrift­ar­ten Ihren Nutzern zur Verfügung gestellt werden. Dies kann nützlich sein, wenn Sie den Lade­vor­gang der Schrift­ar­ten anpassen oder Ihre eigene Caching-Strategie imple­men­tie­ren möchten.
  • Geringere Abhän­gig­keit von externen Servern: Lokales Hosting ver­rin­gert die Abhän­gig­keit von externen Servern, was von Vorteil sein kann, wenn Sie sich Sorgen um die Ver­füg­bar­keit oder Sicher­heit dieser Server machen.

Google Fonts lokal hosten mit WordPress

Der erste Schritt besteht darin zu prüfen, ob Google Fonts bei Ihnen dynamisch geladen werden oder nicht. Das lässt sich ganz einfach mithilfe dieses Tool her­aus­fin­den: 

Wurden auf Ihrer Website von Google Servern geladene Schrift­ar­ten gefunden? Dann haben Sie mehrere Mög­lich­kei­ten, diese lokal ein­zu­bin­den. 

 

1. Coding-Option

Eine Mög­lich­keit, lokal gehostete Schrift­ar­ten zu imple­men­tie­ren besteht darin, den erfor­der­li­chen Code in die CSS-Datei Ihrer Website ein­zu­fü­gen. Dies beinhal­tet das Her­un­ter­la­den der Schrift­da­tei­en und deren Hochladen auf Ihren Server sowie das Verweisen auf sie in Ihrer CSS-Datei. Bei­spiels­wei­se würden Sie folgenden Code in Ihre CSS-Datei einfügen, um auf die Schrift­da­tei­en zu verweisen:

            /* CSS-Code zur Verwendung von lokal gehosteten Schriftarten */
@font-face {
    font-family: 'MeineSchriftart'; /* Name Ihrer Schriftart */
    src: url('pfad/zur/schriftdatei.woff2') format('woff2'), /* Pfad zur WOFF2-Datei */
         url('pfad/zur/schriftdatei.woff') format('woff'); /* Pfad zur WOFF-Datei */
    /* Weitere Formate (z. B. ttf, otf) können ebenfalls hier hinzugefügt werden */
    /* Weitere CSS-Eigenschaften für die Schriftart können hier definiert werden */
}

/* Beispielverwendung der lokal gehosteten Schriftart */
body {
    font-family: 'MeineSchriftart', sans-serif; /* Verweis auf die lokal gehostete Schriftart */
    /* Weitere CSS-Stile für den Text können hier definiert werden */
}

        

In diesem Code­bei­spiel wird die Schrift­art mit dem Namen ‚Mei­ne­Schrift­art‘ lokal gehostet und in der CSS-Datei refe­ren­ziert. Stellen Sie sicher, dass Sie den Pfad zu Ihren eigenen Schrift­da­tei­en richtig angeben und die ent­spre­chen­den Formate (wie WOFF2 und WOFF) für eine bessere Brow­ser­kom­pa­ti­bi­li­tät verwenden.

Die zweite Mög­lich­keit, ist Google Fonts zu deak­ti­vie­ren:

  1. Verwenden Sie ein Plugin: Es gibt Plugins wie „Disable and Remove Google Fonts“ oder „Remove Google Fonts Refe­ren­ces“, die auto­ma­tisch die Verweise auf Google-Schrift­ar­ten aus Ihrem Theme entfernen können.

  2. Bear­bei­ten Sie den Code Ihres WordPress-Themes: Sie können auch manuell die Verweise auf Google-Schrift­ar­ten aus dem Code Ihres Themes entfernen. Dazu müssen Sie auf die Style­sheet des Themas (style.css) zugreifen und nach Verweisen auf „googleapis.com“ oder „fonts.googleapis.com“ suchen und diese entfernen.

  3. Verwenden Sie ein benut­zer­de­fi­nier­tes CSS: Sie können auch ein benut­zer­de­fi­nier­tes CSS verwenden, um die im Theme ver­wen­de­te Google-Schrift­art zu über­schrei­ben, indem Sie folgenden CSS-Code in das benut­zer­de­fi­nier­te CSS-Feld des Themas oder in einem Plugin wie simple custom CSS einfügen:

Es ist wichtig zu erwähnen, dass das Deak­ti­vie­ren von Google-Schrift­ar­ten nicht die Ein­hal­tung der DSGVO garan­tiert, wenn Sie nicht lokal gehostete Schrift­ar­ten verwenden.

Bitte beachten Sie, dass das Deak­ti­vie­ren von Google-Schrift­ar­ten je nach Theme Aus­wir­kun­gen auf das Gesamt­de­sign Ihrer Website haben kann. Es wird empfohlen, die Ände­run­gen in einer Staging-Umgebung zu testen, bevor Sie sie auf einer Live-Website anwenden!

2. WordPress-Plugins

Eine weitere Mög­lich­keit besteht darin, ein Plugin wie „Use Any Font“ oder „Easy Google Fonts“ zu verwenden, mit dem Sie einfach benut­zer­de­fi­nier­te Schrift­ar­ten auf Ihrer Website hochladen und verwenden können. Diese Plugins haben in der Regel eine benut­zer­freund­li­che Ober­flä­che, mit der Sie Schrift­da­tei­en hochladen und diese auf bestimmte Elemente Ihrer Website anwenden können, ohne Code schreiben zu müssen.

Der Vorgang bei dieser Option ist fast immer gleich:

  1. Suchen Sie nach dem Plugin „Use Any Font“ und klicken Sie auf „Instal­lie­ren“
  2. Akti­vie­ren Sie das „Use Any Font“-Plugin über das Menü „Plugins“ in WordPress.
  3. Holen Sie sich den API-Schlüssel und veri­fi­zie­ren Sie ihn (erfor­der­lich, um eine Ver­bin­dung zum Server für die Schrift­art-Kon­ver­tie­rung her­zu­stel­len)
  4. Wählen Sie „Use Any Font“ unter „Ein­stel­lun­gen“
  5. Laden Sie eine benut­zer­de­fi­nier­te Schrift­art hoch / fügen Sie diese hinzu.
  6. Weisen Sie Ihre benut­zer­de­fi­nier­te Schrift­art Elementen zu.
  7. Sie können die benut­zer­de­fi­nier­te Schrift­art auch direkt aus dem WordPress-Seiten- / Bei­trags­edi­tor zuweisen.
  8. Ihre Schrift­ar­ten werden jetzt auf Ihrer Website verwendet.
  9. Sie können sich die Screen­shots-Regis­ter­kar­te für visuelle Anwei­sun­gen ansehen.

Wichtig: Mit der kos­ten­lo­sen Version des Plugins lässt sich nur eine einzige Schrift­art einbinden – z. B. Poppins Regular. Die gute Nachricht ist, dass eine Premium-Lizenz nur 9,99 US-Dollar kostet und muss nur einmal gekauft werden – bleibt also für immer in Ihrem Besitz. Eine Inves­ti­ti­on, die sich durchaus lohnen kann. 🙂

3. Elementor PRO

Wenn Sie den Elementor PRO Website Builder verwenden, können Sie lokal gehostete Schrift­ar­ten einfach durch den Theme-Builder und die Bear­bei­tung der Global Typo­gra­phy imple­men­tie­ren. 

Die Schrift­ar­ten werden trotzdem von Google Fonts Checker gefunden. Was kann ich tun?

Wenn Sie trotz Ver­wen­dung eines Plugins immer noch Google-Schrift­ar­ten finden, gibt es einige Dinge, die Sie versuchen können:

  1. Über­prü­fen Sie die Ein­stel­lun­gen des Plugins: Stellen Sie sicher, dass das Plugin ord­nungs­ge­mäß kon­fi­gu­riert ist und dass alle Optionen zum Deak­ti­vie­ren von Google-Schrift­ar­ten aktiviert sind.

  2. Theme-Updates: Einige Themes können Updates enthalten, die Google-Schrift­ar­ten erneut akti­vie­ren, stellen Sie also sicher, dass Ihr Theme auf dem neuesten Stand ist.

  3. Hart­ko­dier­te Verweise: Einige Themes können hart­ko­dier­te Verweise auf Google-Schrift­ar­ten im Code des WordPress-Themes enthalten. Sie müssen diese Verweise manuell suchen und entfernen.

  4. Caching: Einige Caching-Plugins oder Server-Caching können die Ände­run­gen, die Sie vor­ge­nom­men haben, nicht aktua­li­sie­ren, stellen Sie also sicher, dass Sie den Cache Ihrer Website nach dem Deak­ti­vie­ren von Google-Schrift­ar­ten löschen.

  5. Cloud­fla­re: Wenn Sie Cloud­fla­re verwenden, über­prü­fen Sie, ob die Ein­stel­lun­gen unter dem Reiter „Leistung“ korrekt kon­fi­gu­riert sind, da dies dazu führen kann, dass die Schrift­ar­ten von Google geladen werden.

  6. Andere Plugins: Einige andere Plugins können die Google-Schrift­ar­ten laden, Sie können die Quelle der Schrift­ar­ten mithilfe von Browser-Ent­wick­ler­werk­zeu­gen über­prü­fen.