Google Fonts DSGVO-konform einbinden
Abmahnung wegen Google Fonts: Was tun?
Sie sind für Websites leicht integrierbar, kostenfrei nutzbar und bieten eine Auswahl von weit über 1000 Schriftarten. 3 Gründe, warum Google Fonts (lizenzfreie, von Google bereitgestellte Schriftarten) bei Betreiber:innen großer Websites wie Zeit Online, heise.de oder sixt.com (Quelle: Builtwith vom 27.09.22) genauso viel Anklang finden wie bei kleineren Unternehmen.
Mit dem Urteil des Landesgerichts München Anfang 2022 (im Wortlaut) machte sich allerdings Verunsicherung in der Internetwelt breit. Google Fonts sind nicht mehr DSGVO-konform, hieß es. Etliche Mahnungsschreiben wegen Datenschutzverletzungen flatterten in die E-Mail-Postfächer. Garniert sind diese meist maschinell erstellten Schreiben mit der Aufforderung zum Begleichen des Schadenersatzes in Höhe von 100 Euro und der Abgabe einer Unterlassungserklärung.
Auf welche Weise Sie leicht herausfinden, wie Google Schriftarten auf Ihrer Website eingebunden ist, wann Sie nachbessern müssen und wie Sie bei einer Abmahnung vorgehen sollten, erläutern wir in diesem Artikel. Dabei beruhen die Hinweise auf unseren Erfahrungen als Website-Agentur. Sie sind keinesfalls durch eine Rechtsberatung mit Juristen zu ersetzen. Sollten Sie ein Schreiben erhalten und Google Fonts nicht DSGVO-konform eingebunden haben, empfehlen wir die Zuhilfenahme eines Rechtsbeistands.
Ich habe eine Abmahnung wegen Google Fonts erhalten. Was soll ich tun?
Zunächst einmal: Ruhe bewahren und nicht direkt auf die Forderung eingehen und voreilig Geld irgendwohin überweisen.
Haben Sie Google Fonts korrekt oder gar nicht eingebunden, besteht kein Grund zur Panik. Haben Sie die Schriftart so eingebunden, dass es nicht in Einklang mit der Datenschutzverordnung (DSGVO) ist, sollten Sie eine Rechtsberatung aufsuchen.
Sofern Sie nicht wissen, ob Sie Google Fonts auf Ihrer Website eingebunden haben bzw. in welcher Form, können Sie sich an folgender Checkliste entlang hangeln:
- Prüfen Sie, ob Google Fonts (oder andere Schriftarten wie AdobeFont oder FontAwesome) auf Ihrer Website im Einsatz sind ➔ Zur Prüfung
- Keine Nutzung von Google Fonts: Sie können das Schreiben (höchstwahrscheinlich von Trickbetrügern) getrost ignorieren.
- Nutzung von Google Fonts: Stellen Sie fest, ob Sie die Schriftart dynamisch oder lokal eingebunden haben. ➔ Zur Prüfung
- Lokal: Sie haben die Google Fonts DSGVO-konform eingebunden und können das Schreiben ignorieren.
- Dynamisch: Prüfen Sie, ob Sie in Ihren Datenschutzbestimmungen die Schriftart erfasst haben. Ferner sollte der User per Opt-out die Möglichkeit zum Verweigern der Bestimmungen haben. Die Einbindung eines Consent-Tools ist daher obligatorisch. Besser: Sie binden die Schriftart lokal ein.
Was bedeutet dynamische und lokale Einbindung von Google Fonts?
Die dynamische Variante der Font-Einbindung meint, dass bei jedem Aufruf einer Webseite eine Verbindung zu Google hergestellt wird. Durch die Anbindung zum Google-Server stellt dieser die Schriftart bereit. Während des Verbindungsaufbaus werden die personenbezogenen Daten an den Google-Server in den USA übermittelt. Dynamisch wird auch als remote Einbindung bezeichnet.
Unter lokaler Einbindung ist die Möglichkeit zu verstehen, bei der Sie die Google Fonts auf einem eigenen Server hosten. Die Schriftarten werden so vom eigenen Server beim Seitenaufruf geladen. Eine Übermittlung der IP-Adresse an Drittanbieter findet somit nicht statt. Somit besteht auch nicht die Gefahr einer DSGVO-Abmahnung. Daher empfehlen wir jede Schriftart lokal einzubinden.
Welchen Nachteil haben dynamisch eingebundene Google Fonts?
Dynamische Google Fonts müssen DSGVO-konform sein. Hierfür ist zwingend die Einwilligung des Users notwendig. Somit müssen Sie Ihrer Website ein Cookie-Banner vorschalten, das per Opt-out-Schaltfläche die explizite Erlaubnis oder Ablehnung ermöglicht.
Zudem müssen Sie bei dieser Lösung eine Fallback-Schriftart implementieren. Diese greift, wenn der User nicht einwilligt. Andernfalls verlieren Sie diesen User direkt, da die Website nicht dargestellt werden kann. Für die Auswahl der Fallback-Font sollten Sie stets auf die Kompatibilität für alle Betriebssysteme achten.
Als dritten negativen Effekt der dynamisch eingebundenen Google-Schriftarten sei das Neuladen der Schriftart nach Einwilligung erwähnt. Für das Erlebnis des Users geht es sicherlich besser.
Welchen Nachteil haben lokal eingebundene Google Fonts?
Oftmals kolportiert werden die langsamen Ladezeiten durch lokal eingebundene Schriftarten. Das mag in der Vergangenheit eine Rolle gespielt haben. Doch mittlerweile werden Google Fonts im Browser nicht mehr zwischengespeichert. Vielmehr werden die Fonts für jede Website neu heruntergeladen, sofern im Chrome-Browser ab Version 86 und im Firefox ab Version 85 gesurft wird (seit 2020). Die aktuelle Version können Sie beispielsweise bei Browsercheck prüfen. Auch Safari übt diese Praxis des Neuladens aus.
Mehr noch: Durch das lokale Einbinden verkürzt sich die Ladezeit von Websites sogar minimal. Denn der Zwischenschritt des DNS-Lookups entfällt. Damit ist das Übertragen von Informationen zu DNS-Einträgen gemeint, das ansonsten beim Neuladen von Seiten anfällt.
Ein Grund, warum wir immer zur lokalen Implementierung raten, bei der gleichwohl ein Content Delivery Network (CDN) sinnvoll ist.
Wie finde ich heraus, ob ich Google Fonts auf meiner Website verwende?
Zum Prüfen, ob Ihre Website mit Google Fonts ausgestattet ist und in welcher Form sie eingebunden sind, haben Sie zwei Möglichkeiten:
Google Fonts Checker
Für das schnelle Ergebnis. Geben Sie im Google Fonts Checker die URL Ihrer Website in das vorgegebene Feld ein. Sie erhalten direkt die Antwort. Wenn Sie eine bestimmte Seite eingeben, wird auch nur diese analysiert. Daher lohnt sich immer auch der verifizierende Blick auf Option 2.
Developer-Tools
Geringfügig mehr Aufwand, dafür aber gesicherter ist die Möglichkeit über die sogenannten Developer Tools. Zudem werden Informationen zur Einbindungsart ersichtlich.
Für Chrome und Firefox: Um in den Developer-Tools zur Entwicklerkonsole zu gelangen, klicken Sie auf der Webseite mit der rechten Maustaste und auf "Element untersuchen". Alternativ können Sie in Ihrem Browser auf dem Mac die Tastenkombination Cmd + Option + J drücken, für Windows-Rechner Strg + Umschalt + J.
Für Chrome: Anschließend wählen Sie das Tab "Network" an. Aktivieren Sie den Filter "Fonts" und laden Sie die Seite neu. Klicken Sie auf die Schriftart, die Sie untersuchen möchten. Es erscheint der Pfad, aus dem die Schriftart geladen wird, in unserem Beispiel "Fjalla One". Steht im Tab General unter “Request URL” Ihre Website, sind die Schriftarten lokal eingebunden. In unserem Fall sind die Google Fonts lokal eingebunden.
Für Firefox: Klicken Sie auf den Reiter "Netzwerkanalyse" und geben Sie im Eingabefeld "fonts" ein. Anschließend erhalten Sie eine Übersicht aller auf der Seite verwendeten Schriftarten.
Sind Auszeichnungen unter dem Reiter "host" mit googleapis.com oder fonts.gstatic.com enthalten, sind die Google Fonts dynamisch (remote) eingebunden. Die Daten werden beim Seitenaufruf an Google übermittelt.
Hinweis: Haben Sie andere Google-Dienste wie beispielsweise Recaptcha oder Google Maps auf Ihrer Website eingebunden, können darüber ebenfalls Google Fonts geladen werden. Daher empfehlen wir vor dem Prüfen das Deaktivieren solcher Dienste.
Zudem sollten Sie beachten, dass bei diesen Diensten, dazu gehört auch YouTube, eine Einwilligungsmöglichkeit per Opt-out-Schaltfläche hinterlegt ist. In den Datenschutzbestimmungen sollte der Einsatz von Google Maps zudem erfasst sein.
Ich nutze dynamisch eingebunden Google Fonts auf meiner Website. Welche Optionen habe ich?
Für den Fall, dass sie Google Fonts eingebunden haben, gibt es drei Möglichkeiten:
- Sie binden die Google Fonts lokal ein. Das bedeutet, dass Sie diese auf dem eigenen Server hosten. Somit erfolgt kein Datentransfer mehr an Google. Die lokale Einbindung wird von Google explizit erlaubt.
- Sie nutzen eine andere, kostenpflichtige Schrift, deren Lizenz Sie bezahlen. Achten Sie hierbei auf ein in Europa ansässiges Content Delivery Network (CDN).
- Sie behalten die dynamisch eingebundene Schrift und tragen das Risiko einer Abmahnung. Dies ist sicherlich die schlechteste aller Optionen.
Wie binde ich Google Fonts auf meiner Website lokal ein?
Vergewissern Sie sich, dass Sie die richtige Schriftart mit den passenden Styles kennen, bevor Sie mit dem Herunterladen der Google Fonts starten. Hierfür nutzen Sie die Developer-Tools oder suchen in Ihrem Template in der CSS-Datei nach dem Code. Beispielhaft würde dieser mit "@import url" gekennzeichnet und sieht so aus:
@import url (‘https://fonts.googleapis.com/css2?family=FjallaOne&display=swap’)
Der Hinweis @import sowie googleapis sind Hinweise für dynamisch eingebundene Google Fonts.
Schritt 1: Google Fonts herunterladen
Sofern Sie eine Schriftart verwenden, gehen Sie auf den Google Webfont Helper.
Falls Sie noch auf der Suche nach der richtigen Google Font sind, wählen Sie aus über 1.000 Schriftarten unter https://fonts.google.com/ aus.
Geben Sie die gewünschte Schriftart im Google Webfont Helper im linken oberen Suchfeld ein und klicken Sie auf das Ergebnis. In unserem Fall ist das Fjalla One. Auf der rechten Seite öffnen sich neue Informationen.
Unter Schritt 1 und 2 können Sie die Styles der Schriftart modifizieren. Informationen zu den Styles bei bestehenden Schriften erhalten Sie wiederum in den Developer-Tools.
Unter Schritt 3 kopieren Sie das CSS. Dieser Schritt wird zu einem späteren Zeitpunkt wichtig. Zudem können Sie bereits unter “Customize folder prefix” den Pfad zum Ordner bestimmen, in dem die Dateien abgelegt werden sollen.
Mit Schritt 4 laden Sie die Schriftart als ZIP-Datei herunter.
Anschließend entzippen Sie die Datei und erhalten die Google Font in verschiedenen Formaten. WOFF (Web Open Font Format) oder WOFF2 sind dabei die bevorzugten Formate, da sie am wenigsten Speicherplatz benötigen und somit die Ladegeschwindigkeit reduzieren.
Schritt 2: WOFF2-Dateien auf eigenen Server hochladen
Laden Sie nun die Datei auf den eigenen Server hoch. Dafür können Sie beispielsweise ein FTP-Programm wie Filezilla nutzen. Legen Sie die Dateien in einem separaten Unterordner für die Fonts ab. Für diesen Arbeitsschritt benötigen Sie gegebenenfalls Administratoren-Rechte für den Server.
Anmerkung: In toujou müssen Sie uns lediglich die Dateien im WOFF2-Format zur Verfügung stellen. Wir hinterlegen die Google Fonts direkt im Ordner.
Schritt 3 Schriftart bei CSS einbinden
Binden Sie die Google Font per CSS im Theme Ihrer Website ein. Nutzen Sie dafür den Code der Seite des Google Webfont Helper unter Schritt 3. Dieser enthält alle von Ihnen gemachten Anpassungen.
Beispielcode für Fjalla One:
/* fjalla-one-regular - latin */
@font-face {
font-family: 'Fjalla One';
font-style: normal;
font-weight: 400;
src: local(''),
url('../fonts/fjalla-one-v13-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
url('../fonts/fjalla-one-v13-latin-regular.woff') format('woff'), /* Modern Browsers */
url('../fonts/fjalla-one-v13-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
url('../fonts/fjalla-one-v13-latin-regular.svg#FjallaOne') format('svg'); /* Legacy iOS */
}
Anschließend kann es notwendig werden, die Verbindung zu Google Fonts mittels Plugins zu deaktivieren. Haben Sie zuvor eine zu ersetzende Schriftart genutzt, löschen Sie die alte Schrift. Dafür entfernen Sie den alten CSS-Code aus dem Theme. In toujou übernehmen wir diesen Schritt gerne für Sie. Auch ist kein Deaktivieren eines Plugins notwendig.
Schritt 4: Prüfen
Vergewissern Sie sich, dass die lokale Einbindung funktioniert hat. Rufen Sie die Website auf und achten Sie darauf, den Seitencache zu löschen. Öffnen Sie die Developer-Tools und prüfen Sie mittels Klick auf “Network” im Chrome die entsprechende Schriftart. Steht unter “Request URL” Ihre Domain/Website-Adresse, sind die Schriftarten lokal eingebunden.
Tipp: In manchen Content Management Systemen kann es neben der Deaktivierung von Plugins auch notwendig sein, dass die Verbindung zum Google-Server manuell getrennt werden muss. Suchen Sie hierfür im Ordner Templates nach einer Datei assets.xml und löschen Sie die Zeile mit der Google-Verbindung.
Wiederholen Sie die Schritte 1 - 4 für alle Schriftarten, die Sie auf Ihre Website nutzen
Was Sie zu den Google Fonts noch interessieren könnte
Wie finde ich heraus, ob ich Google Fonts datenschutzkonform eingebunden sind?
Über die Developer-Tools erhalten Sie den Beweis, ob Sie Google Fonts nutzen und diese lokal oder dynamisch eingebunden sind. Sind sie dynamisch eingebunden, bedarf es zusätzlich eines Consent-Tools, um eine DSGVO-konforme Website zu betreiben.
Darf ich Google Fonts lokal einbinden?
Wir können zwar keine Rechtsberatung abgeben, würden diese Frage aber durchaus mit Ja beantworten. Denn Google weist auf seiner eigenen GitHub-Seite im Abschnitt “Self Host Fonts Available from Google Fonts” darauf hin, dass alle Schriftarten selbst gehostet werden dürfen. (“Since all the fonts available here are licensed with permission to redistribute, subject to the license terms, you can self-host using a variety of third-party projects.”)
Auch in den FAQ von Google kommt kein explizites Verbot vor.
Wie binden Sie Google Fonts auf Ihrer Website datenschutzkonform ein?
Werden die Google Fonts auf Ihrer Website über den Google Server geladen, ist ein Datenschutzhinweis in Form einer Opt-out-Schaltfläche im Cookie-Banner obligatorisch. Sind die Google Fonts auf einem lokalen Server hinterlegt, sind Sie bereits auf der sicheren Seite.
Wie erkenne ich, ob Google Fonts dynamisch auf der Website eingebunden ist?
Dynamisch integrierte Google Fonts auf einer Website lassen sich über die Developer-Tools im Chrome-Browser einsehen. Klicken Sie unter Network auf die entsprechende Schriftart. Erhalten Sie unter “Request URL” einen Pfad zu Ihrer Website, ist die Schriftart lokal eingebunden. Falls der Pfad nicht Ihre Website-Adresse aufweist, sind die Google Fonts dynamisch eingebunden.
Wie sammelt Google personenbezogene Daten bei Fonts?
Google Fonts setzt keine Cookies. Allerdings werden bei einem Websitebesuch dynamische Schriftarten automatisch über einen Google-Server geladen (AGB der Google Fonts). Dadurch erfolgt eine Übermittlung der User-Daten. Google kann dann unter anderem Angaben zum Browser, der besuchten Website, Betriebssystem des Users und Bildschirmauflösung erhalten. Die IP-Adresse verrät zudem den Standort des Users.
Welche Alternativen gibt es zu Google Fonts?
Falls Sie ganz von Google Fonts absehen möchten, können Sie beispielsweise Font Awesome nutzen. Hierbei können Sie die Schriftart ebenfalls herunterladen. Adobe Fonts ist ebenfalls populär, allerdings ist kein lokales Hosting der Schriftart möglich. Weitere Anbieter sind fonts.com, Fontspring oder Webtype. Bitte prüfen Sie aber jeweils die Datenschutzbedingungen.
Was sind Google Web Fonts?
Google Fonts sind lizenzfreie von Google bereitgestellte Schriftarten. Weil sie kostenlos nutzbar sind, werden sie von vielen Website-Betreiber:innen eingesetzt.
Sind Google Fonts lizenzfrei und kostenlos nutzbar?
Ja. Die Google Fonts sind unter der SIL Open Font Licenses 1.1 oder Apache License 2.0 lizenziert. Sie werden von Google damit kostenlos zur Verfügung gestellt.
Wie kann ich Google Fonts downloaden?
Um Google Fonts downzuloaden, gehen Sie auf https://fonts.google.com/. Dort können Sie aus über 1000 Schriftarten auswählen und anschließend herunterladen. Möchten Sie die Schriftart auf der Website lokal einbinden, müssen Sie diese zudem herunterladen.
Ausblick
Werfen wir mal die Glaskugel an und wagen einen Blick in die Zukunft. Mit dem Urteil des Landgerichts München vom 20. Januar 2022 ist die Verwendung der Google Fonts über die Google API auch auf dem Papier nicht mehr erlaubt, sofern keine vorherige User-Einwilligung vorliegt. Bereits die zuvor in Kraft getretene DSGVO hatte dies mindestens vermuten lassen.
Sollte das Urteil des Münchner Landgerichts Bestand haben, stehen eigentlich Tür oder Tor für Abmahnschreiben und Schadenersatzforderungen offen. Denn aktuell setzen viele Websites noch auf Google Webfonts ohne datenschutzkonformes Consent-Banner. Zudem würden dann wohl auch andere Google-Dienste wie Google Maps in den Fokus rücken. Analytics war ja bereits in aller Munde, Alternativen wie Matomo erhalten mehr Aufmerksamkeit. Und noch etwas weiter gedacht müssen Sie sich dann auch über die richtige Einbettung von YouTube-Videos Gedanken machen bzw. diese in den Datenschutzbestimmungen erfassen. Auch Recaptchas könnten ein Thema sein.
Aber, und jetzt kommt die gute Nachricht: Wer bislang seine Hausaufgaben gemacht hat, der dürfte auch bei weiteren Abmahnwellen nichts zu befürchten haben. Solange Dienste nicht dynamisch auf der Website integriert sind oder, wenn doch, mit datenschutzkonformer Auszeichnung über das Consent-Tool, der hat nichts zu befürchten.
Übrigens: Mit toujou bieten wir Ihnen das richtige Werkzeug für eine datenschutzkonforme Website.
Unsere neuesten Blogbeiträge
Lesen Sie mehr zu toujou und TYPO3, warum SEO gar nicht so schwer ist, goldene Regeln für die Kommunikation und immer wieder Tipps & Tricks für Ihre Website.