{"id":29746,"date":"2026-03-23T09:34:00","date_gmt":"2026-03-23T08:34:00","guid":{"rendered":"https:\/\/www.web-systems.pl\/core-web-vitals-wordpress-reihenfolge\/"},"modified":"2026-03-23T09:34:00","modified_gmt":"2026-03-23T08:34:00","slug":"core-web-vitals-wordpress-reihenfolge","status":"publish","type":"post","link":"https:\/\/www.web-systems.pl\/de\/core-web-vitals-wordpress-reihenfolge\/","title":{"rendered":"Core Web Vitals in WordPress: eine Reihenfolge, die Sinn ergibt"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\">Die meisten Performance-Projekte, die wir von jemand anderem \u00fcbernehmen, sehen gleich aus. Jemand hat noch ein Cache-Plugin installiert, die Presets durchgeklickt und nach zwei Tagen begonnen, \u00c4nderungen zur\u00fcckzunehmen, weil der Warenkorb oder das Men\u00fc zerfiel. Niemand hat den Ausgangspunkt festgehalten, also l\u00e4sst sich nicht sagen, was geholfen und was geschadet hat. Wir arbeiten seit Jahren mit WordPress, und dasselbe Szenario kehrt unabh\u00e4ngig von der Projektgr\u00f6\u00dfe wieder. Die Reihenfolge der Schritte wiegt hier schwerer als die Wahl des Werkzeugs, deshalb beginnt die Optimierung der Seitengeschwindigkeit mit einem Plan und nicht mit einer Installation.<\/p>\n\n\n\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_86 counter-hierarchy ez-toc-counter ez-toc-grey ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">Inhaltsverzeichnis<\/p>\n<span class=\"ez-toc-title-toggle\"><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/www.web-systems.pl\/de\/core-web-vitals-wordpress-reihenfolge\/#Zuerst_messen_dann_erst_irgendein_Plugin\" >Zuerst messen, dann erst irgendein Plugin<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/www.web-systems.pl\/de\/core-web-vitals-wordpress-reihenfolge\/#Wie_Sie_den_Bericht_lesen_um_den_Engpass_zu_treffen_statt_zu_raten\" >Wie Sie den Bericht lesen, um den Engpass zu treffen statt zu raten<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/www.web-systems.pl\/de\/core-web-vitals-wordpress-reihenfolge\/#LCP_schuld_ist_meist_die_Sichtbarkeit_des_Elements_nicht_das_Gewicht_des_Bildes\" >LCP: schuld ist meist die Sichtbarkeit des Elements, nicht das Gewicht des Bildes<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/www.web-systems.pl\/de\/core-web-vitals-wordpress-reihenfolge\/#CLS_und_Schriften_ein_Kompromiss_den_keine_einzelne_CSS-Regel_loest\" >CLS und Schriften: ein Kompromiss, den keine einzelne CSS-Regel l\u00f6st<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/www.web-systems.pl\/de\/core-web-vitals-wordpress-reihenfolge\/#TBT_steigt_nach_einer_guten_Aenderung_und_das_ist_kein_Rueckschritt\" >TBT steigt nach einer guten \u00c4nderung, und das ist kein R\u00fcckschritt<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/www.web-systems.pl\/de\/core-web-vitals-wordpress-reihenfolge\/#Wartung_was_drei_Monate_nach_der_Einfuehrung_kaputtgeht\" >Wartung: was drei Monate nach der Einf\u00fchrung kaputtgeht<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/www.web-systems.pl\/de\/core-web-vitals-wordpress-reihenfolge\/#Zusammenfassung_eine_vernuenftige_Reihenfolge_statt_einer_Plugin-Liste\" >Zusammenfassung: eine vern\u00fcnftige Reihenfolge statt einer Plugin-Liste<\/a><\/li><\/ul><\/nav><\/div>\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Zuerst_messen_dann_erst_irgendein_Plugin\"><\/span>Zuerst messen, dann erst irgendein Plugin<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Bevor Sie die Konfiguration anfassen, legen Sie eine Kopie des Child-Themes und der Datenbank an. Einen Teil der Korrekturen wird man zur\u00fccknehmen m\u00fcssen, und ohne Bezugspunkt wird das Zur\u00fccknehmen zum Raten. Ein paar Minuten Arbeit, die sp\u00e4ter eine ganze Woche retten.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Die Messung f\u00fcr Mobil und Desktop liegt in getrennten Cache-Eintr\u00e4gen. Ein einfacher Abruf der Adresse w\u00e4rmt nur die Desktop-Variante auf, deshalb trifft der Mobiltest auf einen kalten Cache und zeigt ein zu niedriges Ergebnis. Der erste Durchlauf nach einer vollst\u00e4ndigen Leerung f\u00e4llt immer schlechter aus, weil die zusammengefassten CSS- und JavaScript-Dateien erst erzeugt werden.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Dieselbe Konfiguration liefert zwischen den Durchl\u00e4ufen unterschiedliche Zahlen, deshalb schaue ich auf den <strong>Median aus mehreren Messungen<\/strong> und nicht auf einen einzelnen Wert. F\u00fcr das Iterieren ist ein lokales Werkzeug bequemer: Es arbeitet schnell und begrenzt die Anfragen nicht. Das Urteil f\u00e4llt das Werkzeug von Google, w\u00e4hrend der Indikator im Hosting-Panel allein nichts dar\u00fcber sagt, was eigentlich zu reparieren ist.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Wie_Sie_den_Bericht_lesen_um_den_Engpass_zu_treffen_statt_zu_raten\"><\/span>Wie Sie den Bericht lesen, um den Engpass zu treffen statt zu raten<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Den Bericht \u00f6ffnen wir immer in derselben Reihenfolge, denn erst sie f\u00fcgt sich zu einer Diagnose:<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>die rohen Metriken, bevor Sie auf die Liste der Vorschl\u00e4ge sehen<\/li>\n<li>der LCP-Knoten und was er \u00fcberhaupt ist<\/li>\n<li>der Zeitplan der Netzwerkanfragen<\/li>\n<li>die Aufschl\u00fcsselung der Arbeit des Haupt-Threads<\/li>\n<li>die Ursachen der Layoutverschiebungen<\/li>\n<\/ol>\n\n\n\n<p class=\"wp-block-paragraph\">Die Summe aus Server-Antwortzeit, Verz\u00f6gerung bei der Erkennung des Bildes und dessen Ladezeit zeigt sofort, ob das Hosting, das Template oder die Grafik schuld ist. Wenn die Server-Antwortzeit das Ergebnis nach unten zieht, holt das kein Plugin auf, und das Gespr\u00e4ch wandert zum Thema <a href=\"https:\/\/www.web-systems.pl\/de\/webhosting-und-e-mail-hosting\/\">leistungsf\u00e4higes Hosting f\u00fcr Firmenwebseiten<\/a>. Drei getrennte Gespr\u00e4che und drei getrennte Kostensch\u00e4tzungen.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Wenn der Haupt-Thread vor allem mit Stilen und der Neuberechnung des Layouts besch\u00e4ftigt ist und nicht mit dem Ausf\u00fchren von Skripten, bringt das Herausschneiden von JavaScript nichts. Suchen Sie dann nach der Gr\u00f6\u00dfe des Stylesheets und der Zahl der Elemente im Baum. Ein Eintrag \u00fcber eine lange Aufgabe, der auf das Dokument selbst zeigt, bedeutet Inline-Skripte und im Template eingef\u00fcgte Handler, keine Bibliotheksdatei. Und der h\u00e4ufigste Fehler: Die Arbeit beginnt bei dem, was am leichtesten anzuklicken ist, statt bei dem gr\u00f6\u00dften Kostenpunkt im Bericht.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"LCP_schuld_ist_meist_die_Sichtbarkeit_des_Elements_nicht_das_Gewicht_des_Bildes\"><\/span>LCP: schuld ist meist die Sichtbarkeit des Elements, nicht das Gewicht des Bildes<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Das teuerste Einzelproblem ist ein LCP-Element, das bis zur Initialisierung von JavaScript versteckt ist. Ein Karussell, ein Slider oder ein per Skript gebauter Abschnitt warten auf die gesamte Abh\u00e4ngigkeitskette. Die Komprimierung der Datei rettet dann nichts, wenn der Browser vom Bild erst nach der Ausf\u00fchrung des Codes erf\u00e4hrt.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Ein Preload-Hinweis wirkt nur, wenn er ganz oben im Abschnitt <em>head<\/em> steht, vor den strukturierten Daten und den Analyseskripten. Weiter unten verliert er seinen Sinn, weil der Parser ihn zu sp\u00e4t erreicht. Pr\u00fcfen Sie au\u00dferdem, ob das Banner auf dem Telefon nicht in voller Desktop-Gr\u00f6\u00dfe statt in der von WordPress erzeugten Variante ausgeliefert wird. In Premium-Templates ist das ein nahezu serienm\u00e4\u00dfiger Fehler.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Hintergrundbilder, die ein Skript in einem Rutsch malt, zusammen mit denen unterhalb des sichtbaren Bereichs, konkurrieren mit dem LCP-Bild um Bandbreite und k\u00f6nnen den gesamten Gewinn aus der Grafikoptimierung auffressen. Bei Karussellen lauert noch eine Falle: Den ersten Slide freizulegen, ohne die \u00fcbrigen zu verbergen, repariert LCP, erzeugt aber Layoutverschiebungen. Eine Metrik w\u00e4chst auf Kosten der anderen.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"CLS_und_Schriften_ein_Kompromiss_den_keine_einzelne_CSS-Regel_loest\"><\/span>CLS und Schriften: ein Kompromiss, den keine einzelne CSS-Regel l\u00f6st<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Regeln, die das Layout absichern und im Stylesheet des Themes stehen, wirken nicht, wenn dieses Stylesheet asynchron geladen wird. Sie m\u00fcssen inline in den Abschnitt <em>head<\/em> und von der Optimierung ausgeschlossen werden, sonst treffen sie nach dem ersten Malen ein.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Derselbe Mechanismus betrifft die Schriftarten. Font-Deklarationen in einem zusammengefassten, asynchronen Stylesheet kommen zu sp\u00e4t, deshalb verschiebt der Wechsel der Schrift die \u00dcberschriften. Das Einf\u00fcgen der Deklarationen inline beseitigt das Reihenfolgeproblem, h\u00e4lt aber die Textanzeige zur\u00fcck und verschlechtert FCP. Das Preloaden der Schnitte verbessert die Stabilit\u00e4t, nur reisen diese gut ein Dutzend Kilobyte mit hoher Priorit\u00e4t neben dem LCP-Bild und verderben das Ergebnis auf der anderen Seite. W\u00e4hlen Sie.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Ohne einen Fallback mit angepassten Metriken w\u00e4hlen Sie zwischen FCP und CLS, und die Variante mit <code>font-display: optional<\/code> ist eine Entscheidung des Markeninhabers, keine technische. Denken Sie auch daran, dass automatisch erzeugtes kritisches CSS keine Stile enth\u00e4lt, die JavaScript nachtr\u00e4glich hinzuf\u00fcgt, deshalb wird die H\u00f6henreservierung f\u00fcr Slider von Hand geschrieben.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"TBT_steigt_nach_einer_guten_Aenderung_und_das_ist_kein_Rueckschritt\"><\/span>TBT steigt nach einer guten \u00c4nderung, und das ist kein R\u00fcckschritt<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Die Arbeit von JavaScript ist im Grunde konstant. Solange die Seite langsam lud, lief sie au\u00dferhalb des Messfensters ab. Nach der Beschleunigung r\u00fcckt sie hinein und wird mitgez\u00e4hlt. Ein TBT-Sprung direkt nach der Verk\u00fcrzung von FCP ist ein Signal, dass die \u00c4nderung gewirkt hat, und kein Grund, sie zur\u00fcckzunehmen.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Skripte bis zur ersten Interaktion zu verz\u00f6gern, ist verlockend. Auf jQuery, das Men\u00fc und den Slider angewendet, endet es aber mit einer Navigation, die nicht funktioniert. Das ist ein Umweg, keine Diagnose, und so muss man es dem Kunden auch benennen. Zusammenfassen und Verz\u00f6gern sind dabei gekoppelt: Eine Datei, die nur aus einer Liste ausgeschlossen ist, landet trotzdem im gemeinsamen, verz\u00f6gerten Paket.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Schlie\u00dfen Sie konkrete Dateien aus statt ganzer Verzeichnisse. Der Ausschluss eines Verzeichnisses zieht auch schwere Bibliotheken auf den kritischen Pfad, die dort in Ruhe bleiben sollten. Pr\u00fcfen Sie bei der Gelegenheit, ob das Muster zum tats\u00e4chlichen Namen passt, da die minifizierte Variante einer Bibliothek anders hei\u00dft als die Quellfassung.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Wartung_was_drei_Monate_nach_der_Einfuehrung_kaputtgeht\"><\/span>Wartung: was drei Monate nach der Einf\u00fchrung kaputtgeht<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Alle \u00c4nderungen gehen in das Child-Theme, und Dateiaustausche erledigen wir mit Filtern auf den Handles. Sonst l\u00f6scht die erste Aktualisierung des Templates die Arbeit spurlos. Ausgetauschte Minifikate und Font-Subsets m\u00fcssen nach jeder Aktualisierung neu erzeugt und in der Adresse versioniert werden, denn ein langer Browser-Cache kann eine alte Datei monatelang halten.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Die Warteschlange f\u00fcr die Erzeugung des kritischen CSS ist begrenzt und verstopft bei Mehrsprachigkeit mit \u00dcbersetzungen und technischen Adressen. Die Folge? Ein Teil der Unterseiten bekommt es nie. Das Leeren des Caches l\u00f6scht dabei weder das kritische CSS noch die mobile Variante. Das sind getrennte Mechanismen, und man pr\u00fcft sie getrennt.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Nach jeder \u00c4nderung im Code pr\u00fcfen wir das Login, die Sitemap, den RSS-Feed, die 404-Fehlerseite und die Sprachversionen. Ein \u00c4nderungsprotokoll mit einer Liste der Sackgassen erspart dem n\u00e4chsten Dienstleister die Wiederholung von Tests, die schon einmal zur\u00fcckgenommen wurden. Ohne diese Disziplin f\u00e4llt das Ergebnis von <strong>Core Web Vitals WordPress<\/strong> von allein zur\u00fcck, nach Plugin-Updates und gew\u00f6hnlichen Inhalts\u00e4nderungen.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Zusammenfassung_eine_vernuenftige_Reihenfolge_statt_einer_Plugin-Liste\"><\/span>Zusammenfassung: eine vern\u00fcnftige Reihenfolge statt einer Plugin-Liste<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Messen, den Bericht in der festgelegten Reihenfolge lesen, LCP reparieren, dann die Layoutstabilit\u00e4t und ganz zum Schluss die Belastung des Haupt-Threads. So sieht bei uns die <a href=\"https:\/\/www.web-systems.pl\/de\/schnelle-webseiten\/\">Optimierung der Seitengeschwindigkeit<\/a> in der Praxis aus, und diese Abfolge ergibt sich aus den Abh\u00e4ngigkeiten zwischen den Metriken, nicht aus Vorlieben.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Trennen Sie das Gemessene vom Beurteilten und sagen Sie offen, wann eine Korrektur ein Umweg ist. Das Ergebnis der Mobilmessung streut deutlich, berichten Sie also eine Spanne aus mehreren Durchl\u00e4ufen statt einer einzelnen eindrucksvollen Zahl. Ein Kunde, der diese Streuung versteht, ruft nicht um sieben Uhr morgens wegen zwei Punkten nach unten an.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Wenn Sie ein Performance-Audit, die Modernisierung eines bestehenden Systems, Integrationen, Automatisierung oder die Umsetzung eines MVP brauchen, sprechen Sie uns an. Es lohnt sich, das mit einem <a href=\"https:\/\/www.web-systems.pl\/de\/seo-audits\/\">SEO-Audit der Website<\/a> zu verbinden, denn Geschwindigkeit und Sichtbarkeit in der Suchmaschine ziehen einander mit. Wir sehen uns Ihre Konfiguration gern an und sagen Ihnen, was sich wirklich zu verbessern lohnt.<\/p>\n\n","protected":false},"excerpt":{"rendered":"<p>Die meisten Performance-Projekte, die wir von jemand anderem \u00fcbernehmen, sehen gleich aus. Jemand hat noch ein Cache-Plugin installiert, die Presets durchgeklickt und nach zwei Tagen begonnen, \u00c4nderungen zur\u00fcckzunehmen, weil der Warenkorb oder das Men\u00fc zerfiel. Niemand hat den Ausgangspunkt festgehalten, also l\u00e4sst sich nicht sagen, was geholfen und was geschadet hat. Wir arbeiten seit Jahren [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":29694,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[839],"tags":[1852,1686,1066,1072,1197,1082,1193],"class_list":["post-29746","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-wordpress-de","tag-cache-de","tag-core-web-vitals-de","tag-optimierung","tag-pagespeed-de","tag-performance-de","tag-ratgeber","tag-wordpress-de"],"acf":[],"_links":{"self":[{"href":"https:\/\/www.web-systems.pl\/de\/wp-json\/wp\/v2\/posts\/29746","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.web-systems.pl\/de\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.web-systems.pl\/de\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.web-systems.pl\/de\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.web-systems.pl\/de\/wp-json\/wp\/v2\/comments?post=29746"}],"version-history":[{"count":0,"href":"https:\/\/www.web-systems.pl\/de\/wp-json\/wp\/v2\/posts\/29746\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.web-systems.pl\/de\/wp-json\/wp\/v2\/media\/29694"}],"wp:attachment":[{"href":"https:\/\/www.web-systems.pl\/de\/wp-json\/wp\/v2\/media?parent=29746"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.web-systems.pl\/de\/wp-json\/wp\/v2\/categories?post=29746"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.web-systems.pl\/de\/wp-json\/wp\/v2\/tags?post=29746"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}