Google Webfonts
DSGVO konform einbinden

Prüfe ob deine Webseite Google Webfonts verwendet
und erfahre wie du diese Rechtssicher laut Datenschutzgrundverordnung integrierst.

ZUM BEITRAG SCROLLEN Kontakt

DSGVO-konforme Google Fonts einbindung für Webseiten, Blogs & Onlineshops.

AUTOR ANSEHEN

Angeblicher DSGVO-Verstoß: Abmahnwelle wegen Google Fonts

Viele Webseiten betreiber erhalten aktuell eine Abmahnung von der Rechtsanwaltskanzlei Kilian Lenard aus Berlin im Namen von Mitgliedern einer „Interessengemeinschaft Datenschutz“ aufgrund vermeintlicher Datenschutzverstöße zum Thema GOOGLE WEBFONTS Verwendung ohne Vorherige Einwilligung mit Schadensersatz von 170,00€ einfordert.

Warum gibt es diesen Fehler?

So gut wie jede Webseite wird heutzutage mit den Google Webfonts betrieben. Das liegt daran das Google sehr früh erkannt hat das den Designern verschiedene Schriftarten im Internet für die verwendung fehlten. Im Jahre 2010 musste man jede Schriftart einzeln runterladen möglichweise kaufen. Anschließend musste man dafür sorgen das die Schriftart in verschiedenen Datei-Formaten (.EOT, .OT, .SVG, .TTF, .WOFF, .WOFF2) verfügbar ist. Sobald man das erledigt hatte, war man bereit die Schriftarten auf seinem Hostingserver zu laden und zu integrieren. Die Integration der Schriftarten musste meist mit CSS befehlen gelößt werden.

Da Google diesen umständlichen Workflow eine Lösung bieten wollte, haben Sie die "Google Webfonts" ins Leben gerufen.
Der Service von Google sorgt dafür das man mit Einbindung von 1 Code Zeile seine vorher ausgewählte Schriftart zur Verfügung hat. Außerdem bietet sich das Vorteil das die Schriftart auf einem anderen Server liegt und somit schneller geladen werden konnte.

Infolge der neuen Datenschutzgrundverordnung ist es untersagt meine Daten an fremde IPs weiterzuleiten.
Sobald man eine Webseite mit vorhanden Google-Fonts Tag aufruft schickt dieser Tag eine Mittelung an Google.

Wir müssen nun dafür sorgen dass die vorhandenen Google Schriftarten bei uns auf dem Server liegen und wir den Google Tag entfernen können.

1. Wie Prüfe ich ob meine Webseite Google Webfonts verwendet?

Der momentan schnellste Weg dafür ist der "Google Fonts Checker" von Sicher3.
Prüfe Deine Webseite: Google Webfonts Checker
Geben Sie dort einfach Ihre Domain ein und warten auf das Ergebnis.

Sollten Sie eine Rote Meldung erhalten, müssen Sie leider nacharbeiten vornehmen.



Mit welchem Content Mangement System arbeitest du?

Wähle dein passendes System aus und lass dir erklären wie du an deine Google Webfont einbindung gelangst.



Wordpress / WooCommerce

Du kannst beruhigt sein, solltest du Wordpress nutzen hast du es mit am einfachsten dein Problem in den Griff zu bekommen.
Alles was du tun musst ist dir das Wordpress Plugin OMGF | GDPR/DSVGO Compliant, Faster Google Fonts. Easy. zu installieren.

Dieses Plugin hilft dir dabei automatisch alle Google Webfonts zu entfernen,
alles was du tun musst ist in den Einstellungen von OMGF einen "SCAN" auszuführen.
Soald der Scan abgeschlossen ist, werden dir in der Liste deine vorhanden Schriftarten angezeigt.

Wichtig:
Sollte deine Website mit den Element-Bildern: Elementor oder Divi umgesetzt wurden sein kannst du dafür unter "Erweitere Einstellungen" die Divi/Elementor-Kompatibillität aktivieren.

Prüfe bitte deine Webseite erneut mit dem Google Webfont Checker nachdem du das Plugin fertig eingerichtet hast.

Solltest du ein gekauftes Theme verwenden, kann es sein das der Quellcode nicht Anpassbar ist für OMGF und somit deine Google Fonts nicht entfernt wurden, auch wenn laut dem Plugin alles danach aussieht.

Was kann ich tun wenn OMGF meinen Google-Webfonts-Tag im Quellcode nicht entfernen kann?
Dann bleibt dir nur die Option dein Wordpress zu durchsuchen.

1. Variante:
Überprüfe ob du in deinem CUSTOMIZER eine Einstellung für "Schriftarten / Fonts" finden kannst, sollte sich dort eine Einstellung verbergen kannst du dort die Schriftarten erstmal löschen, damit diese nicht mehr geladen werden.

