So bindest du Google Fonts lokal ein: DSGVO-konform mit WordPress 

Am 24. Oktober 2022 von Christian Waske

So bindest du Google Fonts lokal ein: DSGVO-konform mit WordPress 

Wenn du ein oder mehrere Webseiten betreibst, und dein Theme oder Plugin Google Fonts nutzt, werden gewöhnlich Schriften direkt vom Google-Server nachgeladen. Neben der größeren Auswahl an Fonts spart dieses Vorgehen Zeit und Arbeit.

In den letzten Wochen haben auffällig viele Webseitenbetreiber, die Google Fonts nutzen, eine Abmahnung wegen Verstoß gegen die DSGVO erhalten. Dieser Abmahnung liegt in der Regel eine Schadenersatzforderung und Unterlassungserklärung bei. Häufig stammen die Abmahnungen auch von Privatpersonen, die systematisch Webseiten durchforsten. Den Webseitenbetreibern wird vorgeworfen, ohne Einwilligung des Nutzers Google Fonts extern über die Google Server eingebunden zu haben. Die Übermittlung von Nutzerdaten ohne vorherige Einwilligung ist ein Verstoß gegen die DSGVO, wenn der Nutzer nicht explizit zugestimmt hat. Und genau das passiert bei der dynamischen Einbindung von Google Fonts.

Google Fonts und der Datenschutz 

Beim Nachladen von Google Fonts wird die IP-Adresse des Nutzers automatisch und somit nicht datenschutzkonform an den Google-Server. IP-Adressen sind personenbezogene Daten und dürfen nicht ohne Einwilligung verarbeitet werden, sonst liegt ein Verstoß gegen die DSGVO vor.

Das Landgericht München hat bereits mit Urteil vom 20.01.2022 (Aktenzeichen: 3 O 17493/20) darüber entschieden, dass die externe Einbindung von Google Fonts nicht der DSGVO entspricht. Die Folgen können eine kostspielige Unterlassung und Schadenersatzansprüche sein. Auch das BGH-Urteil vom 16. Mai 2017 (Aktenzeichen: VI ZR 135/13) macht deutlich, dass personenbezogene Daten nicht ohne Zustimmung des Benutzers erhoben und verarbeitet werden dürfen. Einige Anwälte und Privatpersonen verschicken derzeit Abmahnungen mit Schadenersatzforderungen, weil die Google Fonts nicht datenschutzkonform geladen werden. Die aktuelle Abmahnwelle könnte weitere Urteile hervorbringen.

Um rechtliche Auseinandersetzungen und den damit verbundenen Ärger zu vermeiden, solltest du Google Fonts lokalund damit DSGVO-konform einbinden. Dass selbst WordPress.org empfiehlt, Google Fonts lokal zu laden, macht noch einmal deutlich, wie ernst und wichtig dieses Thema ist. Es bleibt abzuwarten, wie weitere Urteile wegen der dynamischen Einbindung von Google Fonts ausfallen. Es ist auf jeden Fall sinnvoll, dich rechtzeitig mit dem Thema Google Fonts auseinanderzusetzen und auf deiner Webseite die Fonts lokal einzubinden.

So stellst du fest, ob du Google Fonts richtig eingebunden hast 

Bevor du Google Fonts lokal einbindest, musst du wissen, welche Fonts du verwendest und ersetzen möchtest. Hast du ein Plugin, um Google Fonts einzubinden, kannst du in den Einstellungen des Plugins die Fonts finden. Nutzt du ein Theme, welches Google Fonts nutzt, kannst du in deinen Theme-Einstellungen oder über den Customizer (Design – Customizer – Fonts) die eingebundenen Schriftarten ausfindig machen. Du findest die Fonts in der Regel unter folgenden Begriffen: Fonts, Schriftarten, Typografie. Alternativ kannst du über deinen Browser in der Entwicklerkonsole herausfinden, welche Schriftarten du auf deiner Webseite verwendest. Öffne dazu deinen Internetbrowser und drücke die Tasten STRG+SHIFT+j für Windows und Cmd + Option + J für Mac.

In Chrome klickst du auf den Reiter „Sources“. Du kannst nun in der linken Spalte die Daten sehen, die zu deiner Webseite geladen werden. Dort findest du auch die Information, ob Google Fonts extern über Google geladen werden (fonts.googleapis.com und fonts.gstatic.com).

In Firefox findest du den Reiter „Netzwerkanalyse“. Klicke diesen an und gib in das Eingabefeld „fonts“ ein. Es werden dir die Fonts angezeigt, welche extern über Google geladen werden. In der rechten Spalte unter dem Punkt “Kopfzeilen”sehen Sie außerdem, welche Schriftart verwendet wird.

Wenn du die Fonts ausfindig gemacht hast, solltest du diese zunächst deaktivieren und im zweiten Schritt löschen. Um die Fonts auf den eigenen Server hochzuladen und lokal einzubinden, gibt es verschiedene Möglichkeiten.

So bindest du Google Fonts in WordPress richtig ein

Nachdem du herausgefunden hast, welche Google Fonts du benötigst, kannst du diese herunterladen und lokal einbinden. Wenn du mehrere Fonts einbinden möchtest, musst du die folgenden Schritte für alle gewünschten Schriftarten wiederholen.

Schritt 1: Google Fonts herunterladen

Um die Fonts herunterzuladen, rufe die Seite https://google-webfonts-helper.herokuapp.com/fonts auf und suche nach den gewünschten Fonts. Im Suchfeld gibst du die gewünschte Schriftart ein und wählst im Anschluss die dazugehörigen Zeichensätze und Schriftschnitte aus. In deiner Entwicklerkonsole findest du die Daten dazu.

