Kostenloses E-Book: ✨ PLANE DEINE WEBSEITE IN 5 SCHRITTEN

WordPress: Google Fonts DSGVO-konform einbinden

Inhaltsverzeichnis

Was sind Google Fonts?

“Fonts” sind erstmal Schriftarten. Google Fonts ist der beliebteste Anbieter für Schriftarten. Die Schriften sind kostenlos und kommerziell nutzbar. Das heißt, du darfst sie auf jeder Webseite frei einsetzen. Es gibt mittlerweile kaum eine Webseite, die keine Google Fonts benutzt.

Was ist das Problem mit Google Fonts und der DSGVO?

Theoretisch erstmal nichts. Denn wie oben beschrieben sind die Schriften kostenlos und kommerziell nutzbar. Die Sache ist allerdings die:

Wenn du in WordPress einen visuellen Editor benutzt, dann sind die Schriften nur verknüpft. Visuelle Editoren sind zum Beispiel Elementor oder Divi.

Das heißt:

Google Fonts bietet die Option, Schriften auf der eigenen Website zu nutzen, ohne dass diese auf den eigenen Server hochgeladen werden müssen. In diesem Fall werden beim Aufruf der Webseite durch einen Benutzer die Schriften über einen Google-Server nachgeladen. Dieser externe Aufruf bewirkt, dass Daten an Google übertragen werden. – Wikipedia

Es werden also Daten an die USA übertragen. Laut Google sind das keine personenbezogenen Daten. Mindestens werden IP und “user agent string”übertragen. Damit kann ein mit dem Internet verbundenes Gerät identifiziert werden.

Warum macht Google das?


Google will Daten. Google ist ein Megakonzern, der vom und für das Web lebt. Alles, was das Web besser macht, ist im Interesse von Google. Und Schriften machen das Web besser. Google bietet über 1000 Stück an, die alle verschiedene Schriftstärken und Variationen haben. Wirklich sehr praktisch und nutzungsfreundlich. Nur eben nicht ohne Preis: der Preis sind Daten.

Hier kannst du das offizielle Statement von Google dazu lesen.

Besteht für Webseiten-Betreiber:innen Handlungsbedarf?

Ja. Denn das Landgericht München hat entschieden, dass die Nutzung von Google Fonts gegen die DSGVO verstößt. Dieses Urteil kannst du hier nachlesen.

Das Besondere bei diesem Urteil ist: Auf der Webseite, deren Betreiber:in angeklagt wurde, gab es kein Cookie Tool. Es gab also keinen Cookie Banner wo gefragt wird: “Stimmst du zu, dass diese Webseite Cookies einsetzt?”

Hier der Hinweis: Ich bin kein Anwalt und auch kein Rechtsexperte. Ich gebe weiter, was ich selbst über die Situation gelernt und gelesen habe, nach bestem Wissen also.

Ob es noch ausreicht, ein Cookie Banner zu verwenden, kann ich dir nicht sagen. Die Webseite, um die es in dem Urteil ging, hat keinen verwendet. Demnach war ein Cookie Banner nicht Bestandteil des Urteils.

Wenn du sichergehen willst, dass du DSGVO-konform handelst, solltest du Google Fonts lokal einbinden. Dazu erzähl ich dir gleich mehr.

Es gibt eine Abmahnwelle

Jemand kam auf die Idee, massenhaft Schadenersatzforderungen für die Verwendung der Google Fonts und das damit verbundene Verschicken der IP in die USA zu fordern. Die Höhe der Schadenersatzforderung liegt, bei allem was ich bisher weiß, zwischen 100 und 200€.

Letzte Woche wurde ich wegen genau so einer Abmahnung kontaktiert. Ich wurde gebeten dabei zu helfen, die Google Fonts aus einer Webseite zu entfernen. Deshalb habe ich mich kurzerhand entschieden, diesen Blogbeitrag in meine ersten 3 aufzunehmen. Das ist schließlich eine wichtige Angelegenheit.

Was kannst du machen, um nicht abgemahnt zu werden?