2. Variante:
Du kannst dich in deinen Wordpress-Adminbereich einloggen und dort über DESIGN > Theme-Datei-Editor all deine Templates bearbeiten. Hierbei ist mit Vorsichtig ranzugehen da du damit in der lage bist deine gesamte Webseite zu zerstören ohne Wiederherstellungsmöglichkeiten.

In welche Template-Dateien lohnt es sich zu schauen?
Am besten schaust du dir folgende Dateien an: "header.php // footer.php // "-Template an, solltest du dort eine Google Webfonts Tag finden kann dieser gelöscht werden.

Contao

Sollte deine Webseite das Content Management System: Contao verwenden kannst du deinen Google Webfont Tag über folgende Wege entfernen.

1. Methode
Du loggst dich in deinen Contao Adminbereich ein, dort kannst du nun auf deine SEITENSTRUKTUR klicken.
Dort wählst du nun deinen "Startpunkt deiner Webseite" aus. Das ist nicht deine STARTSEITE / INDEX sondern meistens der SEITENNAME (ID:1) oberhalb der Seitenstrukur.
Sollte dein Template Google Webfonts eingebunden haben, kannst du sie an dieser stelle finden.
(Wichtig: Das ist nicht die einzige Stelle die du überprüfen musst).

2. Methode
Du solltest Überprüfen ob sich in einem deiner Templates der Google Webfonts Tag versteckt.

folgende Templates könnten den Tag-Integriert haben:

  • templates/be_main.html5
  • templates/fe_page.html5
  • templates/fe_page_TEMPLATENAME.html5
Screenshot Template be_main.html5 contao cms

Wie Integriere ich meine Schriftarten OHNE Google zu verwenden?

Sobald du den Google Webfonts Tag entfernt hast, kannst du dafür sorgen das deine Webfonts wieder in deinem Design geladen werden.

Dafür gibt es eine nützliche Webseite Namens Google Webfonts Helper die es uns ermöglicht all unsere Schriftarten im richtigen Dateiformat runterzuladen.

Sobald du deine Schriftart gefunden hast, entscheidest du dich für die jeweiligen Schrift-Schnitte (Meistens sind es: 1x Regular, 1x Italic, 1x Bold) um die Grundstylings einer Webseite abzubilden. Die Schriftstile "200 Thin" und "300 Lighter" haben meist nur Stylische hintergründe und werden nicht bei Fließtexten verwendet.

Google Webfonts Helper: Source Code Pro Download

2. Nun kopierst du deinen Neu generieren CSS-Quellcode in deine CSS-Datei.

/* source-code-pro-regular - latin */
@font-face {
font-family: 'Source Code Pro'; Der Name deiner Schrift, diese kann auch beliebig verändert werden - solltest du nicht wollen das jemand deine Schriftart über den Quellcode herrausfinden kann.

font-style: normal;
font-weight: 400;
Wählt den jeweiligen Schriftschnitt der verwendet werden soll

src: url('../fonts/source-code-pro-v22-latin-regular.eot'); /* IE9 Compat Modes */
src: local(''), Sollte die Schrift auf dem Computer vorhanden sein, Lade die Schriftart Local vom Computer

url('../fonts/source-code-pro-v22-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
url('../fonts/source-code-pro-v22-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
url('../fonts/source-code-pro-v22-latin-regular.woff') format('woff'), /* Modern Browsers */
url('../fonts/source-code-pro-v22-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
url('../fonts/source-code-pro-v22-latin-regular.svg#SourceCodePro') format('svg'); /* Legacy iOS */
Achte darauf das die Schriftarten alle gefunden werden. Sollte es Probleme mit dem Dateipfad geben, wird dir eine Fehlermeldung in den Developer Tools deines Browsers anzeigt. Untersuche dafür einfach deine Webseite und öffne danach die Console. Wenn alles richtig funktioniert sind in deiner Console keine Fehlermeldungen vorhanden und die Schriftarten werden wieder geladen. }

Google Webfonts CSS Code: Source Code Pro

3. Lade die Webfonts Files herrunter

Nun musst du nur noch das fertig generite .ZIP File herrunterladen und anschließend in dein gewünschtes Server-Verzeichnis kopieren.


Google Webfonts Helper Download: Source Code Pro

Solltest du alles richtig umgesetzt haben

Wirst du nun über den Google Webfonts Checker von sicher3 keine Fehlermeldung mehr erhalten.

Google Webfonts Helper Download: Source Code Pro

Weitere Beiträge

Blog Beitrag: DSGVO Checklist Deine notwendigen To-Do's zum DSGVO Schutz

So dieser von mir erstellen Checkliste für dich, machst du deine Webseite fit für die Datenschutz Grundverordnung...

BEITRAG LESEN