Web-Font-Analyzer

Wenn Sie Google Fonts vom Google-CDN (fonts.googleapis.com) einbinden, sendet der Browser des Nutzers eine Anfrage an Googles Server – und gibt dabei seine IP-Adresse preis. Im Januar 2022 urteilte das Landgericht München I, dass die Verwendung von Google Fonts ohne ausdrückliche Einwilligung die DSGVO verletzt, und sprach dem Kläger 100 EUR Schadensersatz zu. Das Urteil stellte fest, dass IP-Adressen unter der DSGVO personenbezogene Daten sind und deren Übertragung an ein US-Unternehmen (Google) ohne Einwilligung Artikel 44 DSGVO verletzt. Abhilfe: Hosten Sie Ihre Schriftarten selbst oder verwenden Sie eine DSGVO-konforme Alternative wie Bunny Fonts.

Verwenden Sie google-webfonts-helper (als Web-Tool verfügbar), um die Schriftdateien (WOFF2-Format empfohlen) und das CSS herunterzuladen. Laden Sie die Schriftdateien auf Ihren Server hoch, fügen Sie die CSS @font-face-Deklarationen hinzu und entfernen Sie die Google Fonts <link>-Tags. Fügen Sie immer font-display: swap hinzu, um Flash of Invisible Text zu vermeiden. Alternativ verwenden Sie Bunny Fonts (fonts.bunny.net), das eine Drop-in-Ersatz-API für Google Fonts bereitstellt – gleiche Schriftfamilien, gleiches API-URL-Format, aber mit EU-basierter Infrastruktur und ohne IP-Protokollierung.

font-display: swap weist den Browser an, Text sofort mit einer Fallback-Systemschrift zu rendern und dann zur benutzerdefinierten Schrift zu wechseln, sobald sie geladen wird. Ohne es kann der Browser Text vollständig ausblenden, während die Schrift lädt (Flash of Invisible Text / FOIT), was Ihren Largest Contentful Paint (LCP)-Score verzögert und Ihre Core Web Vitals beeinträchtigt. Fügen Sie font-display: swap zu allen @font-face-Deklarationen und Google Fonts-URLs hinzu, indem Sie &display=swap an die URL anhängen.

Schriftart-Preloads (<link rel="preload" as="font" href="..." crossorigin>) weisen den Browser an, kritische Schriftdateien abzurufen, bevor er den Rest des HTML parst. Dies reduziert die Wahrscheinlichkeit von Layout-Verschiebungen (CLS) und unsichtbarem Text. Verwenden Sie Preloads nur für Ihre Above-the-fold-Schriftarten – das Vorabladen jeder Schrift erhöht die Bandbreite. Kombinieren Sie Preloads mit <link rel="preconnect"> zur Schriftart-CDN-Domain, um die Verbindung frühzeitig herzustellen. Für selbst gehostete Schriften ist das Vorladen der WOFF2-Datei am effektivsten.

Adobe Fonts sendet Nutzerdaten an Adobe-Server, wenn Schriften geladen werden. Es ist eher mittleres als hohes Risiko, weil Adobe eine EU-US Data Privacy Framework-Zertifizierung hat und einen Data Processing Agreement (DPA) anbietet. Sie müssen Adobe Fonts jedoch in Ihrer Datenschutzerklärung offenlegen und es möglicherweise zu Ihrem Cookie-Consent hinzufügen. Adobe bietet EU-regionale Schriftbereitstellung an, aber der rechtliche Status von US-Datenübertragungen nach Schrems II ist noch umstritten. Für maximale Compliance bleibt Selbst-Hosten die sicherste Option.