✅ Google Fonts DSGVO konform einbinden

Was bedeutet das? Eine dynamische Einbindung liegt dann vor, wenn die Schriftart lediglich mit der Webseite verknüpft ist und vom Google Server geladen wird, wenn jemand die Webseite besucht. Lokal ist die Schriftart eingebunden, wenn du sie direkt auf deiner Webseite hochlädst. Dann wird sie nämlich von deinem Webspace (also lokal) geladen.

In Elementor

In der Pro Version vom Elementor kannst du die Google Fonts (oder jede andere Schriftart) installieren. Dazu musst du die Schriftart vorher von der Google Fonts Webseite runterladen:

Google fonts runterladen und lokal einbinden

Dann lädst du die Schriftarten im Elementor hoch (Elementor → Benutzerdefinierte Schriftarten):

Elementor Schriftarten installieren

Jetzt musst du diese Schriftart einstellen, anstelle der Schriftart, die du aktuell verwendest. Das machst du über den Elementor, so wie du auch sonst deine Schriftarten einstellst. Wenn du die benutzerdefinierte Schriftart richtig installiert hast, taucht sie in der Schriftenliste als “eigene Schriftart” auf.

Google API blockieren

Wenn du sicherstellen willst, dass alle Google Fonts auf deiner Webseite DSGVO-konform geladen werden, musst du die sogenannte Google API blocken. Dafür gibt es das Plugin “Disable & Remove Google Fonts”.

Zusätzlich kannst du die Verwendung von dynamischen Google Fonts in den Elementor-Einstellungen und in deinem Theme blockieren. (Ob das im Theme funktioniert, kommt aufs Theme an. Bei Astra gibt es diese Einstellung über den Customizer).

Was, wenn du nicht Elementor Pro benutzt?

Du willst Google Fonts DSGVO konform einbinden, nutzt aber icht Elementor?

Auch dann lädst du die Schriftart bei Google erstmal runter, so wie oben gezeigt. Das Plugin “Disable & Remove Google Fonts” kannst du auch wie oben beschrieben verwenden.

Zum Installieren der Schriften musst du diese über deinen Webhost hochladen. Dann fügst du etwas CSS in die style.css Datei deines Themes ein. Achte darauf, dass du ein Child Theme verwendest. Sonst löscht das nächste Theme-Update deine ganze Mühe…

Das CSS brauchst du nicht selbst schreiben. Dafür gibt es das praktische Tool “Google Webfonts Helper” von Mario Raftl:

https://google-webfonts-helper.herokuapp.com/fonts

Wähle links die Schriftart(en) aus, die du für deine Webseite brauchst. Stelle ein, welche Schriftstärken du willst und kopiere den CSS Code (oder lade ihn am Seitenende runter).

Der Check: Sind deine Google Fonts jetzt wirklich entfernt?

Um zu prüfen, ob das geklappt hat, schaust du in die Entwicklerkonsole in deinem Web Browser. Das klingt komplizierter, als es ist!

Drücke F12 oder mache einen Rechtsklick auf deiner Webseite. Dann wählst du “Inspect” oder “Seite untersuchen”. Am rechten Rand öffnet sich dann ein weißer oder dunkler Kasten.

Google fonts api in der Entwicklerkonsole

Hier wählst du “Quellen” (engl. “Sources”). Wenn du dort keinen Eintrag findest, der fonts.gstatic.com oder fonts.google.com heißt, hat es geklappt!

Du bist jetzt, was deine Schriften betrifft, DSGVO-konform! 🥳

Falls du Hilfe brauchst oder eine Frage hierzu hast, schreib mir eine Nachricht oder Email mit dem Text “Google Fonts”. 

Bleib dran!

Das könnte dich auch interessieren
9 + 4 Tipps, um deine WordPress Website sofort zu optimieren

Willst du mit deiner Webseite gerne deine Wunschkund:innen anziehen und so richtig von dir begeistern?

