{"id":15699,"date":"2026-09-06T00:40:21","date_gmt":"2026-09-05T22:40:21","guid":{"rendered":"https:\/\/www.lukaswojcik.com\/blog\/werkzeuge\/web-font-loading-privacy-auditor\/"},"modified":"2026-09-06T00:40:21","modified_gmt":"2026-09-05T22:40:21","slug":"web-font-loading-privacy-auditor","status":"publish","type":"page","link":"https:\/\/www.lukaswojcik.com\/blog\/de\/werkzeuge\/web-font-loading-privacy-auditor\/","title":{"rendered":"Webschriften-Pr\u00fcfer f\u00fcr Ladeverhalten und Datenschutz: font-display, woff2, preload, fremde Hosts"},"content":{"rendered":"<div class=\"gtm-analyser-container\" style=\"background: var(--bg-panel, #1e1e24); padding: 25px; border-radius: 8px; border: 1px solid var(--border, #2a2a35);\">\n<p style=\"color: var(--text-secondary, #a0a0b0); margin-bottom: 20px;\">Eine Webschrift entscheidet \u00fcber zwei Dinge, die ein Besucher bemerkt: ob Text sichtbar ist, w\u00e4hrend die Datei noch l\u00e4dt, und zu wem der Browser eine Verbindung aufbaut, bevor irgendjemand zugestimmt hat. Beides steht in der @font-face-Regel und in der preload-Zeile dar\u00fcber. Diese Pr\u00fcfung liest die Seite und ihre Stilbl\u00e4tter, sammelt jede Regel und fragt zu jeder Schriftdatei allein die Kopfzeilen ab.<\/p>\n<div style=\"margin-bottom: 14px;\">\n        <label for=\"schrift-url\" style=\"color: var(--text-secondary, #a0a0b0); display: block; font-size: 0.85rem; margin-bottom: 5px;\">Seitenadresse<\/label><br \/>\n        <input id=\"schrift-url\" type=\"text\" value=\"https:\/\/www.lukaswojcik.com\/blog\/en\/toolbox\/\" class=\"form-control\" style=\"width: 100%; padding: 10px; background: var(--bg-body, #14141a); border: 1px solid var(--border, #2a2a35); color: var(--text-primary, #e8e8ee); border-radius: 6px; box-sizing: border-box; font-family: monospace;\">\n    <\/div>\n<p style=\"color: var(--text-secondary, #a0a0b0); font-size: 0.82rem; margin-bottom: 16px;\">Von diesem Server: eine Anfrage f\u00fcr die Seite, bis zu vier f\u00fcr Stilbl\u00e4tter und je Schriftdatei ein HEAD. Die Schriftdateien selbst werden nie heruntergeladen. Es werden keine Cookies gesendet, keine Skripte ausgef\u00fchrt und nichts gespeichert au\u00dfer dem Z\u00e4hlerstand.<\/p>\n<p>    <button id=\"schrift-btn\" class=\"button\" style=\"background: var(--accent, #7ee787); color: var(--on-accent, #0b1114); border: none; padding: 12px 24px; border-radius: 6px; font-weight: 700; cursor: pointer;\">Webschriften pr\u00fcfen<\/button><\/p>\n<div id=\"schrift-ausgabe\" style=\"margin-top: 22px;\"><\/div>\n<p style=\"color: var(--text-secondary, #a0a0b0); font-size: 0.8rem; margin: 24px 0 0;\">Grenzen, die zu kennen sich lohnt: Verfolgt werden nur Stilbl\u00e4tter, die im ausgelieferten HTML verlinkt sind, h\u00f6chstens vier davon und je 512 KB. Regeln, die ein Skript sp\u00e4ter erg\u00e4nzt, bleiben unsichtbar, und eine Schrift, die im CSS steht, aber auf kein Element angewandt wird, z\u00e4hlt hier trotzdem mit.<\/p>\n<\/div>\n<p><script>\n(function () {\n    'use strict';<\/p>\n<p>    const T = {\"einleitung\":\"Eine Webschrift entscheidet \u00fcber zwei Dinge, die ein Besucher bemerkt: ob Text sichtbar ist, w\u00e4hrend die Datei noch l\u00e4dt, und zu wem der Browser eine Verbindung aufbaut, bevor irgendjemand zugestimmt hat. Beides steht in der @font-face-Regel und in der preload-Zeile dar\u00fcber. Diese Pr\u00fcfung liest die Seite und ihre Stilbl\u00e4tter, sammelt jede Regel und fragt zu jeder Schriftdatei allein die Kopfzeilen ab.\",\"label_url\":\"Seitenadresse\",\"datenschutz\":\"Von diesem Server: eine Anfrage f\u00fcr die Seite, bis zu vier f\u00fcr Stilbl\u00e4tter und je Schriftdatei ein HEAD. Die Schriftdateien selbst werden nie heruntergeladen. Es werden keine Cookies gesendet, keine Skripte ausgef\u00fchrt und nichts gespeichert au\u00dfer dem Z\u00e4hlerstand.\",\"knopf\":\"Webschriften pr\u00fcfen\",\"laeuft\":\"Seite und Stilbl\u00e4tter werden geholt...\",\"grenze\":\"Grenzen, die zu kennen sich lohnt: Verfolgt werden nur Stilbl\u00e4tter, die im ausgelieferten HTML verlinkt sind, h\u00f6chstens vier davon und je 512 KB. Regeln, die ein Skript sp\u00e4ter erg\u00e4nzt, bleiben unsichtbar, und eine Schrift, die im CSS steht, aber auf kein Element angewandt wird, z\u00e4hlt hier trotzdem mit.\",\"h_schriften\":\"Gefundene @font-face-Regeln\",\"tabelle_hinweis\":\"Herkunft sagt, ob die Datei vom selben Host stammt wie die Seite. Teilmenge bedeutet, dass die Regel eine unicode-range tr\u00e4gt und der Browser nur die ben\u00f6tigten Zeichen l\u00e4dt.\",\"h_befunde\":\"Befunde\",\"sp_familie\":\"Familie\",\"sp_gewicht\":\"Schnitt\",\"sp_display\":\"font-display\",\"sp_format\":\"Formate\",\"sp_herkunft\":\"Herkunft\",\"sp_bereich\":\"Teilmenge\",\"sp_groesse\":\"Gr\u00f6\u00dfe\",\"zeile_seite\":\"Seite\",\"zeile_blaetter\":\"Gelesene Stilbl\u00e4tter\",\"zeile_faces\":\"@font-face-Regeln\",\"zeile_dauer\":\"Dauer\",\"zeile_limit\":\"Pr\u00fcfungen in dieser Stunde \u00fcbrig\",\"wert_fehlt\":\"fehlt\",\"wert_eigen\":\"eigener Host\",\"wert_ja\":\"ja\",\"wert_nein\":\"nein\",\"stufe_hoch\":\"Hoch\",\"stufe_mittel\":\"Mittel\",\"stufe_niedrig\":\"Niedrig\",\"stufe_info\":\"Hinweis\",\"stufe_gut\":\"In Ordnung\",\"keine_befunde\":\"Nichts zu melden.\",\"urteil_gut\":\"Die Schriften laden sauber.\",\"urteil_warnung\":\"Die Schriften funktionieren, aber Textsichtbarkeit oder Datenschutz werden verschenkt.\",\"urteil_kritisch\":\"Eine Schriftdatei ist unerreichbar, oder ein preload l\u00e4sst den Browser eine Datei zweimal holen.\",\"fehler_kein_token\":\"Die Pr\u00fcfung lie\u00df sich nicht starten, weil reCAPTCHA nicht geladen hat.\",\"fehler_captcha\":\"reCAPTCHA hat die Anfrage als automatisiert eingestuft. Ein Neuladen der Seite hilft meist.\",\"fehler_zu_viele\":\"Das Limit von {limit} Pr\u00fcfungen je Stunde f\u00fcr diese Adresse ist erreicht.\",\"fehler_adresse\":\"Diese Adresse l\u00e4sst sich nicht verwenden.\",\"fehler_abruf\":\"Die Seite lie\u00df sich nicht abrufen.\",\"fehler_zaehler\":\"Der Z\u00e4hler ist nicht erreichbar, deshalb wurde nichts gepr\u00fcft.\",\"fehler_pruefdienst\":\"Der reCAPTCHA-Dienst war nicht erreichbar.\",\"fehler_aufbau\":\"Der Dienst ist nicht richtig eingerichtet. Der Fehler liegt auf dieser Seite.\",\"fehler_eingabe\":\"Die Anfrage lie\u00df sich nicht lesen.\",\"fehler_methode\":\"Falsche Anfragemethode.\",\"fehler_netz\":\"Der Dienst war nicht erreichbar.\",\"fehler_antwort\":\"Die Antwort lie\u00df sich nicht lesen.\",\"fehler_unbekannt\":\"Es ist etwas schiefgegangen, wof\u00fcr es keine eigene Meldung gibt.\",\"grund_leer\":\"Es wurde nichts eingegeben.\",\"grund_zu_lang\":\"Die Eingabe ist zu lang.\",\"grund_unlesbar\":\"Das ergibt keine Adresse.\",\"grund_schema\":\"Gepr\u00fcft werden nur http- und https-Adressen.\",\"grund_benutzerinfo\":\"Eingaben mit Zugangsdaten darin werden abgewiesen.\",\"grund_kein_punkt\":\"Der Hostname braucht mindestens einen Punkt.\",\"grund_hostform\":\"Erwartet wird ein Hostname, keine IP-Adresse.\",\"grund_port\":\"Gepr\u00fcft werden nur die Ports 80, 443, 8080 und 8443.\",\"grund_gesperrter_bereich\":\"Dieser Host l\u00f6st in ein privates oder reserviertes Netz auf. Solche werden nie abgerufen.\",\"grund_kein_dns\":\"Der Hostname l\u00f6st nicht auf.\",\"grund_abruf\":\"Die Adresse hat nicht geantwortet.\",\"grund_zu_viele_spruenge\":\"Die Adresse leitet zu oft weiter.\",\"befund_status\":\"Die Seite antwortete mit Status {status} || Die Stilbl\u00e4tter wurden trotzdem aus dem gelieferten Rumpf gelesen, aber eine Seite ohne 200 zeigt selten das, was Besucher sehen.\",\"befund_blatt_unerreichbar\":\"Ein Stilblatt lie\u00df sich nicht abrufen || {url}, Grund: {grund}. Die Schriftregeln darin bleiben unbekannt, diese Pr\u00fcfung kann also unvollst\u00e4ndig sein.\",\"befund_blatt_status\":\"Ein Stilblatt antwortete mit Status {status} || {url}. Welche Schriftregeln darin stehen, fehlt in diesem Bericht \u2014 und auf der Seite.\",\"befund_blatt_gekappt\":\"Ein Stilblatt war l\u00e4nger als {kb} KB || {url}. Es wurde bis dahin gelesen; Regeln dahinter sind nicht gesehen worden.\",\"befund_nur_stichprobe_css\":\"{gesamt} Stilbl\u00e4tter sind verlinkt, gelesen wurden die ersten {n} || Eine Stichprobe h\u00e4lt die Last auf dem gepr\u00fcften Server klein. Regeln in den \u00fcbrigen Dateien stehen nicht in diesem Bericht.\",\"befund_keine_schriften\":\"Keine @font-face-Regel gefunden || Die Seite nutzt entweder Schriften, die auf dem Ger\u00e4t des Besuchers liegen, oder gar keine. Das ist die schnellste und sparsamste L\u00f6sung, die es gibt: null Bytes, null Verbindungen zu Dritten.\",\"befund_schrift_unerreichbar\":\"Die Schriftdatei zu {familie} lie\u00df sich nicht abrufen || {url}, Grund: {grund}. Browser fallen auf die n\u00e4chste Familie der Liste zur\u00fcck, die Seite sieht also anders aus, als das Design annimmt.\",\"befund_schrift_status\":\"Die Schriftdatei zu {familie} antwortete mit Status {status} || {url}. Die Regel zeigt auf eine Datei, die der Server nicht ausliefert.\",\"befund_schrift_ohne_cache_control\":\"Die Schriftdatei zu {familie} tr\u00e4gt kein Cache-Control || {url}. Schriften \u00e4ndern sich ungef\u00e4hr nie; ohne die Kopfzeile entscheidet jeder Zwischenspeicher selbst, und manche fragen beim n\u00e4chsten Besuch erneut nach.\",\"befund_schrift_kurzer_cache\":\"Die Schriftdatei zu {familie} darf {sekunden} Sekunden zwischengespeichert werden || F\u00fcr eine Datei, deren Inhalt sich nie \u00e4ndert, ist das kurz. Ein Jahr ist der \u00fcbliche Wert, sobald die Adresse eine Version tr\u00e4gt.\",\"befund_ohne_font_display\":\"{n} von {gesamt} Regeln tragen kein font-display || Der Vorgabewert ist auto, und jeder verbreitete Browser behandelt ihn wie block: Text in dieser Familie bleibt bis zu drei Sekunden unsichtbar, w\u00e4hrend die Datei l\u00e4dt. swap zeigt die Ersatzschrift sofort und tauscht sp\u00e4ter.\",\"befund_font_display_block\":\"{n} Regeln verwenden font-display: auto oder block || Beides verbirgt den Text, bis die Schrift da ist. Auf einer langsamen Verbindung ist das eine Seite mit \u00dcberschriften und ohne Worte.\",\"befund_font_display_gut\":\"Alle {n} Regeln setzen ein font-display, das Text sichtbar h\u00e4lt || swap, fallback oder optional \u2014 der Text erscheint in der Ersatzfamilie und wird getauscht, sobald die Datei eintrifft.\",\"befund_ohne_unicode_range\":\"{n} Regeln tragen keine unicode-range || Ohne sie l\u00e4dt der Browser den ganzen Zeichenvorrat, samt der Alphabete, die auf der Seite nie vorkommen. Erst die Teilmenge macht eine Schriftdatei klein.\",\"befund_ohne_woff2\":\"{n} Regeln bieten kein woff2 an || woff2 ist heute das einzige Format, das sich zu liefern lohnt: \u00fcberall verstanden, wo es z\u00e4hlt, und rund ein Drittel kleiner als woff.\",\"befund_schwere_schriften\":\"{n} Schriftdateien wiegen mehr als {grenze_kb} KB || Ein einzelner Schnitt einer auf Latein beschr\u00e4nkten Schrift liegt typisch bei 15 bis 30 KB. Was weit dar\u00fcber liegt, tr\u00e4gt entweder viele Alphabete oder viele Zeichen, die niemand liest.\",\"befund_viele_familien\":\"{n} verschiedene Familien sind deklariert || Jede Familie kostet mindestens eine Datei, meist mehrere Schnitte. Zwei Familien sind eine Gestaltungsentscheidung, f\u00fcnf meist ein Rest aus fr\u00fcheren Zeiten.\",\"befund_schriften_gefunden\":\"{faces} Regeln \u00fcber {familien} Familien || Das ist, was die Stilbl\u00e4tter deklarieren, nicht zwingend das, was die Seite verwendet.\",\"befund_schriften_von_google\":\"Schriften werden von Google geladen || {hosts}. Der Browser verbindet sich mit Google, bevor irgendetwas vereinbart ist, und die IP-Adresse des Besuchers reist mit. In Deutschland gibt es dazu Gerichtsentscheidungen; die Dateien selbst zu hosten nimmt die Frage vollst\u00e4ndig heraus und l\u00e4dt meist auch schneller.\",\"befund_schriften_fremd\":\"Schriften kommen von {n} fremden Host(s) || {hosts}. Jeder fremde Host bedeutet eine zus\u00e4tzliche Namensaufl\u00f6sung, eine zus\u00e4tzliche Verbindung und eine weitere Stelle, die die IP-Adresse des Besuchers sieht.\",\"befund_fremder_host_ohne_preconnect\":\"Kein preconnect f\u00fcr {host} || Die Verbindung zum fremden Schrifthost entsteht erst, wenn das Stilblatt gelesen ist. Ein preconnect im Kopf beginnt sie fr\u00fcher und spart typisch hundert Millisekunden und mehr.\",\"befund_schriften_eigen\":\"Alle Schriften kommen vom Host der Seite || Kein Dritter ist beteiligt, und die Verbindung steht bereits, wenn die Anfrage hinausgeht.\",\"befund_preload_ohne_crossorigin\":\"Eine Schrift wird ohne crossorigin vorgeladen || {url}. Schriften werden immer anonym geholt, deshalb passt der vorgeladene Eintrag nicht zur sp\u00e4teren Anfrage: Der Browser l\u00e4dt die Datei ein zweites Mal. Das Attribut kostet nichts und ist auch f\u00fcr eine Schrift auf dem eigenen Host n\u00f6tig.\",\"befund_preload_gut\":\"Eine Schrift wird mit crossorigin vorgeladen || {url}. Das ist die Kombination, die die Anfrage wirklich spart, statt sie zu verdoppeln.\",\"befund_kein_preload\":\"Keine Schrift wird vorgeladen || Schriften werden erst entdeckt, wenn das Stilblatt gelesen ist. Ein preload f\u00fcr die eine Schrift im sichtbaren Bereich zieht diese Entdeckung vor; mehr als eine oder zwei helfen selten.\"};<\/p>\n<p>    var ENDPUNKT = '\/lw-schriftcheck.php';\n    var SITEKEY = '6LcrPkEtAAAAAPo1QCOf-IIM2fCL0UfdJz4y2iSY';\n    var STUFEN = ['hoch', 'mittel', 'niedrig', 'info', 'gut'];<\/p>\n<p>    function liste(w) { return Array.isArray(w) ? w : []; }\n    function zahl(w) { return (typeof w === 'number' && isFinite(w)) ? w : null; }\n    function zeichen(w) { return (typeof w === 'string' && w !== '') ? w : null; }\n    function text(schluessel, daten) {\n        var t = T[schluessel];\n        if (typeof t !== 'string') { return null; }\n        return t.replace(\/\\{([a-z_0-9]+)\\}\/g, function (m, k) {\n            return (daten && daten[k] !== undefined && daten[k] !== null) ? String(daten[k]) : m;\n        });\n    }\n    function kurz(url) {\n        var s = String(url || '').replace(\/^https?:\\\/\\\/\/, '');\n        return s.length <= 52 ? s : s.slice(0, 24) + '\u2026' + s.slice(-26);\n    }\n\n    function bewerten(antwort) {\n        var a = antwort || {};\n        if (a.fehler) { return { fehler: String(a.fehler), grund: a.grund || null, limit: zahl(a.limit) }; }\n        var befunde = liste(a.befunde).map(function (f) {\n            return { key: String(f.key || ''), stufe: STUFEN.indexOf(f.stufe) === -1 ? 'info' : f.stufe, daten: (f.daten &#038;&#038; typeof f.daten === 'object') ? f.daten : {} };\n        });\n        var gruppen = {};\n        STUFEN.forEach(function (s) { gruppen[s] = befunde.filter(function (f) { return f.stufe === s; }); });\n        var schriften = liste(a.schriften).map(function (z) {\n            return {\n                familie: zeichen(z.familie), gewicht: zeichen(z.gewicht), display: zeichen(z.display),\n                formate: liste(z.formate).filter(function (x) { return typeof x === 'string'; }),\n                host: zeichen(z.host), fremd: z.fremd === true, bereich: z.bereich === true,\n                kb: zahl(z.kb), status: zahl(z.status)\n            };\n        });\n        return {\n            fehler: null, url: String(a.url || ''), endurl: String(a.endurl || ''), host: String(a.host || ''),\n            urteil: (a.urteil === 'gut' || a.urteil === 'warnung' || a.urteil === 'kritisch') ? a.urteil : 'kritisch',\n            blaetter: zahl(a.blaetter), schriften: schriften,\n            befunde: befunde, gruppen: gruppen, dauer: zahl(a.dauer_ms), limitRest: zahl(a.limit_rest)\n        };\n    }\n\n    function skriptLaden() {\n        return new Promise(function (auf) {\n            if (window.grecaptcha) { auf(true); return; }\n            var s = document.createElement('script');\n            s.src = 'https:\/\/www.google.com\/recaptcha\/api.js?render=' + SITEKEY;\n            s.onload = function () { auf(true); }; s.onerror = function () { auf(false); };\n            document.head.appendChild(s);\n            setTimeout(function () { auf(!!window.grecaptcha); }, 8000);\n        });\n    }\n    function tokenHolen() {\n        return skriptLaden().then(function (da) {\n            if (!da || !window.grecaptcha || !window.grecaptcha.ready) { return null; }\n            return new Promise(function (auf) {\n                var fertig = false;\n                function einmal(w) { if (!fertig) { fertig = true; auf(w); } }\n                setTimeout(function () { einmal(null); }, 12000);\n                try {\n                    window.grecaptcha.ready(function () {\n                        if (fertig) { return; }\n                        if (!window.grecaptcha.execute) { einmal(null); return; }\n                        window.grecaptcha.execute(SITEKEY, { action: 'schriftcheck' }).then(function (t) { einmal(t || null); }, function () { einmal(null); });\n                    });\n                } catch (e) { einmal(null); }\n            });\n        }, function () { return null; });\n    }\n    function abfragen(url) {\n        return tokenHolen().then(function (token) {\n            return fetch(ENDPUNKT, { method: 'POST', headers: { 'Content-Type': 'application\/json' }, body: JSON.stringify({ url: url, token: token || '' }) })\n                .then(function (r) { return r.json().then(function (j) { return j; }, function () { return { fehler: 'antwort' }; }); }, function () { return { fehler: 'netz' }; });\n        });\n    }\n\n    window.LW_TEST = window.LW_TEST || {};\n    window.LW_TEST.SCHRIFT = { bewerten: bewerten, darstellen: null, text: text, kurz: kurz, ENDPUNKT: ENDPUNKT, STUFEN: STUFEN, T: T };\n\n    var btn = document.getElementById('schrift-btn');\n    var out = document.getElementById('schrift-ausgabe');\n    if (!btn || !out) { return; }\n\n    function el(tag, stil, txt) { var e = document.createElement(tag); if (stil) { e.setAttribute('style', stil); } if (txt !== undefined &#038;&#038; txt !== null) { e.textContent = txt; } return e; }\n    function wert(id) { var e = document.getElementById(id); return e ? e.value : ''; }\n    var UEBERSCHRIFT = 'font-family: \"Nunito Sans\", sans-serif; font-weight: 700; color: var(--text-primary, #e8e8ee); font-size: 0.95rem; margin: 22px 0 8px;';\n    var ZELLE = 'padding: 5px 12px 5px 0; color: var(--text-secondary, #a0a0b0); font-size: 0.87rem;';\n    var ZELLE_WERT = 'padding: 5px 12px 5px 0; color: var(--text-primary, #e8e8ee); font-size: 0.87rem; font-family: monospace; word-break: break-all;';\n    var KASTEN = 'background: var(--bg-body, #14141a); border: 1px solid var(--border, #2a2a35); border-radius: 8px; padding: 14px 16px; margin: 0 0 10px;';\n    var GUT = ' color: #7ee787;', WARN = ' color: #ffa94d;', ROT = ' color: #ff7b72;', GRAU = ' color: #8a8a99;';\n    var FARBEN = { hoch: '#ff7b72', mittel: '#ffa94d', niedrig: '#e3b341', info: '#8a8a99', gut: '#7ee787' };\n    var URTEIL = { gut: GUT, warnung: WARN, kritisch: ROT };\n    function gitter(sp) { return el('div', 'display: grid; grid-template-columns: ' + sp + '; gap: 0 18px; align-items: baseline;'); }\n    function paar(g, n, w, stil) { g.appendChild(el('div', ZELLE, n)); g.appendChild(el('div', ZELLE_WERT + (stil || ''), w)); }\n\n    function tabelle(b) {\n        var huelle = el('div', 'overflow-x: auto; margin: 0 0 6px;');\n        var t = el('table', 'border-collapse: collapse; width: 100%; min-width: 640px; font-size: 0.84rem;');\n        var kopf = el('tr', '');\n        [T.sp_familie, T.sp_gewicht, T.sp_display, T.sp_format, T.sp_herkunft, T.sp_bereich, T.sp_groesse].forEach(function (n) {\n            kopf.appendChild(el('th', 'text-align: left; padding: 6px 12px 6px 0; color: #8a8a99; font-weight: 700; font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.4px; border-bottom: 1px solid var(--border, #2a2a35); white-space: nowrap;', n));\n        });\n        t.appendChild(kopf);\n        b.schriften.forEach(function (z) {\n            var r = el('tr', '');\n            function zelle(txt, stil) { r.appendChild(el('td', 'padding: 7px 12px 7px 0; border-bottom: 1px solid var(--border, #2a2a35); font-family: monospace; color: var(--text-primary, #e8e8ee);' + (stil || ''), txt)); }\n            zelle(z.familie || '-');\n            zelle(z.gewicht || '-', GRAU);\n            var gutesDisplay = z.display === 'swap' || z.display === 'fallback' || z.display === 'optional';\n            zelle(z.display || T.wert_fehlt, gutesDisplay ? GUT : WARN);\n            zelle(z.formate.length ? z.formate.join(', ') : '-', z.formate.indexOf('woff2') !== -1 ? GUT : WARN);\n            zelle(z.fremd ? (z.host || '-') : T.wert_eigen, z.fremd ? WARN : GUT);\n            zelle(z.bereich ? T.wert_ja : T.wert_nein, z.bereich ? GUT : GRAU);\n            zelle(z.kb !== null ? z.kb + ' KB' : '-', GRAU);\n            t.appendChild(r);\n        });\n        huelle.appendChild(t);\n        return huelle;\n    }\n\n    function darstellen(b, ziel) {\n        ziel.innerHTML = '';\n        if (b.fehler) {\n            var txt = T['fehler_' + b.fehler] || T.fehler_unbekannt;\n            if (b.grund &#038;&#038; T['grund_' + b.grund]) { txt = txt + ' ' + T['grund_' + b.grund]; }\n            if (b.limit !== null) { txt = txt.replace('{limit}', String(b.limit)); }\n            ziel.appendChild(el('p', ZELLE + WARN + ' margin: 0;', txt));\n            return;\n        }\n        ziel.appendChild(el('div', 'font-size: 1.05rem; font-weight: 700; margin: 0 0 12px;' + URTEIL[b.urteil], T['urteil_' + b.urteil]));\n\n        var g = gitter('auto auto');\n        paar(g, T.zeile_seite, b.endurl || b.url, GRAU);\n        paar(g, T.zeile_blaetter, String(b.blaetter !== null ? b.blaetter : '-'), GRAU);\n        paar(g, T.zeile_faces, String(b.schriften.length), GRAU);\n        if (b.dauer !== null) { paar(g, T.zeile_dauer, b.dauer + ' ms', GRAU); }\n        if (b.limitRest !== null) { paar(g, T.zeile_limit, String(b.limitRest), GRAU); }\n        ziel.appendChild(g);\n\n        if (b.schriften.length) {\n            ziel.appendChild(el('div', UEBERSCHRIFT, T.h_schriften));\n            ziel.appendChild(tabelle(b));\n            ziel.appendChild(el('p', ZELLE + ' margin: 0 0 6px; font-size: 0.8rem;', T.tabelle_hinweis));\n        }\n\n        ziel.appendChild(el('div', UEBERSCHRIFT, T.h_befunde));\n        var irgendwas = false;\n        STUFEN.forEach(function (s) {\n            var gr = b.gruppen[s];\n            if (!gr.length) { return; }\n            irgendwas = true;\n            ziel.appendChild(el('div', 'font-weight: 700; font-size: 0.82rem; text-transform: uppercase; letter-spacing: 0.5px; margin: 14px 0 6px; color: ' + FARBEN[s] + ';', T['stufe_' + s] + ' (' + gr.length + ')'));\n            gr.forEach(function (f) {\n                var k = el('div', KASTEN + ' border-left: 3px solid ' + FARBEN[s] + ';');\n                var daten = {};\n                Object.keys(f.daten).forEach(function (n) { daten[n] = (n === 'url') ? kurz(f.daten[n]) : f.daten[n]; });\n                var t = text('befund_' + f.key, daten) || f.key;\n                var teile = t.split(' || ');\n                k.appendChild(el('div', 'color: var(--text-primary, #e8e8ee); font-size: 0.9rem; font-weight: 700;', teile[0]));\n                if (teile[1]) { k.appendChild(el('div', ZELLE + ' padding: 6px 0 0; line-height: 1.55;', teile[1])); }\n                ziel.appendChild(k);\n            });\n        });\n        if (!irgendwas) { ziel.appendChild(el('p', ZELLE + ' margin: 0;', T.keine_befunde)); }\n    }\n    window.LW_TEST.SCHRIFT.darstellen = darstellen;\n\n    var laeuft = false;\n    btn.addEventListener('click', function () {\n        if (laeuft) { return; }\n        laeuft = true; btn.disabled = true;\n        out.innerHTML = '';\n        out.appendChild(el('p', ZELLE + GRAU + ' margin: 0;', T.laeuft));\n        abfragen(wert('schrift-url')).then(function (a) { darstellen(bewerten(a), out); laeuft = false; btn.disabled = false; },\n            function () { darstellen(bewerten({ fehler: 'netz' }), out); laeuft = false; btn.disabled = false; });\n    });\n})();\n<\/script><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Holt eine Seite samt ihren Stilbl\u00e4ttern, liest jede @font-face-Regel und pr\u00fcft, was wirklich Zeit oder Datenschutz kostet: ob font-display \u00fcberhaupt gesetzt ist, ob die Datei von einem fremden Host kommt, ob woff2 angeboten wird, ob Teilmengen verwendet werden und ob ein preload f\u00fcr eine Schrift crossorigin tr\u00e4gt. Die Schriftdateien selbst werden nie geladen, nur ihre Kopfzeilen abgefragt.<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":9283,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"template-tool-base.php","meta":{"footnotes":""},"tags":[92265,92759,92292],"class_list":["post-15699","page","type-page","status-publish","hentry","tag-prywatnosc-danych-pl-de","tag-web-development-de","tag-web-performance-de"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v28.1 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Webschriften-Pr\u00fcfer f\u00fcr Ladeverhalten und Datenschutz: font-display, woff2, preload, fremde Hosts - Lukas Wojcik - Blog<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.lukaswojcik.com\/blog\/de\/werkzeuge\/web-font-loading-privacy-auditor\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Webschriften-Pr\u00fcfer f\u00fcr Ladeverhalten und Datenschutz: font-display, woff2, preload, fremde Hosts - Lukas Wojcik - Blog\" \/>\n<meta property=\"og:description\" content=\"Holt eine Seite samt ihren Stilbl\u00e4ttern, liest jede @font-face-Regel und pr\u00fcft, was wirklich Zeit oder Datenschutz kostet: ob font-display \u00fcberhaupt gesetzt ist, ob die Datei von einem fremden Host kommt, ob woff2 angeboten wird, ob Teilmengen verwendet werden und ob ein preload f\u00fcr eine Schrift crossorigin tr\u00e4gt. Die Schriftdateien selbst werden nie geladen, nur ihre Kopfzeilen abgefragt.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.lukaswojcik.com\/blog\/de\/werkzeuge\/web-font-loading-privacy-auditor\/\" \/>\n<meta property=\"og:site_name\" content=\"Lukas Wojcik - Blog\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.lukaswojcik.com\/blog\/wp-content\/uploads\/2026\/08\/og-default.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1200\" \/>\n\t<meta property=\"og:image:height\" content=\"630\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"1 minute\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.lukaswojcik.com\\\/blog\\\/de\\\/werkzeuge\\\/web-font-loading-privacy-auditor\\\/\",\"url\":\"https:\\\/\\\/www.lukaswojcik.com\\\/blog\\\/de\\\/werkzeuge\\\/web-font-loading-privacy-auditor\\\/\",\"name\":\"Webschriften-Pr\u00fcfer f\u00fcr Ladeverhalten und Datenschutz: font-display, woff2, preload, fremde Hosts - Lukas Wojcik - Blog\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.lukaswojcik.com\\\/blog\\\/#website\"},\"datePublished\":\"2026-09-05T22:40:21+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.lukaswojcik.com\\\/blog\\\/de\\\/werkzeuge\\\/web-font-loading-privacy-auditor\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.lukaswojcik.com\\\/blog\\\/de\\\/werkzeuge\\\/web-font-loading-privacy-auditor\\\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.lukaswojcik.com\\\/blog\\\/de\\\/werkzeuge\\\/web-font-loading-privacy-auditor\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.lukaswojcik.com\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Toolbox\",\"item\":\"https:\\\/\\\/www.lukaswojcik.com\\\/blog\\\/toolbox-2\\\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Webschriften-Pr\u00fcfer f\u00fcr Ladeverhalten und Datenschutz: font-display, woff2, preload, fremde Hosts\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.lukaswojcik.com\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/www.lukaswojcik.com\\\/blog\\\/\",\"name\":\"Lukas Wojcik - Blog\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.lukaswojcik.com\\\/blog\\\/#\\\/schema\\\/person\\\/895f7604f9b6b71aad9bba33af28d0f9\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.lukaswojcik.com\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":[\"Person\",\"Organization\"],\"@id\":\"https:\\\/\\\/www.lukaswojcik.com\\\/blog\\\/#\\\/schema\\\/person\\\/895f7604f9b6b71aad9bba33af28d0f9\",\"name\":\"luky\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.lukaswojcik.com\\\/blog\\\/wp-content\\\/uploads\\\/2026\\\/07\\\/lw-x2.jpg\",\"url\":\"https:\\\/\\\/www.lukaswojcik.com\\\/blog\\\/wp-content\\\/uploads\\\/2026\\\/07\\\/lw-x2.jpg\",\"contentUrl\":\"https:\\\/\\\/www.lukaswojcik.com\\\/blog\\\/wp-content\\\/uploads\\\/2026\\\/07\\\/lw-x2.jpg\",\"width\":424,\"height\":636,\"caption\":\"luky\"},\"logo\":{\"@id\":\"https:\\\/\\\/www.lukaswojcik.com\\\/blog\\\/wp-content\\\/uploads\\\/2026\\\/07\\\/lw-x2.jpg\"},\"sameAs\":[\"https:\\\/\\\/www.lukaswojcik.com\\\/blog\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Webschriften-Pr\u00fcfer f\u00fcr Ladeverhalten und Datenschutz: font-display, woff2, preload, fremde Hosts - Lukas Wojcik - Blog","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.lukaswojcik.com\/blog\/de\/werkzeuge\/web-font-loading-privacy-auditor\/","og_locale":"en_US","og_type":"article","og_title":"Webschriften-Pr\u00fcfer f\u00fcr Ladeverhalten und Datenschutz: font-display, woff2, preload, fremde Hosts - Lukas Wojcik - Blog","og_description":"Holt eine Seite samt ihren Stilbl\u00e4ttern, liest jede @font-face-Regel und pr\u00fcft, was wirklich Zeit oder Datenschutz kostet: ob font-display \u00fcberhaupt gesetzt ist, ob die Datei von einem fremden Host kommt, ob woff2 angeboten wird, ob Teilmengen verwendet werden und ob ein preload f\u00fcr eine Schrift crossorigin tr\u00e4gt. Die Schriftdateien selbst werden nie geladen, nur ihre Kopfzeilen abgefragt.","og_url":"https:\/\/www.lukaswojcik.com\/blog\/de\/werkzeuge\/web-font-loading-privacy-auditor\/","og_site_name":"Lukas Wojcik - Blog","og_image":[{"width":1200,"height":630,"url":"https:\/\/www.lukaswojcik.com\/blog\/wp-content\/uploads\/2026\/08\/og-default.jpg","type":"image\/jpeg"}],"twitter_card":"summary_large_image","twitter_misc":{"Est. reading time":"1 minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.lukaswojcik.com\/blog\/de\/werkzeuge\/web-font-loading-privacy-auditor\/","url":"https:\/\/www.lukaswojcik.com\/blog\/de\/werkzeuge\/web-font-loading-privacy-auditor\/","name":"Webschriften-Pr\u00fcfer f\u00fcr Ladeverhalten und Datenschutz: font-display, woff2, preload, fremde Hosts - Lukas Wojcik - Blog","isPartOf":{"@id":"https:\/\/www.lukaswojcik.com\/blog\/#website"},"datePublished":"2026-09-05T22:40:21+00:00","breadcrumb":{"@id":"https:\/\/www.lukaswojcik.com\/blog\/de\/werkzeuge\/web-font-loading-privacy-auditor\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.lukaswojcik.com\/blog\/de\/werkzeuge\/web-font-loading-privacy-auditor\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.lukaswojcik.com\/blog\/de\/werkzeuge\/web-font-loading-privacy-auditor\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.lukaswojcik.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Toolbox","item":"https:\/\/www.lukaswojcik.com\/blog\/toolbox-2\/"},{"@type":"ListItem","position":3,"name":"Webschriften-Pr\u00fcfer f\u00fcr Ladeverhalten und Datenschutz: font-display, woff2, preload, fremde Hosts"}]},{"@type":"WebSite","@id":"https:\/\/www.lukaswojcik.com\/blog\/#website","url":"https:\/\/www.lukaswojcik.com\/blog\/","name":"Lukas Wojcik - Blog","description":"","publisher":{"@id":"https:\/\/www.lukaswojcik.com\/blog\/#\/schema\/person\/895f7604f9b6b71aad9bba33af28d0f9"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.lukaswojcik.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":["Person","Organization"],"@id":"https:\/\/www.lukaswojcik.com\/blog\/#\/schema\/person\/895f7604f9b6b71aad9bba33af28d0f9","name":"luky","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.lukaswojcik.com\/blog\/wp-content\/uploads\/2026\/07\/lw-x2.jpg","url":"https:\/\/www.lukaswojcik.com\/blog\/wp-content\/uploads\/2026\/07\/lw-x2.jpg","contentUrl":"https:\/\/www.lukaswojcik.com\/blog\/wp-content\/uploads\/2026\/07\/lw-x2.jpg","width":424,"height":636,"caption":"luky"},"logo":{"@id":"https:\/\/www.lukaswojcik.com\/blog\/wp-content\/uploads\/2026\/07\/lw-x2.jpg"},"sameAs":["https:\/\/www.lukaswojcik.com\/blog"]}]}},"_links":{"self":[{"href":"https:\/\/www.lukaswojcik.com\/blog\/wp-json\/wp\/v2\/pages\/15699","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.lukaswojcik.com\/blog\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.lukaswojcik.com\/blog\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.lukaswojcik.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.lukaswojcik.com\/blog\/wp-json\/wp\/v2\/comments?post=15699"}],"version-history":[{"count":0,"href":"https:\/\/www.lukaswojcik.com\/blog\/wp-json\/wp\/v2\/pages\/15699\/revisions"}],"up":[{"embeddable":true,"href":"https:\/\/www.lukaswojcik.com\/blog\/wp-json\/wp\/v2\/pages\/9283"}],"wp:attachment":[{"href":"https:\/\/www.lukaswojcik.com\/blog\/wp-json\/wp\/v2\/media?parent=15699"}],"wp:term":[{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.lukaswojcik.com\/blog\/wp-json\/wp\/v2\/tags?post=15699"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}