Schriften selbst hosten: in zehn Minuten erledigt
Wenn deine Seite eine Schrift von Google lädt, geht die Adresse jeder Besucherin an Google, bevor irgendjemand zugestimmt hat. Die Lösung ist unspektakulär, dauert ein paar Minuten und macht die Seite nebenbei schneller.
Eine Zeile wie link rel="stylesheet" href="https://fonts.googleapis.com/..." im Kopf deiner Seite ist eine Anweisung an den Browser jeder Besucherin, eine Verbindung zu einem Google-Server aufzubauen. Dabei geht zwangsläufig die IP-Adresse mit, dazu die Browser-Kennung und die Adresse der Seite, von der die Anfrage kommt.
Das Landgericht München I hat darin 2022 einen Eingriff in das allgemeine Persönlichkeitsrecht gesehen und einem Kläger 100 Euro Schadensersatz zugesprochen (Urteil vom 20.01.2022, Az. 3 O 17493/20). Danach ging eine Welle von Abmahnschreiben durchs Land, von denen viele selbst rechtsmissbräuchlich waren; Gerichte haben das später mehrfach so gesehen.
Die Welle ist abgeebbt, die technische Lage nicht: Die Adresse geht raus, bevor jemand zustimmen konnte. Das ist der Grund, es zu ändern, nicht die Angst vor Post.
Ein Einwilligungsbanner ändert am Ladeverhalten der Schrift in aller Regel gar nichts. Die Schrift steht im Kopf des Dokuments und wird geladen, während das Banner noch aufgeht. Die Übertragung hat dann längst stattgefunden.
Damit ein Banner überhaupt etwas bewirken würde, müsste die Schrift erst nach der Zustimmung nachgeladen werden, und bis dahin müsste die Seite mit einer Ersatzschrift auskommen. Das ist deutlich mehr Aufwand als selbst hosten, und es sieht schlechter aus.
Finde heraus, welche Schriften deine Seite lädt
Öffne die Seite, drück F12, geh auf Netzwerk und lad neu. Filter nach fonts. Was dort an googleapis.com oder gstatic.com auftaucht, muss weg. Notier dir Name, Schnitt und Strichstärken, die wirklich benutzt werden, meist sind es zwei oder drei.
Lad die Schriftdateien herunter
Auf fonts.google.com gibt es zu jeder Schrift einen Download. Du brauchst die woff2-Dateien; jede andere Variante ist heute überflüssiger Ballast. Nimm nur die Strichstärken, die du wirklich verwendest, jede weitere kostet Ladezeit.
Leg sie neben deine Seite und binde sie im CSS ein
Die Dateien kommen in den öffentlichen Ordner deines Projekts, bei den meisten Buildern heißt der public. Danach ersetzt du den Google-Link durch einen font-face-Block in deinem CSS.
@font-face {
font-family: "Inter";
src: url("/fonts/inter-400.woff2") format("woff2");
font-weight: 400;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: "Inter";
src: url("/fonts/inter-700.woff2") format("woff2");
font-weight: 700;
font-style: normal;
font-display: swap;
}Entferne den Google-Link vollständig
Such im Projekt nach fonts.googleapis.com und fonts.gstatic.com und lösch jede Fundstelle, auch die vorbereitenden preconnect-Zeilen. Die werden gern übersehen und bauen die Verbindung trotzdem auf.
Mit Next.js geht es noch einfacher
Wer Next.js nutzt, braucht nichts herunterzuladen: next/font holt die Schrift beim Bauen und liefert sie von der eigenen Domain aus. Zur Laufzeit geht dann keine Anfrage mehr an Google.
import { Inter } from 'next/font/google';
const inter = Inter({ subsets: ['latin'], weight: ['400', '700'], display: 'swap' });
export default function RootLayout({ children }) {
return <html className={inter.className}>{children}</html>;
}Wenn du nicht selbst im Code arbeitest
Dieser Text funktioniert als Anweisung in den gängigen Buildern.
Binde alle Schriften lokal ein statt ueber Google Fonts.
Lade die benoetigten woff2-Dateien in den public-Ordner, definiere
sie per @font-face im CSS und entferne jede Referenz auf
fonts.googleapis.com und fonts.gstatic.com, einschliesslich der
preconnect-Links im head.Lad die Seite neu mit geöffnetem Netzwerk-Reiter und einem harten Neuladen, damit nichts aus dem Zwischenspeicher kommt. Es darf keine einzige Zeile mehr zu googleapis.com oder gstatic.com auftauchen.
Denk daran, dass Schriften selten allein kommen. Eine eingebettete Karte, ein YouTube-Video, ein Chat-Fenster oder ein Analyse-Skript öffnen dieselbe Art von Verbindung, teils mit Cookies, und dann kommt § 25 TDDDG dazu. Ein Scan zeigt dir alle Verbindungen auf einmal.
ADRESSE DEINER WEBSITE EINFÜGENNein, meistens schneller. Der Browser spart den Verbindungsaufbau zu einer fremden Domain, und die Datei kommt von derselben Verbindung wie der Rest der Seite.
Die Schriften bei Google Fonts stehen unter freien Lizenzen, meist der SIL Open Font License, die das ausdrücklich erlaubt. Bei gekauften Schriften anderer Anbieter gilt deren Lizenz, da lohnt ein Blick.
Gleiches Muster, gleiche Lösung: Dateien herunterladen, lokal einbinden, den CDN-Link entfernen.
Die Frage ist weniger die Menge als die Sache: Es dauert zehn Minuten und die Übertragung hört auf. Ob in deinem Fall eine Pflicht besteht, klärt eine Anwältin, nicht wir.
Google-Fonts-Check: lädt deine Seite Schriften von Google? · Wie wir selbst mit Daten umgehen
Technische Anleitung. Rechtliche Hinweise darin sind allgemeine Informationen mit Verweis auf die jeweilige Regel, keine Rechtsberatung und keine Bewertung deines Einzelfalls.