Gerade für dich als Coach, Berater:in oder Expert:in in der Gesundheitsbranche ist das eine super Sache. Denn mit deiner Website kannst du nicht nur viele deiner Wunschkund:innen automatisiert erreichen, zum Beispiel über Suchmaschinen. Du hast auch jede Menge Möglichkeiten, dein Fachwissen und deine Persönlichkeit zu zeigen. Und genau diese Bausteine brauchst du, um Seitenbesucher:innen in Kund:innen zu verwandeln.

Mehr lesen »
Website Gestaltung: Checkliste für die Website-Planung

Eine Webseite zu erstellen, ist ein riesengroße Sache. Um so ein gewaltiges Projekt erfolgreich abzuschließen, brauchst du einen Plan. Damit du ein Ergebnis bekommst, auf das du stolz sein kannst, weil es dich näher an dein Ziel bringt, brauchst du unbedingt eine gute, gründliche Vorbereitung. Dein Fleiß wird sich auszahlen! Denn je besser du vorbereitet bist, desto professioneller wird deine Webseite, und desto besser hilft sie dir, deine Ziele zu erreichen.

Mehr lesen »

Hol dir das

Webdesign Studio Journal

Du hast noch Fragen?

Ich hab Antworten!


Schau dir mal meine Power Hour an. Da kannst du mich direkt zu deinem Thema fragen. :)

Der Marty Baldus

Ich bin der Marty, euer Digital-Virtuose. Kann auch sagen: Web Designer, Programmierer und WordPress-Experte.

Wie fing alles an?

Weißt du noch, 1995? Als ich so ungefähr 10 Jahre alt war, habe ich einen Computer bekommen. Der lief damals mit DOS – bedient hat man ihn also nicht wie heute per Mausklick, sondern erstmal per Tastatur und Code. Das hat mir echt Spaß gemacht! Deshalb hab ich mich seitdem viel damit befasst.

Also: Karriere als Programmierer?

Nein. Meine Karriere beginnt im Rettungsdienst. Da bin ich geblieben, bis ich einen Studienplatz in Humanmedizin bekommen habe. Schnell wurde mir aber klar: Ich will mein eigenes Ding machen. Nicht in sechs oder drei oder zwei Jahren, sondern jetzt.

Ich bin ein ganz oder gar nicht Typ.

Nebenberufliche Selbstständigkeit kam für mich nicht in Frage – ich bin also gleich voll rein. Und habe schnell gemerkt: es braucht mehr als ein gutes Auge fürs Design.

Wo finde ich neue Kontakte?

Wie gewinne ich überhaupt Kund:innen online?

Wie werde ich sichtbar im Internet?

Wie sieht ein gutes Angebot aus?

Alles Fragen, denen ich mich gestellt, und die ich gelöst habe! Denn du hast mich ja schließlich gefunden

Meine Ziel

Als selbstständiger Designer und Entwickler zu arbeiten, ist mein größter Lebenswunsch. Mich selbst zu verwirklichen war mir schon immer unglaublich wichtig. Umso wunderbarer ist es, das auch beruflich zu tun. Es ist für mich das Größte, dir eine Webseite zu bauen, die du liebst, weil sie dich und deine Sache weiter bringt.

Der Marty auf Social Media

Möchtest du mich persönlich kennenlernen? Mega gerne! Schreib mir einfach eine Nachricht auf WhatsApp. Ich melde mich garantiert bei dir.

Bitte fülle das kurze Formular aus, damit wir dein kostenfreies Erstgespräch optimal vorbereiten können:

IMG_9832-1
Sybille Wermann — “Dank der tollen und effizienten Zusammenarbeit mit Marty stand meine Website binnen weniger Wochen und konnte endlich online gehen. Zu meiner großen Überraschung hatte ich 15h nachdem diese Online gegangen war, bereits meine 1. Beratungsanfrage über mein Kontakformular erhalten. ”
Thursday, August 31, 2017

Hey, schön dass du hier bist!

Dieser Mitgliedsbereich ist exklusiv für unsere Agenturkundschaft.
Hier hast du Zugriff auf kostenlose Tutorials, unseren Support, sowie besondere Optionen und Konditionen zur Wartung deiner Webseite.