Schritt 2: CSS-Code ausfindig machen

Nach Auswahl der gewünschten Schriftart und dazugehörigen Konfiguration wird ein CSS-Code für deine Fonts generiert. Diesen kannst du unter Punkt 3 kopieren. Da du den CSS Code am Ende brauchst, fügst du diesen am besten in ein Textverarbeitungsprogramm ein. Du kannst für den CSS Code auch das Plugin Self-Hosted Google Fonts (https://wordpress.org/plugins/selfhost-google-fonts/) nutzen. 

Als Standardverzeichnis ist unter dem Punkt “Customize folder prefix (optional)” das Verzeichnis „/fonts“ eingestellt. Möchtest du die Fonts in einem anderen Pfad ablegen, solltest du bereits an dieser Stelle das Verzeichnis anpassen. Das spart dir zu einem späteren Zeitpunkt Zeit.

Schritt 3: Dateien herunterladen

Unter Punkt 4 kannst du im Anschluss deine Dateien herunterladen. Deine Google Fonts findest du nun als ZIP-Datei auf deinem Computer. Möchtest du mehrere Google Fonts auf deiner Webseite nutzen, wiederholst du die Schritte für jede deiner gewählten Fonts.

Schritt 4: Google Fonts Dateien hochladen

Nach dem Download deiner Datei musst du diese hochladen. Du findest auf deinem Computer eine Datei mit den ausgewählten Google Fonts in verschiedenen Formaten (EOT, WOFF, WOFF2, TTF, SVG). Diese Datei musst du auf deinen Server hochladen. In Schritt 3 hast du ein Verzeichnis für deine Google Fonts ausgewählt, dieses legst du in deinem Webspace an und kopierst die Fonts hinein.

Schritt 5: CSS der Website anpassen

Du hast die Google Fonts in deinem eigenen Webspace abgelegt. Jetzt musst du nur noch die notwendigen CSS-Anpassungen erledigen. Unter Punkt 2 wurde dir der CSS-Code angezeigt. Wenn du diesen kopiert hast, kannst du ihn jetzt in die style.css-Datei einbinden und die alte .css Datei mit dem neuen Code überschreiben.

Schritt 6: Einbindung von Google Fonts überprüfen

Überprüfe im letzten Schritt, ob die Google Fonts lokal eingebunden wurden und keine Verbindung mehr zum Google Server besteht. In deiner Entwicklerkonsole kannst du unter dem Reiter „Sources“ nachsehen, ob deine Google Fonts von deinem Server geladen werden. Wenn du deinen Cache löschst, stellst du sicher, dass deine Webseite den aktuellen CSS Code nutzt und damit die von dir lokal eingebundenen Google Fonts.

Fazit zur lokalen Einbindung von Google Fonts

Wenn du die oben aufgeführten Schritte berücksichtigst, lassen sich Google Fonts lokal über deinen Server laden und du handelst damit DSGVO-konform. Da bei der lokalen Einbindung von Google Fonts keine automatischen Updates vorgenommen werden, kannst du dir hierzu ein Plugin installieren. Auch wenn deine Serverauslastung mit der lokalen Einbindung von Google Fonts größer ist, ist dieses Vorgehen derzeit die bessere Lösung. Beim Thema Ladezeiten scheiden sich die Geister.

So gehst du vor, wenn du eine Abmahnung wegen Google Fonts erhalten hast

Wenn du eine Abmahnung wegen der externen Einbindung von Google Fonts erhalten hast, ist es wichtig, dass du einen kühlen Kopf bewahrst und dich nicht einschüchtern lässt.

Wichtig ist, auf die Abmahnung zu reagieren und die dort genannten Fristen zu berücksichtigen. Ignorierst du die Abmahnung, kann das zu weiteren unnötigen Kosten und Zeitaufwand führen. Im ersten Schritt solltest du dir einen Überblick über die Eckdaten der Abmahnung verschaffen:

  • Überprüfe, ob auf deiner Webseite ein datenschutzrechtlicher Verstoß vorliegt und du die Schriftarten von Google Fonts zum Zeitpunkt der Abmahnung tatsächlich extern eingebunden hast. Das erkennst du an dem Quellcode, der dir mit der Abmahnung übersandt wird (googleapis.com oder fonts.gstatic.com). Solltest du Google Fonts extern eingebunden haben, ändere dies umgehend ab. Die Anleitung dazu findest du oben im Text.
  • Widerspreche der Zahlungsaufforderung und unterschreibe auf keinen Fall die beigefügte Unterlassungserklärung. Hattest du Google Fonts bereits lokal eingebunden, kannst du den Verfasser des Abmahnschreibens darauf hinweisen, dass die Einbindung der Google Fonts auf deiner Webseite nicht extern stattfindet und beim Besuch deiner Webseite keine Verbindung zu den Google Servern aufgebaut wird.
  • Du kannst die rechtsanwaltliche Vollmacht im Original anfordern, um sicherzustellen, dass die Abmahnung korrekt verfasst und nicht im Rahmen der Abmahnwelle erstellt wurde.
  • Wenn du dir nicht sicher bist, ob die Abmahnung gerechtfertigt ist, lasse dich rechtlich beraten.

Gerne unterstützen wir dich bei der lokalen Einbindung von Google Fonts, deiner Schriftarten generell und einem DSGVO-Check deiner Webseite. Auch wenn du bereits eine Abmahnung erhalten hast, sind wir gerne für dich da.