Google Fonts lokal einbinden –
DSGVO-konform
Seit Jänner 2022 ist die Nutzung der Google Fonts API auf Websites nicht mehr datenschutzkonform. Wir zeigen Ihnen in 5 Schritten die DSGVO-konforme Lösung.
Seit Jänner 2022: Google Fonts API ist nicht DSGVO-konform
Urteil: LG München, 20.01.2022 – Die IP-Weitergabe an Google ohne Einwilligung des Nutzers ist rechtswidrig. Die Beklagte musste Schadensersatz und Unterlassung leisten. Eine Warnung an alle Webseitenbetreiber, die Google Fonts dynamisch über die API einbinden.
Was ist die Google Fonts API?
Google stellt seit Jahren eine Vielzahl an Schriftarten kostenlos zur Verfügung. Üblicherweise wurden diese über die Google Fonts API eingebunden – dabei werden die Fonts auf Google-Servern gespeichert und erst beim Aufruf der Website geladen.
Durch den Verbindungsaufbau zu den Google-Servern in den USA wird auch die IP-Adresse des Websitebesuchers an Google übermittelt. Da die IP-Adresse seit Inkrafttreten der DSGVO zu den personenbezogenen Daten zählt, muss dafür vorab eine aktive Zustimmung eingeholt werden.
Da Texte idealerweise sofort in der gewünschten Schriftart erscheinen sollen, macht ein Cookie-Banner für Fonts wenig Sinn. Die Lösung: Fonts lokal auf dem eigenen Server hosten.
Chrome DevTools: Designer können damit u.a. Layout anpassen, Screenshots erzeugen und Netzwerkanfragen analysieren.
Google Fonts lokal einbinden
In 5 einfachen Schritten zur DSGVO-konformen Einbindung von Google Fonts auf Ihrer Website.
Google Fonts herunterladen
Gewünschte Schriftarten direkt von Google Fonts (fonts.google.com) als TTF-Dateien herunterladen. Alle benötigten Schriftschnitte (Regular, Bold, Italic usw.) einzeln herunterladen.
TTF in WOFF2 umwandeln
Die TTF-Dateien mit einem Online-Converter-Tool in das effizientere WOFF2-Format umwandeln. Per Drag & Drop konvertieren und anschließend herunterladen.
WOFF2-Dateien auf Server hochladen
Mit einem FTP-Programm wie FileZilla die WOFF2-Dateien auf Ihren Server hochladen. Empfohlener Ordner bei WordPress: /wp-content/uploads/assets/fonts/
Lokale Schriftart per CSS einbinden
In WordPress unter Design → Customizer → Zusätzliches CSS den @font-face Code einfügen. Dateinamen und Schriftartnamen exakt anpassen (Groß-/Kleinschreibung beachten):
@font-face {
font-family: "SourceSansPro Regular";
font-display: swap;
src: url(/wp-content/uploads/assets/fonts/SourceSansPro-regular.woff2) format("woff2");
}Lokale Google Fonts im CSS referenzieren
Nach dem Einbinden per @font-face die Schriftart im CSS referenzieren. Namen exakt übereinstimmend angeben, bei Leerzeichen im Namen immer Anführungszeichen verwenden:
body {
font-family: "SourceSansPro Regular", system-ui, -apple-system, sans-serif;
}WordPress Astra Theme: Lokale Fonts per Klick
Wer das beliebte Astra Theme für WordPress verwendet, kann sich die manuelle Einbindung einfacher machen: Im Astra Customizer gibt es die Option, Google Fonts direkt lokal zu laden – ohne manuellen CSS-Code.
Das Astra Theme aktiviert dabei automatisch das lokale Hosting der Schriftarten und verhindert die Verbindung zu Google-Servern. Eine einfache Lösung für WordPress-Nutzer ohne tiefe CSS-Kenntnisse.
Google Fonts Abmahnungen seit Juli 2022
Seit Juli 2022 sind massenweise Abmahnungen wegen der Verwendung von Google Fonts im Umlauf. Prüfen Sie Ihre Website – handeln Sie jetzt, bevor eine Abmahnung eintrifft.
Sie haben bereits eine Abmahnung erhalten?
Hilfe und Informationen finden Sie auf der WKO-Website (wko.at) unter dem Stichwort „Abmahnungen wegen Google Fonts".
DSGVO-Beratung anfordern
Benötigen Sie Hilfe bei der DSGVO-konformen Einbindung? Schreiben Sie uns – wir helfen schnell und unkompliziert.