{"id":31859,"date":"2020-02-07T07:44:11","date_gmt":"2020-02-07T15:44:11","guid":{"rendered":"https:\/\/kinsta.com\/?p=65587&#038;preview=true&#038;preview_id=65587"},"modified":"2025-04-30T13:04:05","modified_gmt":"2025-04-30T12:04:05","slug":"google-pagespeed-insights","status":"publish","type":"post","link":"https:\/\/kinsta.com\/de\/blog\/google-pagespeed-insights\/","title":{"rendered":"Google PageSpeed Insights: Die Wahrheit \u00fcber die 100\/100 Bewertung"},"content":{"rendered":"<p><a href=\"https:\/\/pagespeed.web.dev\/\">Google PageSpeed Insights<\/a> ist zweifellos ein n\u00fctzliches Tool f\u00fcr Webmaster, Entwickler und Webseiten-Besitzer aller Art. Wir haben jedoch festgestellt, dass viele Menschen stundenlang damit besch\u00e4ftigt sind, ihre Webseiten zu optimieren, um bei diesem Test 100\/100 zu erreichen.<\/p>\n<p>Die Wahrheit ist, dass Google PageSpeed Insights so nicht genutzt werden soll und dass es sich auch nicht lohnt, dieses Ziel zu erreichen. Wenn man sich darauf konzentriert, die Empfehlungen der Plattform umzusetzen, anstatt sich auf die Zahl oben auf der Seite zu konzentrieren, wird man viel mehr Vorteile f\u00fcr seine Webseite schaffen.<\/p>\n<p>Dieser Beitrag ist ein umfassender Leitfaden, um Google PageSpeed Insights zu deinem besten Nutzen zu nutzen. Es wird behandelt, wie Google deine Bewertung verwendet und wie die erhaltenen Empfehlungen integriert werden k\u00f6nnen.<\/p>\n<p>Fangen wir an!<\/p>\n<div><\/div><kinsta-auto-toc heading=\"Table of Contents\" exclude=\"last\" list-style=\"arrow\" selector=\"h2\" count-number=\"-1\"><\/kinsta-auto-toc>\n<h2>Was sind die Google PageSpeed Insights?<\/h2>\n<p><a href=\"https:\/\/pagespeed.web.dev\/\">Google PageSpeed Insights<\/a> ist ein Tool zum Testen der Website-Performance. Du kannst jede beliebige URL eingeben und analysieren lassen.<\/p>\n<figure style=\"width: 1500px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2020\/01\/google-pagespeed-insights-1.png\" alt=\"google pagespeed insights\" width=\"1500\" height=\"718\"><figcaption class=\"wp-caption-text\">Google PageSpeed Insights<\/figcaption><\/figure>\n<p>Google gibt dann eine Gesamtpunktzahl von 100 f\u00fcr die getestete Webseite an, die auf mehreren Best Practices zur Leistungsoptimierung basiert.<\/p>\n<figure style=\"width: 1500px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2020\/01\/pagespeed-insights-score-1.png\" alt=\"Google PageSpeed Insights Score\" width=\"1500\" height=\"830\"><figcaption class=\"wp-caption-text\">Google PageSpeed Insights Score<\/figcaption><\/figure>\n<p>Zusammen mit diesem Ergebnis sieht man auch mehrere Empfehlungen von Google, wie man seine Leistung (und damit auch die PageSpeed Insights-Punktzahl) verbessern kann.<\/p>\n<figure style=\"width: 1500px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2020\/01\/pagespeed-insight-empfehlungen-1.png\" alt=\"Google PageSpeed Insights Empfehlungen\" width=\"1500\" height=\"1197\"><figcaption class=\"wp-caption-text\">Google PageSpeed Insights Empfehlungen<\/figcaption><\/figure>\n<p>Ab 2018 werden die PageSpeed Insights-Punktzahlen \u00fcber <a href=\"https:\/\/developer.chrome.com\/docs\/lighthouse\/overview\/\">Lighthouse<\/a>, Googles Open-Source-Tool zur automatischen Verbesserung der Gesamtqualit\u00e4t von Webseiten, berechnet. Diese Plattform kann alle Arten von Faktoren bewerten, einschlie\u00dflich Leistung, Zug\u00e4nglichkeit, <a href=\"https:\/\/kinsta.com\/de\/blog\/progressive-webanwendungen\/\">progressive Webanwendungen<\/a> und mehr.<\/p>\n<p>Um die umfassende Bewertung deiner Webseite durch Lighthouse zu sehen, kannst du <a href=\"https:\/\/web.dev\/measure\/\">Googles Measure-Too<\/a>l verwenden:<\/p>\n<figure style=\"width: 1500px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2020\/01\/google-measure-1.png\" alt=\"Google Webmasters Measure-Auditing-Tool\" width=\"1500\" height=\"898\"><figcaption class=\"wp-caption-text\">Google Webmasters Measure-Auditing-Tool<\/figcaption><\/figure>\n<p>Zus\u00e4tzlich zur Durchf\u00fchrung eines Leistungsaudits, das dem von Google PageSpeed Insights \u00e4hnelt, bekommt man Bewertungen f\u00fcr Zug\u00e4nglichkeit, bew\u00e4hrte Verfahren und <a href=\"https:\/\/kinsta.com\/de\/blog\/wofur-steht-seo\/\">Suchmaschinenoptimierung (SEO)<\/a>.<\/p>\n<h2>Die Wahrheit \u00fcber das Erreichen von 100\/100 Punkten in Google PageSpeed Insights<\/h2>\n<p>Wie wir zu Beginn dieses Beitrags erw\u00e4hnt haben, sehen wir viele Webseiten-Besitzer und -Entwickler, die davon besessen sind, eine perfekte PageSpeed Insights-Punktzahl zu erreichen. Leider neigen diese Leute dazu, den wichtigeren Aspekt der Testergebnisse zu \u00fcbersehen: die Empfehlungen.<\/p>\n<p>W\u00e4hrend man sicher bestrebt sein sollte, die Ladezeiten seiner Webseite so weit wie m\u00f6glich zu verbessern, ist <strong>eine 100\/100 in Google PageSpeed Insights eigentlich gar nicht so wichtig<\/strong>. F\u00fcr den Anfang ist es nicht einmal der ultimative Test f\u00fcr die Leistung.<\/p>\n<p>Im Gegensatz zu PageSpeed Insights erlaubt dir <a href=\"https:\/\/kinsta.com\/de\/blog\/pingdom-speed-test\/\">Pingdom Tools<\/a>, die Leistung deiner Webseite von verschiedenen Orten aus zu testen:<\/p>\n<figure style=\"width: 1500px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2020\/01\/pingdom-tools-1.png\" alt=\"Pingdom Tools Speed Test Ergebnisse\" width=\"1500\" height=\"913\"><figcaption class=\"wp-caption-text\">Pingdom Tools Speed Test Ergebnisse<\/figcaption><\/figure>\n<p>Du kannst auch Tests auf Plattformen wie <a href=\"https:\/\/kinsta.com\/de\/blog\/gtmetrix-speed-test\/\">GTmetrix<\/a> (das deine Ergebnisse aus PageSpeed Insights und <a href=\"http:\/\/yslow.org\/\">YSlow<\/a> kombiniert) und <a href=\"https:\/\/www.webpagetest.org\/\">WebPageTest<\/a> durchf\u00fchren. Es ist sehr wahrscheinlich, dass die Werte dieser verschiedenen Tools nicht genau \u00fcbereinstimmen, was zeigt, wie willk\u00fcrlich diese Zahlen sein k\u00f6nnen.<\/p>\n<p><strong>Was wirklich z\u00e4hlt, ist die tats\u00e4chliche Geschwindigkeit der Webseite<\/strong>. Um es ins rechte Licht zu r\u00fccken: Wir haben Seiten mit durchschnittlichen Ladezeiten von weniger als 500 Millisekunden (was extrem schnell ist!) gesehen, die keine 100\/100-Punktzahl bei PageSpeed Insights haben.<\/p>\n<p>Der andere Faktor, der den Ansatz zur Geschwindigkeitsoptimierung beeinflussen sollte, ist die <a href=\"https:\/\/blog.teamtreehouse.com\/perceived-performance\">wahrgenommene Leistung<\/a> der Webseite. Deine Besucher interessiert es nicht, wie dein Google PageSpeed Insights-Ergebnis aussieht. Sie wollen nur so schnell wie m\u00f6glich deinen Content sehen.<\/p>\n<p>Der eigentliche Zweck des Testens der Leistung deiner Webseite mit Google PageSpeed Insights besteht nicht darin, eine hohe Punktzahl zu erreichen. Vielmehr geht es darum, problematische Stellen auf deiner Webseite zu finden, so dass du sie optimieren und sowohl deine tats\u00e4chliche als auch deine wahrgenommene Ladezeit verringern kannst.<\/p>\n<h2 id=\"how-google-uses-pagespeed-insights\">Wie Google die PageSpeed Insights nutzt<\/h2>\n<p>Neben der Beeinflussung der User Experience (UX) deiner Webseite <a href=\"https:\/\/kinsta.com\/de\/blog\/tipps-zur-optimierung-der-conversion-rate\/#page-load-speed\">spielt auch die Leistung eine Rolle f\u00fcr die SEO<\/a>. Da PageSpeed Insights von der gr\u00f6\u00dften und beliebtesten Suchmaschine der Welt betrieben wird, liegt es nahe, dass dein Ergebnis einen gewissen Einfluss auf die Platzierung in den Suchmaschinenergebnissen (SERP) haben k\u00f6nnte (zumindest bei Google selbst).<\/p>\n<p>Die Realit\u00e4t ist, dass Google PageSpeed Insights zur Bestimmung der Rankings verwendet &#8211; sozusagen. Die Geschwindigkeit der Webseite ist ein Ranking-Faktor, schlicht und einfach. Dein Testergebnis kann dir eine ziemlich gute Vorstellung davon geben, wo du an dieser Front stehst.<\/p>\n<p>Google ber\u00fccksichtigt jedoch mehr als nur die Zahl im Kreis an der Spitze deiner PageSpeed-Ergebnisse. Wenn du einen 100\/100-Wert erreichst, garantiert dir das noch lange nicht einen Spitzenplatz in den SERPs.<\/p>\n<p><span data-sheets-value=\"{\"1\":2,\"2\":\"[inarticle-cta]\"}\" data-sheets-userformat=\"{\"2\":6659,\"3\":{\"1\":0},\"4\":{\"1\":2,\"2\":16777215},\"12\":0,\"14\":{\"1\":2,\"2\":0},\"15\":\"Roboto, RobotoDraft, Helvetica, Arial, sans-serif\"}\"><\/span><\/p>\n<p>Trotzdem kannst du deine PageSpeed Insights-Ergebnisse bei der Verbesserung deines SEOs einsetzen. Seit 2018 ist beispielsweise die <a href=\"https:\/\/kinsta.com\/de\/blog\/autoptimise-einstellungen\/\">mobile Seitengeschwindigkeit ein Ranking-Faktor<\/a> f\u00fcr Google. Du wirst feststellen, dass dein Leistungstest Daten sowohl f\u00fcr die Desktop- als auch f\u00fcr die mobile Version deiner Webseite liefert:<\/p>\n<figure style=\"width: 1500px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2020\/01\/pagespeed-insights-mobile-1.png\" alt=\"Der Mobile Tab in Google PageSpeed Insights\" width=\"1500\" height=\"830\"><figcaption class=\"wp-caption-text\">Der Mobile Tab in Google PageSpeed Insights<\/figcaption><\/figure>\n<p>Da mehr als <a href=\"https:\/\/neilpatel.com\/blog\/loading-time\/\">73 Prozent der mobilen Internetnutzer angeben<\/a>, dass sie auf eine Webseite gesto\u00dfen sind, deren Laden zu lange dauert, sind die Informationen auf der Registerkarte Google PageSpeed Insights <strong>Mobile<\/strong> von unsch\u00e4tzbarem Wert. Wenn man die Empfehlungen hier nutzt, um <a href=\"https:\/\/kinsta.com\/de\/lernen\/wordpress-beschleunigen\/\">die Ladezeiten auf Smartphones und anderen Ger\u00e4ten zu verringern<\/a>, sollte man einen Wettbewerbsvorteil haben.<\/p>\n<h2>Google PageSpeed Insights Empfehlungen (24 Wege zur Leistungsverbesserung)<\/h2>\n<p>Wir haben in diesem Beitrag viel \u00fcber die Empfehlungen von Google PageSpeed Insights gesprochen. Sie sind der wahre Kern deiner Leistungstestergebnisse und weitaus wertvoller als dein tats\u00e4chliches Ergebnis. Deshalb haben wir ihnen den Rest dieses Postings gewidmet.<\/p>\n<p>Bevor wir jedoch auf die einzelnen Vorschl\u00e4ge eingehen, muss der Unterschied zwischen den <strong>Feld-<\/strong> und <strong>Labordaten<\/strong> verstanden werden. Erstere vergleicht deine Seite mit anderen im Chrome User Experience Report der letzten 30 Tage.<\/p>\n<p>Es gibt auch zwei Diagramme, die zeigen, wo dein durchschnittlicher <a href=\"https:\/\/developer.chrome.com\/docs\/lighthouse\/performance\/first-contentful-paint\/\">First Contentful Paint (FCP)<\/a> und <a href=\"https:\/\/web.dev\/fid\/\">First Input Delay (FID)<\/a> liegt:<\/p>\n<figure style=\"width: 1500px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2020\/01\/felddaten-1.png\" alt=\"Google PageSpeed Insights Felddaten\" width=\"1500\" height=\"565\"><figcaption class=\"wp-caption-text\">Google PageSpeed Insights Felddaten<\/figcaption><\/figure>\n<p>In der obigen Abbildung entspricht der FCP unserer Webseite etwa 45 Prozent der Webseiten im 75. Perzentil und unser FID etwa 9 Prozent des 95.<\/p>\n<p>Die <strong>Labordaten<\/strong> zeigen spezifische Daten f\u00fcr eine simulierte Seitenlast:<\/p>\n<figure style=\"width: 1500px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2020\/01\/labordaten-1.png\" alt=\"Google PageSpeed Insights Labordaten\" width=\"1500\" height=\"465\"><figcaption class=\"wp-caption-text\">Google PageSpeed Insights Labordaten<\/figcaption><\/figure>\n<p>Du wirst feststellen, dass unsere <strong>Felddaten<\/strong> und <strong>Labordaten<\/strong> <a href=\"https:\/\/developers.google.com\/speed\/docs\/insights\/v5\/about#faq\">nicht genau \u00fcbereinstimmen<\/a>. Das ist v\u00f6llig normal. Die <strong>Labordaten<\/strong> werden unter festen Bedingungen erstellt, w\u00e4hrend die <strong>Felddaten<\/strong> die tats\u00e4chlichen Ladegeschwindigkeiten verwenden, die im Laufe der Zeit gesammelt wurden.<\/p>\n<p>In Kombination betrachtet, sollten die <strong>Feld-<\/strong> und <strong>Labordaten<\/strong> eine Vorstellung von den tats\u00e4chlichen Ladezeiten deiner Webseite geben. Wie wir bereits erw\u00e4hnt haben, ist dies sogar noch wichtiger als dein PageSpeed-Gesamtergebnis, daher sollte man auf diese Zahlen achten.<\/p>\n<p>Nachdem du diese Informationen ber\u00fccksichtigt hast, ist es an der Zeit, die Leistung deiner Webseite mit den Empfehlungen von Google PageSpeed zu verbessern.<\/p>\n<div><\/div><kinsta-auto-toc list-style=\"decimal\" selector=\"h3\" count-number=\"24\" sub-toc=\"true\"><\/kinsta-auto-toc>\n<h3>1. Render-Blocking Ressourcen eliminieren<\/h3>\n<p>Eine der h\u00e4ufigeren Empfehlungen von Google PageSpeed Insights ist die <a href=\"https:\/\/kinsta.com\/de\/blog\/render-blocking-javascript-css-eliminieren\/\">Eliminierung von Rendering-blockierenden Ressourcen<\/a>:<\/p>\n<figure style=\"width: 1476px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2020\/01\/empfehlung-render-blocking-resources-1.png\" alt=\"Empfehlung zur Beseitigung von Render-Blocking Ressourcen\" width=\"1476\" height=\"468\"><figcaption class=\"wp-caption-text\">Empfehlung zur Beseitigung von Render-Blocking Ressourcen<\/figcaption><\/figure>\n<p>Damit sind JavaScript- und CSS-Skripte gemeint, die das schnelle Laden deiner Seite verhindern. Der Browser des Besuchers muss diese Dateien erst herunterladen und verarbeiten, bevor er den Rest der Seite anzeigen kann, viele von ihnen &#8222;above the fold&#8220; k\u00f6nnen sich negativ auf die Geschwindigkeit deiner Seite auswirken.<\/p>\n<p>Mehr \u00fcber dieses Problem steht in unserem Leitfaden <a href=\"https:\/\/kinsta.com\/de\/blog\/render-blocking-javascript-css-eliminieren\/\">zur Beseitigung von Render-Blocking-Skripten<\/a>. Was Google betrifft, gibt es zwei L\u00f6sungen, die man in Betracht ziehen sollte:<\/p>\n<ul>\n<li>Wenn du nicht viel JavaScript oder <a href=\"https:\/\/kinsta.com\/de\/blog\/wordpress-css\/\">CSS<\/a> hast, kannst du sie inlinen, um diese Warnung zu beseitigen. Dieser Prozess bezieht sich auf das Einbinden deines JavaScript und\/oder CSS in deine HTML-Datei. Du kannst dies mit einem Plugin wie <a href=\"https:\/\/wordpress.org\/plugins\/autoptimize\/\">Autoptimize<\/a> Dies gilt jedoch nur f\u00fcr sehr kleine Webseiten. Die meisten WordPress-Seiten verf\u00fcgen \u00fcber gen\u00fcgend JavaScript, so dass diese Methode die Seite tats\u00e4chlich verlangsamen k\u00f6nnte.<\/li>\n<li>Die andere M\u00f6glichkeit ist, dein <a href=\"https:\/\/kinsta.com\/de\/blog\/parsen-von-javascript-verzogert\/\">JavaScript aufzuschieben<\/a>. Dieses Attribut l\u00e4dt deine JavaScript-Datei w\u00e4hrend des HTML-Parsings herunter, f\u00fchrt sie aber erst aus, wenn das Parsing abgeschlossen ist. Au\u00dferdem werden Skripte mit diesem Attribut in der Reihenfolge ihres Erscheinens auf der Seite ausgef\u00fchrt.<\/li>\n<\/ul>\n<p>Du findest eine Liste der Ressourcen, die von diesem Problem am meisten betroffen sind, unterhalb der Empfehlung in deinen PageSpeed-Ergebnissen.<\/p>\n<p><strong>In <a href=\"https:\/\/www.youtube.com\/watch?v=ElpcjGBgTGk\">diesem Video<\/a> erf\u00e4hrst du mehr dar\u00fcber, wie du Ressourcen, die das Rendern blockieren, eliminieren kannst:<\/strong><\/p>\n<kinsta-video src=\"https:\/\/www.youtube.com\/watch?v=ElpcjGBgTGk\"><\/kinsta-video>\n<h3>2. Verkettung kritischer Anfragen vermeiden<\/h3>\n<p>Das Konzept <a href=\"https:\/\/developers.google.com\/web\/tools\/lighthouse\/audits\/critical-request-chains\">der Verkettung kritischer Anfragen<\/a> hat mit dem Critical Rendering Path (CRP) zu tun und damit, wie die Browser deine Seiten laden. Bestimmte Elemente &#8211; wie das oben besprochene JavaScript und CSS &#8211; m\u00fcssen vollst\u00e4ndig geladen werden, bevor deine Seite sichtbar wird.<\/p>\n<p>Als Teil dieses Vorschlags zeigt dir Google PageSpeed Insights die Anforderungsketten auf der zu analysierenden Seite an:<\/p>\n<figure style=\"width: 1496px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2020\/01\/verkettung-anfragen-empfehlung-1.png\" alt=\"Verkettung kritischer Anfragen vermeiden Empfehlung\" width=\"1496\" height=\"1302\"><figcaption class=\"wp-caption-text\">Verkettung kritischer Anfragen vermeiden Empfehlung<\/figcaption><\/figure>\n<p>Dieses Diagramm zeigt dir die Reihe von abh\u00e4ngigen Anforderungen, die erf\u00fcllt sein m\u00fcssen, bevor deine Seite sichtbar wird. Es zeigt auch, wie gro\u00df die einzelnen Ressourcen sind. Im Idealfall solltest du die Anzahl der abh\u00e4ngigen Anforderungen sowie deren Gr\u00f6\u00dfe minimieren.<\/p>\n<p>Mehrere Methoden zur Erreichung dieser Ziele werden durch andere Empfehlungen abgedeckt, die in diesem Beitrag besprochen werden, darunter<\/p>\n<ul>\n<li>Eliminierung von Render-Blocking-Ressourcen.<\/li>\n<li>Verschieben von Offscreen-Bildern<\/li>\n<li><a href=\"https:\/\/kinsta.com\/de\/blog\/javascript-minimieren\/\">Minifizieren von JavaScript<\/a> und CSS<\/li>\n<\/ul>\n<p>Zus\u00e4tzlich kann die Reihenfolge, in der die Assets geladen werden, optimiert werden, um den CRP zu verk\u00fcrzen. Dies bedeutet, dass der above the fold hinausgehende Inhalt an den Anfang deiner HTML-Datei verschoben wird. Mehr \u00fcber die Optimierung des CRP gibt es in unserem Beitrag &#8222;<em><a href=\"https:\/\/kinsta.com\/de\/blog\/critical-rendering-path\/\">Wie man den kritischen Rendering-Pfad in WordPress optimiert<\/a><\/em>&#8222;.<\/p>\n<p>Es ist wichtig zu beachten, dass es nicht eine magische Anzahl von kritischen Anfrageketten gibt, an denen man arbeiten muss. Google PageSpeed Insights z\u00e4hlt diese Pr\u00fcfung im Gegensatz zu vielen anderen Empfehlungen nicht als &#8222;bestanden&#8220; oder &#8222;nicht bestanden&#8220;. Diese Informationen werden lediglich zur Verf\u00fcgung gestellt, um die Ladezeiten zu verbessern.<\/p>\n<h3>3. Die Anzahl der Anfragen niedrig halten und die \u00dcbertragungsgr\u00f6\u00dfen klein halten<\/h3>\n<p>Je mehr Anfragen die Browser zum Laden deiner Seiten stellen m\u00fcssen und je gr\u00f6\u00dfer die Ressourcen sind, die dein Server als Antwort zur\u00fcckgibt, desto l\u00e4nger dauert das Laden deiner Webseite. Daher ist es sinnvoll, dass Google dir empfiehlt, die Anzahl der erforderlichen Anfragen zu minimieren und die Gr\u00f6\u00dfe der Ressourcen zu verringern.<\/p>\n<p>Wie die Empfehlung <strong>Vermeidung der Verkettung kritischer Anfragen<\/strong> f\u00fchrt auch diese Empfehlung nicht zu einem &#8222;Pass&#8220; oder &#8222;Fail&#8220;. Stattdessen wird lediglich eine Liste mit der Anzahl und Gr\u00f6\u00dfe der Anfragen angezeigt:<\/p>\n<figure style=\"width: 1500px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2020\/01\/anfragen-anzahl-halte-1.png\" alt=\"Halte die Anzahl der Anfragen niedrig und die Transfergr\u00f6\u00dfen klein\" width=\"1500\" height=\"997\"><figcaption class=\"wp-caption-text\">Halte die Anzahl der Anfragen niedrig und die Transfergr\u00f6\u00dfen klein<\/figcaption><\/figure>\n<p>Es gibt keine ideale Anzahl von Anfragen oder maximale Gr\u00f6\u00dfen, die man beachten muss. Stattdessen empfiehlt Google, dass man diese Standards f\u00fcr sich selbst festlegt, indem man ein Leistungsbudget erstellt. Dabei handelt es sich um eine Reihe von definierten Zielen, die sich auf folgende Aspekte beziehen k\u00f6nnen:<\/p>\n<ul>\n<li>Maximale Bildgr\u00f6\u00dfen<\/li>\n<li>Die Anzahl der verwendeten Web-Schriftarten<\/li>\n<li>Wie viele externe Ressourcen aufgerufen werden<\/li>\n<li>Die Gr\u00f6\u00dfe der Skripte und Frameworks<\/li>\n<\/ul>\n<p>Die Erstellung eines Leistungsbudgets gibt dir eine Reihe von Standards, denen gegen\u00fcber du Rechenschaft ablegen musst. Wenn du dein Budget \u00fcberschreitest, kannst du dann Entscheidungen dar\u00fcber treffen, ob du Ressourcen eliminieren oder optimieren willst, um deine vorgegebenen Richtlinien einzuhalten. <a href=\"https:\/\/web.dev\/your-first-performance-budget\/\">Weitere Informationen<\/a> zur Erstellung eines solchen Budgets gibt es im eigenen Leitfaden von Google.<\/p>\n<h3>4. CSS verkleinern<\/h3>\n<p>CSS-Dateien sind oft gr\u00f6\u00dfer als n\u00f6tig, um sie f\u00fcr Menschen leichter lesbar zu machen. Manchmal enthalten sie verschiedene Zeilenumbr\u00fcche und Leerzeichen, die f\u00fcr den Computer nicht notwendig sind, um ihren Inhalt zu verstehen.<\/p>\n<p>Die Verkleinerung des CSS ist der Prozess der Verdichtung der Dateien durch die Beseitigung unn\u00f6tiger Zeichen, Leerzeichen und Duplikate. Google empfiehlt diese Vorgehensweise, da sie die Gr\u00f6\u00dfe der CSS-Dateien reduziert und somit die Ladegeschwindigkeit verbessern kann:<\/p>\n<figure style=\"width: 1456px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2020\/01\/vverkleinern-css-1.png\" alt=\"CSS verkleinern \" width=\"1456\" height=\"382\"><figcaption class=\"wp-caption-text\">CSS verkleinern<\/figcaption><\/figure>\n<p>Um deine CSS-Dateien zu minimieren, empfehlen wir die Verwendung eines Plugins wie <a href=\"https:\/\/kinsta.com\/de\/blog\/autoptimise-einstellungen\/#css-options\">Autoptimize<\/a> oder <a href=\"https:\/\/wp-rocket.me\/\">WP Rocket<\/a>.<\/p>\n<h3>5. JavaScript verkleinern<\/h3>\n<p>Genauso wie die Gr\u00f6\u00dfe von CSS-Dateien durch die Verkleinerung reduziert werden kann, gilt dies auch f\u00fcr die Gr\u00f6\u00dfe von JavaScript-Dateien:<\/p>\n<figure style=\"width: 1456px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2020\/01\/verkleinern-javascript-empfehlung.png\" alt=\"JavaScript verkleinern Empfehlung\" width=\"1456\" height=\"380\"><figcaption class=\"wp-caption-text\">JavaScript verkleinern Empfehlung<\/figcaption><\/figure>\n<p>Autoptimize oder WP Rocket k\u00f6nnen diese Aufgabe auch f\u00fcr deine WordPress-Seite \u00fcbernehmen.<\/p>\n<h3>6. Ungenutztes CSS entfernen<\/h3>\n<p>Jeder Code in deinem Stylesheet ist Inhalt, der geladen werden muss, damit deine Seite f\u00fcr die Benutzer sichtbar wird. Wenn es auf deiner Webseite CSS gibt, das nicht wirklich n\u00fctzlich ist, belastet es deine Leistung unn\u00f6tig.<\/p>\n<p>Aus diesem Grund empfiehlt Google, <a href=\"https:\/\/developer.chrome.com\/docs\/lighthouse\/performance\/unused-css-rules\/\">alle nicht verwendeten CSS Dateien zu entfernen<\/a>:<\/p>\n<figure style=\"width: 1452px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2020\/01\/entfernen-ungenutztes-css-1.png\" alt=\"Ungenutztes CSS entfernen Empfehlung\" width=\"1452\" height=\"552\"><figcaption class=\"wp-caption-text\">Ungenutztes CSS entfernen Empfehlung<\/figcaption><\/figure>\n<p>Die L\u00f6sung ist hier im Wesentlichen die gleiche wie bei der Beseitigung von Render-Blocking-CSS. Du kannst Stile auf die f\u00fcr deine Seiten sinnvollste Art und Weise einf\u00fcgen oder verschieben. Au\u00dferdem kann man ein Tool wie <a href=\"https:\/\/developer.chrome.com\/docs\/devtools\/\">Chrome DevTools<\/a> verwenden, um <a href=\"https:\/\/developer.chrome.com\/docs\/devtools\/coverage\/\">nicht verwendetes CSS<\/a> zu finden, die optimiert werden m\u00fcssen.<\/p>\n<h3>7. Minimierung der Main-Thread Work<\/h3>\n<p>Der &#8222;Main-Thread&#8220; ist das Hauptelement des Browsers eines Benutzers, das daf\u00fcr verantwortlich ist, den Code in eine Webseite zu verwandeln, mit der Besucher interagieren k\u00f6nnen. Er parst und f\u00fchrt HTML, CSS und JavaScript aus. Au\u00dferdem ist er f\u00fcr die Handhabung von Benutzerinteraktionen zust\u00e4ndig.<\/p>\n<p>Das bedeutet, dass der Haupt-Thread, wenn er den Code deiner Webseite durcharbeitet, nicht auch Benutzeranfragen bearbeiten kann. Wenn die Arbeit des Main-Threads zu lange dauert, kann dies zu schlechter UX und langsamen Seitenladezeiten f\u00fchren.<\/p>\n<p>Google PageSpeed kennzeichnet Seiten, die l\u00e4nger als vier Sekunden ben\u00f6tigen, um die Arbeit des Main-Threads abzuschlie\u00dfen und eine brauchbare Webseite zu pr\u00e4sentieren:<\/p>\n<figure style=\"width: 1452px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2020\/01\/reduzieren-mainthread-work-1.png\" alt=\"Main Thread Work reduzieren Empfehlung\" width=\"1452\" height=\"254\"><figcaption class=\"wp-caption-text\">Main Thread Work reduzieren Empfehlung<\/figcaption><\/figure>\n<p>Einige der Methoden zur Reduzierung der Main-Thread-Work wurden bereits in anderen Abschnitten dieses Beitrags behandelt, darunter auch:<\/p>\n<ul>\n<li>Das Verkleinern deines Codes<\/li>\n<li>Entfernen von unbenutztem Code<\/li>\n<li>Caching implementieren<\/li>\n<\/ul>\n<p>M\u00f6glicherweise sollte jedoch auch eine Codeaufteilung in Betracht gezogen werden. Bei diesem Prozess wird das JavaScript in B\u00fcndel aufgeteilt, die bei Bedarf ausgef\u00fchrt werden, anstatt dass die Browser sie alle laden muss, bevor die Seite interaktiv wird.<\/p>\n<p><a href=\"https:\/\/webpack.js.org\/guides\/code-splitting\/\">Webpack<\/a> wird h\u00e4ufig zur Implementierung von Code-Splitting verwendet. Beachte, dass dies eine ziemlich fortgeschrittene Technik ist, die Anf\u00e4nger normalerweise nicht alleine durchf\u00fchren sollten.<\/p>\n<h3>8. Reduziere die Ausf\u00fchrungszeit von JavaScript<\/h3>\n<p>Die Ausf\u00fchrung von JavaScript ist oft der wichtigste Beitrag zur Arbeit am Main-Thread. PageSpeed Insights hat eine gesonderte Empfehlung, um dich zu warnen, wenn diese Aufgabe einen signifikanten Einfluss auf die Leistung deiner Webseite hat:<\/p>\n<figure style=\"width: 1452px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2020\/01\/reduzierung-javascript-ausfuhrungszeit-1.png\" alt=\"Empfehlung zur Reduzierung der JavaScript-Ausf\u00fchrungszeit\" width=\"1452\" height=\"254\"><figcaption class=\"wp-caption-text\">Empfehlung zur Reduzierung der JavaScript-Ausf\u00fchrungszeit<\/figcaption><\/figure>\n<p>Die oben vorgeschlagenen Methoden zur Reduzierung der Arbeit des Main-Threads sollten auch diese Warnung in deinen PageSpeed-Ergebnissen aufl\u00f6sen.<\/p>\n<h3>9. Server-Antwortzeiten reduzieren (TTFB)<\/h3>\n<p>Die Zeit bis zum ersten Byte (TTFB) ist ein Ma\u00df daf\u00fcr, wie lange es dauert, bis ein Browser nach einer Anfrage das erste Byte Daten vom Server deiner Webseite zur\u00fcckerh\u00e4lt. Dies ist zwar nicht dasselbe wie die Gesamtgeschwindigkeit der Seite, aber ein niedriger TTFB-Wert ist verst\u00e4ndlicherweise gut f\u00fcr die Leistung deiner Seite.<\/p>\n<p>Daher geh\u00f6rt die Reduzierung der Server-Antwortzeiten zu den Empfehlungen von Google PageSpeed Insights. Wenn du in der Lage bist, einen niedrigen TTFB zu erreichen, wird diese Meldung unter <strong>Bestandene Pr\u00fcfungen<\/strong> angezeigt:<\/p>\n<figure style=\"width: 1464px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2020\/01\/gering-ttfb-1.png\" alt=\"Server-Antwortzeiten sind gering\" width=\"1464\" height=\"382\"><figcaption class=\"wp-caption-text\">Server-Antwortzeiten sind gering<\/figcaption><\/figure>\n<p>Es gibt mehrere Faktoren, die den TTFB beeinflussen k\u00f6nnen. Einige Strategien zur Senkung des TTFB sind unter anderem:<\/p>\n<ul>\n<li>W\u00e4hle einen <a href=\"https:\/\/kinsta.com\/de\/preise\/\">hochwertigen Hosting-Anbieter<\/a>, der <a href=\"https:\/\/kinsta.com\/de\/wordpress-hosting\/\">sich auf die Geschwindigkeit konzentriert<\/a><\/li>\n<li>Verwendung von leichtgewichtigen Themes und Plugins<\/li>\n<li>Reduzierung der Anzahl der auf deiner Webseite installierten Plugins<\/li>\n<li>Nutzung eines Content-Delivery-Netzwerks (CDN)<\/li>\n<li>Implementierung von Browser-Caching<\/li>\n<li>Auswahl eines soliden Domain Name System (DNS)-Anbieters<\/li>\n<\/ul>\n<p>Unser <a href=\"https:\/\/kinsta.com\/de\/blog\/ttfb\/\">Beitrag \u00fcber TTFB<\/a> ist eine ausgezeichnete Quelle f\u00fcr weitere Details zur Optimierung in diesem Bereich.<\/p>\n<h3>10. Die richtige Bildgr\u00f6\u00dfe w\u00e4hlen<\/h3>\n<p>Mediendateien wie Bilder k\u00f6nnen die Leistung der Webseite wirklich beeintr\u00e4chtigen. Die richtige Gr\u00f6\u00dfenbestimmung ist eine einfache M\u00f6glichkeit, die Ladezeiten zu reduzieren:<\/p>\n<figure style=\"width: 1458px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2020\/01\/empfehlung-bildgrosse-1.png\" alt=\"Empfehlung f\u00fcr die richtige Bildgr\u00f6\u00dfe\" width=\"1458\" height=\"512\"><figcaption class=\"wp-caption-text\">Empfehlung f\u00fcr die richtige Bildgr\u00f6\u00dfe<\/figcaption><\/figure>\n<p>Wenn deine Seite Bilder enth\u00e4lt, die gr\u00f6\u00dfer als n\u00f6tig sind, wird CSS verwendet, um die Gr\u00f6\u00dfe entsprechend anzupassen. Dies dauert l\u00e4nger, als einfach nur die Bilder in der richtigen Gr\u00f6\u00dfe zu laden, was sich auf die Leistung deiner Seite auswirkt.<\/p>\n<p>Um dies zu beheben, kannst du entweder Bilder in der richtigen Gr\u00f6\u00dfe hochladen oder &#8218;responsive images&#8216; verwenden. Dazu muss man f\u00fcr verschiedene Ger\u00e4te unterschiedlich gro\u00dfe Bilder erstellen.<\/p>\n<p>Dazu eignet sich <a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Learn\/HTML\/Multimedia_and_embedding\/Responsive_images\">das <strong>srcset<\/strong>-Attribut<\/a>, das den <strong>&lt;img&gt;<\/strong>-Tags hinzugef\u00fcgt wird, um alternative Bilddateien in verschiedenen Gr\u00f6\u00dfen anzugeben. Browser k\u00f6nnen diese Liste lesen, bestimmen, welche Option f\u00fcr den aktuellen Bildschirm am besten geeignet ist, und diese Version des Bildes liefern.<\/p>\n<p>Nehmen wir zum Beispiel an, dass du ein Header-Bild hast und es ansprechend gestalten m\u00f6chtest. Du k\u00f6nntest drei Versionen davon mit einer Breite von 800, 480 und 320 Pixeln hochladen. Dann w\u00fcrdest du das <strong>srcset<\/strong>-Attribut wie folgt anwenden:<\/p>\n<pre><code class=\"language-html\">&lt;img srcset=\"header-image-800w.jpg 880w,\n\t\tHeader-image-480w.jpg 480w,\n\t\tHeader-image-320w.jpg 320w\"\n\tsizes=\"(max-width: 320px) 280px,\n\t\t(max-width: 480px) 440px,\n\t\t800px\"\n\tsrc=\"header-image-800w.jpg\"&gt;<\/code><\/pre>\n<p>Das <strong>srcset<\/strong>-Attribut gibt die verschiedenen verf\u00fcgbaren Dateien an, und das <strong>sizes<\/strong>-Attribut teilt den Browsern mit, welche auf der Grundlage der aktuellen Bildschirmgr\u00f6\u00dfe verwendet werden soll.<\/p>\n<h3>11. Offscreen Bilder aufschieben<\/h3>\n<p>Der Prozess des Aufschiebens von Bildern im Offscreen-Bereich wird allgemein als &#8222;lazy loading&#8220; bezeichnet. Das bedeutet, dass der Browser nicht jedes Bild auf einer Seite l\u00e4dt, bevor er den oben genannten Inhalt anzeigt, sondern nur die Bilder, die sofort sichtbar sind.<\/p>\n<p>Weniger Laden, bevor die Seite sichtbar wird, bedeutet eine bessere Leistung, weshalb Google diese Methode empfiehlt:<\/p>\n<figure style=\"width: 1452px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2020\/01\/defer-offscreen-bilder-1.png\" alt=\"Offscreen Bilder aufschieben Empfehlung\" width=\"1452\" height=\"416\"><figcaption class=\"wp-caption-text\">Offscreen Bilder aufschieben Empfehlung<\/figcaption><\/figure>\n<p>Es gibt mehrere WordPress-Plugins, die speziell f\u00fcr das Lazy-Load-Verfahren entwickelt wurden, darunter <a href=\"https:\/\/wordpress.org\/plugins\/a3-lazy-load\/\">a3 Lazy Load<\/a> und <a href=\"https:\/\/wordpress.org\/plugins\/rocket-lazy-load\/\">Lazy Load von WP Rocket<\/a>. Verschiedene Bild- und Leistungsoptimierungs-Plugins wie z.B. <a href=\"https:\/\/kinsta.com\/de\/blog\/autoptimise-einstellungen\/#image-optimization-in-autoptimize\">Autoptimize haben auch Lazy-Loading-Funktionen<\/a>. Schau dir unseren vollst\u00e4ndigen Leitfaden \u00fcber <a href=\"https:\/\/kinsta.com\/de\/blog\/wordpress-lazy-load\/\">Lazy Loading f\u00fcr Bilder und Videos auf WordPress<\/a> an.<\/p>\n<h3>12. Bilder effizient encoden.<\/h3>\n<p>Wie wir bereits in diesem Beitrag erw\u00e4hnt haben, haben Bilder einen erheblichen Einfluss auf die Leistung deiner Webseite. Eines der grundlegendsten Optimierungsverfahren, das du vielleicht in Betracht ziehen sollten, <a href=\"https:\/\/kinsta.com\/de\/blog\/verlustbehaftete-kompression\/\">ist die Komprimierung<\/a>, die dazu beitragen kann, die Dateigr\u00f6\u00dfen zu reduzieren, damit sie schneller geladen werden. Dies ist auch die wichtigste Methode, um Googles Empfehlung zum <strong>effizienten encoding<\/strong> von Bildern zu befolgen:<\/p>\n<figure style=\"width: 1454px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2020\/01\/effizient-encoden-bilder-1.png\" alt=\"Bilder effizient encoden Empfehlung\" width=\"1454\" height=\"336\"><figcaption class=\"wp-caption-text\">Bilder effizient encoden Empfehlung<\/figcaption><\/figure>\n<p>Der Schl\u00fcssel ist das Erreichen der kleinstm\u00f6glichen Dateigr\u00f6\u00dfen, ohne die Qualit\u00e4t der Bilder selbst zu beeintr\u00e4chtigen. Plugins wie <a href=\"https:\/\/wordpress.org\/plugins\/imagify\/\">Imagify<\/a> und <a href=\"https:\/\/wordpress.org\/plugins\/wp-smushit\/\">Smush<\/a> k\u00f6nnen bei dieser Aufgabe helfen. Du kannst mehr \u00fcber sie in unserem <a href=\"https:\/\/kinsta.com\/de\/blog\/optimiert-bilder-fur-web\/\">Leitfaden zur Bildoptimierung<\/a> erfahren.<\/p>\n<p>Weitere Empfehlungen, die Einfluss darauf haben, ob du die Pr\u00fcfung &#8222;<strong>Effiziente Bildkodierung<\/strong>&#8220; bestehst oder nicht, sind<\/p>\n<ul>\n<li>Bilder in der richtigen Gr\u00f6\u00dfe bereitstellen<\/li>\n<li>Implementierung von Lazy Loading (Verschieben von Offscreen-Bildern)<\/li>\n<li>Konvertieren von Bildern in Dateiformate der n\u00e4chsten Generation, wie z.B. WebP<\/li>\n<li>Verwendung von Videoformaten f\u00fcr animierte Inhalte, wie z.B. GIFs<\/li>\n<\/ul>\n<p>Zus\u00e4tzlich zur Komprimierung deiner Bilder kannst du die Schritte zur Erf\u00fcllung dieser Vorschl\u00e4ge befolgen, wie an anderer Stelle in diesem Beitrag beschrieben.<\/p>\n<h3>13. Bild in Formaten der n\u00e4chsten Generation bereitstellen.<\/h3>\n<p>Es gibt einige Bilddateiformate, die schneller geladen werden als andere. Leider handelt es sich dabei nicht um die \u00fcblicherweise verwendeten <strong>PNG-<\/strong> oder <strong>JPEG<\/strong>-Formate. <a href=\"https:\/\/developers.google.com\/speed\/webp\"><strong>WebP<\/strong>-Bilder<\/a> werden zum neuen Standard, und Google PageSpeed wird dich informieren, wenn deine Bilder nicht dem Standard entsprechen:<\/p>\n<figure style=\"width: 1452px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2020\/01\/bildern-nachsten-formaten-1.png\" alt=\"Bereitstellen von Bildern in Formaten der n\u00e4chsten Generation Empfehlung\" width=\"1452\" height=\"368\"><figcaption class=\"wp-caption-text\">Bereitstellen von Bildern in Formaten der n\u00e4chsten Generation Empfehlung<\/figcaption><\/figure>\n<p>Dies mag wie eine schwer zu erf\u00fcllende Empfehlung erscheinen, da du wahrscheinlich bereits viele Bilder auf deiner Seite hast. Gl\u00fccklicherweise gibt es Plugins, die helfen k\u00f6nnen. Zum Beispiel bieten Imagify und Smush beide eine WebP-Konvertierungsfunktion.<\/p>\n<h3>14. Videoformate f\u00fcr animierte Inhalte verwenden<\/h3>\n<p>GIFs k\u00f6nnen eine <a href=\"https:\/\/kinsta.com\/blog\/wordpress-gifs\/\">effektive Form von visuellen Inhalten<\/a> in einer Vielzahl von Situationen sein. Durchf\u00fchrungen von Tutorials, Feature-Rezensionen und sogar humorvolle Animationen k\u00f6nnen die Beitr\u00e4ge aufwerten und sie f\u00fcr die Leser angenehmer und wertvoller machen.<\/p>\n<p>Leider haben diese Vorteile Nachteile f\u00fcr deine Leistung. GIFs sind anspruchsvoll zu laden, weshalb PageSpeed Insights empfiehlt, stattdessen Video-Inhalte anzubieten:<\/p>\n<figure style=\"width: 1452px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2020\/01\/videoformaten-animierten-empfehlung-1.png\" alt=\"Verwendung von Videoformaten f\u00fcr die animierten Inhalte Empfehlung\" width=\"1452\" height=\"434\"><figcaption class=\"wp-caption-text\">Verwendung von Videoformaten f\u00fcr die animierten Inhalte Empfehlung<\/figcaption><\/figure>\n<p>Leider ist die Konvertierung von GIFs in Videoformate nicht der einfachste Prozess. Zuerst muss man sich entscheiden, welche Art von Video man verwenden m\u00f6chte:<\/p>\n<ul>\n<li><strong>MP4<\/strong>: Produziert etwas gr\u00f6\u00dfere Dateien, ist aber mit den <a href=\"https:\/\/kinsta.com\/de\/browser-marktanteil\/\">meisten g\u00e4ngigen Browsern<\/a> kompatibel.<\/li>\n<li><strong>WebM<\/strong>: Das am h\u00f6chsten optimierte Videoformat, obwohl es nur begrenzt mit den meisten Browsern kompatibel ist.<\/li>\n<\/ul>\n<p>Wenn du die Wahl getroffen hast, die f\u00fcr deine Webseite am sinnvollsten ist, musst du die Dateiformate konvertieren. Dies geschieht am besten \u00fcber die Befehlszeile. Installiere zun\u00e4chst <a href=\"https:\/\/www.ffmpeg.org\/\">FFmpeg<\/a>. Dies ist ein Open-Source-Tool zur Konvertierung von Dateiformaten:<\/p>\n<figure style=\"width: 1500px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2020\/01\/ffmpeg-1.png\" alt=\"ffmpeg\" width=\"1500\" height=\"897\"><figcaption class=\"wp-caption-text\">FFmpeg-Dateiformat-Konvertierungswerkzeug f\u00fcr Video und Audio<\/figcaption><\/figure>\n<p>\u00d6ffne dann die Befehlszeilenschnittstelle und f\u00fchre den folgenden Befehl aus:<\/p>\n<pre><code>ffmpeg -i input.gif output.mp4<\/code><\/pre>\n<p>Dadurch wird das GIF mit dem Dateinamen <strong>input.gif<\/strong> in ein MP4-Video mit dem Dateinamen <strong>output.mp4<\/strong> konvertiert. Die \u00c4nderung des Formats ist jedoch nur der Anfang. Du musst nun das resultierende Video so in deine Seite einbetten, dass es wie ein animiertes GIF aussieht.<\/p>\n<h4>Einbetten von Videoinhalten f\u00fcr Animationen<\/h4>\n<p>Wie du wahrscheinlich schon bemerkt hast, wenn du schon einmal ein GIF gesehen hast, unterscheiden sie sich leicht von normalen Videos. Sie werden normalerweise automatisch abgespielt und laufen in einer Schleife, und sie sind immer ohne Ton. Das Einbetten deiner neuen MP4- oder WebM-Datei in deine Seite f\u00fchrt nicht zu diesen Funktionen.<\/p>\n<p>Du <em>kannst<\/em> sie jedoch mit einem sehr einfachen Code neu erstellen. Lade dein Video in deine Medienbibliothek hoch und f\u00fcge dann das Folgende zu der Seite oder dem Beitrag hinzu, in die du dein GIF einbinden m\u00f6chtest:<\/p>\n<pre><code>&lt;video autoplay loop muted playsinline&gt;\n&lt;source src=\"output.mp4\" type=\"video\/mp4\"&gt;\n&lt;\/video&gt;<\/code><\/pre>\n<p>\u00a0<\/p>\n<p>Dadurch werden die angegebenen Attribute auf dein Video angewendet, so dass es mehr &#8222;GIF-\u00e4hnlich&#8220; erscheint. Passe einfach den Dateinamen und -typ an den deiner Ressource an. F\u00fcr weitere Einzelheiten zu diesem Thema empfehlen wir dir, den Google-Leitfaden zur <a href=\"https:\/\/web.dev\/replace-gifs-with-videos\/\">Konvertierung von GIFs in Videos<\/a> zu lesen.<\/p>\n<h3>15. Sicherstellen, dass der Text w\u00e4hrend des Webfontladens sichtbar bleibt<\/h3>\n<p>Wie Bilder sind Schriften in der Regel gro\u00dfe Dateien, die lange zum Laden ben\u00f6tigen. In einigen F\u00e4llen kann es vorkommen, dass Browser den Text ausblenden, bis die von dir verwendete Schriftart vollst\u00e4ndig geladen ist, was zu dieser Empfehlung von Google PageSpeed Insights f\u00fchrt:<\/p>\n<figure style=\"width: 1458px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2020\/01\/text-visible-webfont-load-1.png\" alt=\"Sicherstellen, dass der Text w\u00e4hrend dem Laden von Webfonts sichtbar bleibt Empfehlung\" width=\"1458\" height=\"244\"><figcaption class=\"wp-caption-text\">Sicherstellen, dass der Text w\u00e4hrend dem Laden von Webfonts sichtbar bleibt Empfehlung<\/figcaption><\/figure>\n<p><a href=\"https:\/\/developer.chrome.com\/docs\/lighthouse\/performance\/font-display\/\">Google r\u00e4t<\/a> dazu, dieses Problem zu l\u00f6sen, indem man die Font Display API <strong>Swap<\/strong>-Direktive in deinen <strong>@font-face<\/strong>-Stil anwendet. Greife dazu auf dein Stylesheet (<strong>style.css<\/strong>) zu und f\u00fcge Folgendes nach dem <strong>src<\/strong>-Attribut unter <strong>@font-face<\/strong> hinzu:<\/p>\n<p><code>font-display: swap<\/code><\/p>\n<p>Mehr \u00fcber die Optimierung von Web-Schriften kann man in unserem Beitrag &#8222;<em><a href=\"https:\/\/kinsta.com\/de\/blog\/wie-man-fonts-in-wordpress-aendert\/#optimizing-fonts-for-performance\">Wie man Schriftarten in WordPress \u00e4ndert<\/a><\/em>&#8220; und unserem <a href=\"https:\/\/kinsta.com\/de\/blog\/lokaler-schriftarten\/\">ausf\u00fchrlichen Leitfaden zum Hosting lokaler Schriften<\/a> erfahren.<\/p>\n<h3>16. Textkomprimierung aktivieren<\/h3>\n<p>Die Empfehlung von Google PageSpeed Insights &#8222;<strong>Textkomprimierung aktivieren<\/strong>&#8220; bezieht sich auf die Verwendung der GZIP-Komprimierung:<\/p>\n<figure style=\"width: 1456px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2020\/01\/empfehlung-textkomprimierung-1.png\" alt=\"Textkomprimierung aktivieren Empfehlung\" width=\"1456\" height=\"376\"><figcaption class=\"wp-caption-text\">Textkomprimierung aktivieren Empfehlung<\/figcaption><\/figure>\n<p>In einigen F\u00e4llen (wie du in der obigen Abbildung sehen kannst) wird die Textkompression auf deinem Server automatisch aktiviert. Wenn dies f\u00fcr deine Seite nicht der Fall ist, hast du einige M\u00f6glichkeiten, dieser Empfehlung zu folgen.<\/p>\n<p>Die erste ist die Installation eines Plugins mit einer GZIP-Komprimierungsfunktion. WP Rocket ist eine praktikable L\u00f6sung, wenn du bereit bist, daf\u00fcr zu bezahlen.<\/p>\n<p>Du kannst deinen Text auch manuell komprimieren. Dazu musst du deine <a href=\"https:\/\/kinsta.com\/de\/blog\/wordpress-htaccess-datei\/\"><strong>.htaccess<\/strong>-Datei<\/a> editieren, was riskant sein kann, also stell sicher, dass du eine aktuelle Sicherungskopie zur Hand hast.<\/p>\n<p>Die meisten WordPress-Seiten laufen auf Apache-Servern. Der Code zum <a href=\"https:\/\/kinsta.com\/de\/blog\/gzip-komprimierung-aktivieren\/\">Aktivieren der GZIP-Komprimierung<\/a> sieht folgenderma\u00dfen aus:<\/p>\n<pre><code class=\"apacheconf\">\n  # Compress HTML, CSS, JavaScript, Text, XML and fonts\n  AddOutputFilterByType DEFLATE application\/javascript\n  AddOutputFilterByType DEFLATE application\/rss+xml\n  AddOutputFilterByType DEFLATE application\/vnd.ms-fontobject\n  AddOutputFilterByType DEFLATE application\/x-font\n  AddOutputFilterByType DEFLATE application\/x-font-opentype\n  AddOutputFilterByType DEFLATE application\/x-font-otf\n  AddOutputFilterByType DEFLATE application\/x-font-truetype\n  AddOutputFilterByType DEFLATE application\/x-font-ttf\n  AddOutputFilterByType DEFLATE application\/x-javascript\n  AddOutputFilterByType DEFLATE application\/xhtml+xml\n  AddOutputFilterByType DEFLATE application\/xml\n  AddOutputFilterByType DEFLATE font\/opentype\n  AddOutputFilterByType DEFLATE font\/otf\n  AddOutputFilterByType DEFLATE font\/ttf\n  AddOutputFilterByType DEFLATE image\/svg+xml\n  AddOutputFilterByType DEFLATE image\/x-icon\n  AddOutputFilterByType DEFLATE text\/css\n  AddOutputFilterByType DEFLATE text\/html\n  AddOutputFilterByType DEFLATE text\/javascript\n  AddOutputFilterByType DEFLATE text\/plain\n  AddOutputFilterByType DEFLATE text\/xml\n\n  # Remove browser bugs (only needed for really old browsers)\n  BrowserMatch ^Mozilla\/4 gzip-only-text\/html\n  BrowserMatch ^Mozilla\/4\\.0[678] no-gzip\n  BrowserMatch \\bMSIE !no-gzip !gzip-only-text\/html\n  Header append Vary User-Agent\n<\/code><\/pre>\n<p>Du solltest sie nach <strong>#END<\/strong> in deiner <strong>.htaccess<\/strong>-Datei hinzuf\u00fcgen. Wenn du deine WordPress-Seite auf einem Nginx-Server hast, solltest du stattdessen den folgenden Code zu deiner <strong>nginx.conf<\/strong>-Datei hinzuf\u00fcgen:<\/p>\n<pre><code class=\"nginx\">36 gzip on;\n37 gzip_disable \"MSIE [1-6]\\.(?!.*SV1)\";\n38 gzip_vary on;\n39 gzip_types text\/plain text\/css text\/javascript application\/javascript application\/x-javascript;<\/code><\/pre>\n<p>Wenn du die Textkomprimierung deiner Webseite \u00fcberpr\u00fcfen m\u00f6chtest, empfehlen wir dir die Verwendung eines Tools wie <a href=\"https:\/\/www.giftofspeed.com\/gzip-test\/\">GiftOfSpeed<\/a>:<\/p>\n<figure style=\"width: 1500px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2020\/01\/giftofspeed-komprimierungsprufung-1.png\" alt=\"giftofspeed Komprimierungspr\u00fcfung\" width=\"1500\" height=\"884\"><figcaption class=\"wp-caption-text\">GiftOfSpeed GZIP-Komprimierungspr\u00fcfung<\/figcaption><\/figure>\n<p>Auf diese Weise erf\u00e4hrt man, ob die GZIP-Komprimierung erfolgreich implementiert wurde, auf welchem Servertyp deine Webseite l\u00e4uft und einige andere wichtige Details.<\/p>\n<h3>17. Vorabverbindung zu erforderlichen Quellen<\/h3>\n<p>Die Chancen sind hoch, dass du wahrscheinlich mindestens eine Drittpartei-Ressource auf deiner Webseite hast &#8211; Google Analytics ist ein g\u00e4ngiges Beispiel. Es kann einige Zeit dauern, bis die Browser eine Verbindung zu diesen Ressourcen herstellen, wodurch sich deine Ladegeschwindigkeit verlangsamt.<\/p>\n<p>Durch die Verwendung von <strong>Preconnect<\/strong>-Attributen k\u00f6nnen die Browser sofort erkennen, dass sich auf deiner Seite Skripte von Drittanbietern befinden, die geladen werden m\u00fcssen. Der Prozess der Anforderung dieser Skripte kann dann so schnell wie m\u00f6glich eingeleitet werden, was die Leistung verbessert.<\/p>\n<p>Wenn Google der Meinung ist, dass deine Seite von dieser Technik profitieren k\u00f6nnte, siehst du den Vorschlag <strong>Preconnect to required origins<\/strong>:<\/p>\n<figure style=\"width: 1454px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2020\/01\/empfehlung-quellen-erforderlichen-1.png\" alt=\"Empfehlung f\u00fcr die Vorabverbindung zu den erforderlichen Quellen\" width=\"1454\" height=\"254\"><figcaption class=\"wp-caption-text\">Empfehlung f\u00fcr die Vorabverbindung zu den erforderlichen Quellen<\/figcaption><\/figure>\n<p>Es gibt einige M\u00f6glichkeiten, diese Optimierungsstrategie zu implementieren. Wenn du mit der Bearbeitung deiner WordPress-Theme-Dateien vertraut bist, kannst du einen Link-Tag zu deiner <strong>header.php<\/strong>-Datei hinzuf\u00fcgen. Hier ist ein Beispiel:<\/p>\n<pre><code class=\"language-html\">&lt;link rel=\u201cpreconnect\u201d href=\u201cexample.com\u201d&gt;<\/code><\/pre>\n<p>In diesem Fall teilt das Tag den Browsern mit, dass sie so schnell wie m\u00f6glich eine Verbindung zu <strong>example.com<\/strong> herstellen m\u00fcssen. Google PageSpeed Insights listet alle relevanten Ressourcen auf, f\u00fcr die man Linktags mit Preconnect-Attributen hinzuf\u00fcgen sollte.<\/p>\n<p>Die andere M\u00f6glichkeit ist die Verwendung eines Plugins, um den gleichen Effekt zu erzielen. <a href=\"https:\/\/perfmatters.io\/\">Perfmatters<\/a> enth\u00e4lt eine Preconnect-Funktion (Haftungsausschluss: Ich bin einer der Gr\u00fcnder von Perfmatters). WP Rocket und <a href=\"https:\/\/wordpress.org\/plugins\/pre-party-browser-hints\/\">Pre* Party Resource Hints<\/a> enthalten eine \u00e4hnliche Funktionalit\u00e4t.<\/p>\n<h3>18. Vorladen von Key Requests<\/h3>\n<p>\u00c4hnlich wie bei der Empfehlung <strong>Preconnect to required origins<\/strong> hilft dir die Befolgung dieses Vorschlags, die Anzahl der Anfragen, die Browser an den Server deiner Webseite stellen m\u00fcssen, zu minimieren. Anstatt sich mit Ressourcen von Drittanbietern zu verbinden, bezieht sich <strong>Preload key requests<\/strong> jedoch auf das Laden kritischer Assets auf deinem eigenen Server:<\/p>\n<figure style=\"width: 1446px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2020\/01\/preload-empfehlung-requests-1.png\" alt=\"Preload Key Requests Empfehlung\" width=\"1446\" height=\"250\"><figcaption class=\"wp-caption-text\">Preload Key Requests Empfehlung<\/figcaption><\/figure>\n<p>Auch die Umsetzung dieser Technik ist der vorherigen Empfehlung sehr \u00e4hnlich. Die Datei <strong>header.php<\/strong> kann mit Link-Tags versehen werden, die die in PageSpeed Insights aufgef\u00fchrten Ressourcen angeben:<\/p>\n<pre><code class=\"language-html\">&lt;link rel=\u201cpreload\u201d href=\u201cexample.com\u201d&gt;<\/code><\/pre>\n<p>Du kannst diesen Tag auch mit Hilfe von Perfmatters, WP Rocket oder Pre* Party Resource Hints einbauen.<\/p>\n<h3>19. Vermeide mehrere Seiten Weiterleitungen<\/h3>\n<p>Weiterleitungen werden verwendet, wenn eine URL auf eine andere zeigen soll. Sie werden h\u00e4ufig verwendet, wenn man eine Seite auf der Webseite verschiebt oder l\u00f6scht. Es ist zwar nichts gegen die Verwendung von Weiterleitungen im Allgemeinen einzuwenden, aber sie f\u00fchren zu zus\u00e4tzlichen Verz\u00f6gerungen bei der Ladezeit.<\/p>\n<p>Wenn du <a href=\"https:\/\/kinsta.com\/de\/blog\/err_too_many_redirects\/\">zu viele Weiterleitungen<\/a> auf deiner Webseite hast, wird dir diese Empfehlung m\u00f6glicherweise in Google PageSpeed Insights angezeigt:<\/p>\n<figure style=\"width: 1460px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2020\/01\/mehrere-weiterleitungen-1.png\" alt=\"Vermeide mehrere Seiten Weiterleitungen Empfehlung\" width=\"1460\" height=\"204\"><figcaption class=\"wp-caption-text\">Vermeide mehrere Seiten Weiterleitungen Empfehlung<\/figcaption><\/figure>\n<p>Das Einzige, was du als Antwort auf diese Empfehlung tun kannst, ist sicherzustellen, dass du nur dann Weiterleitungen verwendest, wenn es unbedingt notwendig ist. Mehr \u00fcber den Prozess der Erstellung dieser Weiterleitungen erf\u00e4hrt man in unserem Beitrag &#8222;<em><a href=\"https:\/\/kinsta.com\/de\/blog\/wordpress-weiterleitungen\/\">WordPress Weiterleitung &#8211; Bew\u00e4hrte Methoden f\u00fcr eine bessere Leistung<\/a><\/em>&#8222;.<\/p>\n<h3>20. Statische Assets mit einer effizienten Cache-Regelung bereitstellen<\/h3>\n<p>Wenn du Google PageSpeed Insights schon eine Weile benutzt, kennst du diese Empfehlung vielleicht besser als die Warnung &#8222;<strong>Leverage browser caching<\/strong>&#8222;. In Version 5 ist sie jetzt als &#8222;<strong>Statische Assets mit einer effizienten Cache-Regelung bereitstellen<\/strong>&#8220; gekennzeichnet:<\/p>\n<figure style=\"width: 1452px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2020\/01\/effizienten-cache-policies-1.png\" alt=\"Bereitstellung von statischen Assets mit einer effizienten Cache-Regelung Empfehlung\" width=\"1452\" height=\"338\"><figcaption class=\"wp-caption-text\">Bereitstellung von statischen Assets mit einer effizienten Cache-Regelung Empfehlung<\/figcaption><\/figure>\n<p>Dieser Vorschlag hat einige Schichten, die wir durcharbeiten m\u00fcssen. Die erste ist, was &#8222;Caching&#8220; bedeutet. Kurz gesagt, es ist ein Prozess, bei dem die Browser Kopien deiner Seiten speichern, damit sie bei zuk\u00fcnftigen Besuchen schneller geladen werden k\u00f6nnen.<\/p>\n<p>Die h\u00e4ufigste Art und Weise, wie WordPress-Seiten das Caching implementieren, <a href=\"https:\/\/kinsta.com\/de\/blog\/wordpress-caching-plugins\/\">sind Plugins<\/a>. WP Rocket und <a href=\"https:\/\/kinsta.com\/de\/blog\/w3-total-cache\/\">W3 Total Cache<\/a> sind beliebte Optionen.<\/p>\n<p>Einige Hosting-Anbieter \u2013 <a href=\"https:\/\/kinsta.com\/de\/blog\/wordpress-cache\/\">darunter auch wir hier bei Kinsta<\/a> \u2013 erm\u00f6glichen jedoch das Caching \u00fcber ihre Server. Tats\u00e4chlich k\u00f6nnen alle unsere Kunden kostenlos <a href=\"https:\/\/kinsta.com\/de\/blog\/edge-caching\/\">Edge Caching<\/a> aktivieren, eine Funktion, die die Zeit f\u00fcr die Bereitstellung des HTML-Codes deiner Websites an die Besucher um durchschnittlich \u00fcber 50 % reduziert.<\/p>\n<p>Vergewissere dich, dass dies bei deinem Host der Fall ist, bevor du ein Caching-Plugin installierst.<\/p>\n<p><span data-sheets-value=\"{\"1\":2,\"2\":\"[inarticle-cta]\"}\" data-sheets-userformat=\"{\"2\":6659,\"3\":{\"1\":0},\"4\":{\"1\":2,\"2\":16777215},\"12\":0,\"14\":{\"1\":2,\"2\":0},\"15\":\"Roboto, RobotoDraft, Helvetica, Arial, sans-serif\"}\"><\/span><\/p>\n<p>Sobald du das Caching f\u00fcr deine Webseite aktiviert hast, kannst du dich um den zweiten Teil dieser Empfehlung k\u00fcmmern, n\u00e4mlich um die &#8222;Effizienz&#8220; deiner Cache-Regeln. Die Browser l\u00f6schen ihre Caches regelm\u00e4\u00dfig, um sie mit aktualisierten Kopien zu aktualisieren.<\/p>\n<p>Im Idealfall willst du, dass dieser Zeitraum eher h\u00f6her als niedriger ist. Wenn du deine Webseite alle paar Stunden aus den Browser-Caches l\u00f6scht, wird der Zweck dieser Technik von vornherein verfehlt. Du kannst deine Cache-Verfallszeit mit <strong>Cache-Control<\/strong> und <strong>Expires<\/strong>-Headern optimieren.<\/p>\n<h4>Cache-Control Header hinzuf\u00fcgen<\/h4>\n<p>Verwende den folgenden Code, um Cache-Control-Header in Nginx hinzuzuf\u00fcgen:<\/p>\n<pre><code class=\"nginx\">location ~* \\.(js|css|png|jpg|jpeg|gif|svg|ico)$ {\n expires 30d;\n add_header Cache-Control \"public, no-transform\";\n}<\/code><\/pre>\n<p>Du solltest dies in die Konfigurationsdatei deines Servers aufnehmen. Im obigen Beispiel sind die angegebenen Dateitypen so eingestellt, dass sie nach 30 Tagen ablaufen.<\/p>\n<p>Diejenigen mit <a href=\"https:\/\/kinsta.com\/de\/blog\/was-ist-apache-web-server\/\">Apache-Servern<\/a> sollten dieses Snippet stattdessen in ihren <strong>.htaccess<\/strong>-Dateien verwenden:<\/p>\n<pre><code class=\"apacheconf\">&lt;filesMatch \".(ico|pdf|flv|jpg|jpeg|png|gif|svg|js|css|swf)$\"&gt;\nHeader set Cache-Control \"max-age=84600, public\"\n<\/code><\/pre>\n<p>F\u00fcge diesen Code vor<strong> #BEGIN WordPress<\/strong> oder nach<strong> #END WordPress <\/strong>ein. In diesem Beispiel ist die Cache-Verfallszeit auf 84.600 Sekunden festgelegt.<\/p>\n<h4>Expires Header hinzuf\u00fcgen<\/h4>\n<p><strong>Cache-Control<\/strong>-Header sind jetzt so ziemlich der Standard. Es gibt jedoch einige Tools (einschlie\u00dflich GTMetrix), die immer noch nach <strong>Expires<\/strong>-Headern suchen.<\/p>\n<p>Du kannst <a href=\"https:\/\/kinsta.com\/de\/blog\/expires-header-wordpress\/\">expires-Header<\/a> zu einem Nginx-Server hinzuf\u00fcgen, indem du Folgendes in deinen Serverblock einbaust:<\/p>\n<pre><code class=\"nginx\">location ~*  \\.(jpg|jpeg|gif|png|svg)$ {\n        expires 365d;\n    }\n\n    location ~*  \\.(pdf|css|html|js|swf)$ {\n        expires 2d;\n    }<\/code><\/pre>\n<p>Du solltest unterschiedliche Ablaufzeiten basierend auf den Dateitypen festlegen. Apache-Server werden die gleichen Ergebnisse erzielen, wenn du diesen Code zu deiner <strong>.htaccess<\/strong>-Datei hinzuf\u00fcgst:<\/p>\n<pre><code class=\"apacheconf\">## EXPIRES HEADER CACHING ##\n\nExpiresActive On\nExpiresByType image\/jpg \"access 1 year\"\nExpiresByType image\/jpeg \"access 1 year\"\nExpiresByType image\/gif \"access 1 year\"\nExpiresByType image\/png \"access 1 year\"\nExpiresByType image\/svg \"access 1 year\"\nExpiresByType text\/css \"access 1 month\"\nExpiresByType application\/pdf \"access 1 month\"\nExpiresByType application\/javascript \"access 1 month\"\nExpiresByType application\/x-javascript \"access 1 month\"\nExpiresByType application\/x-shockwave-flash \"access 1 month\"\nExpiresByType image\/x-icon \"access 1 year\"\nExpiresDefault \"access 2 days\"\n\n## EXPIRES HEADER CACHING ##<\/code><\/pre>\n<p>Noch einmal: Du solltest diesen Code entweder vor <strong>#BEGIN WordPress<\/strong> oder nach <strong>#END WordPress<\/strong> hinzuf\u00fcgen.<\/p>\n<h4>Google Analytics effizient cachen<\/h4>\n<p>Ironischerweise hat <a href=\"https:\/\/kinsta.com\/de\/blog\/google-analytics-wordpress\/\">das Google Analytics-Skript, das du m\u00f6glicherweise in den Header deiner Seiten<\/a> eingef\u00fcgt hast, um das Nutzerverhalten zu verfolgen, eine Cache-Verfallszeit von nur zwei Stunden. Dies ist wahrscheinlich, damit die Nutzer bei Aktualisierungen der Plattform schnell auf die \u00c4nderungen zugreifen k\u00f6nnen.<\/p>\n<p>Dieses Skript erscheint in der Liste der Ressourcen, die deine Aufmerksamkeit erfordern, unter <strong>Statische Assets mit einer effizienten Cache-Regelung-bedienen Empfehlung<\/strong>. Da es einer dritten Partei geh\u00f6rt, l\u00e4sst sich die Ablauffrist nicht mit <strong>Cache-Control<\/strong> oder <strong>Expires<\/strong>-Header \u00e4ndern.<\/p>\n<p>Wenn dies das einzige Skript ist, das unter dieser Empfehlung aufgef\u00fchrt ist, kannst du die Pr\u00fcfung trotzdem bestehen:<\/p>\n<figure style=\"width: 1466px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2020\/01\/prufung-effizienten-caching-1.png\" alt=\"Pr\u00fcfung der effizienten Cache-Regelung bestanden\" width=\"1466\" height=\"544\"><figcaption class=\"wp-caption-text\">Pr\u00fcfung der effizienten Cache-Regelung bestanden<\/figcaption><\/figure>\n<p>Wie wir jedoch in diesem Beitrag festgestellt haben, ist dein PageSpeed-Ergebnis weniger wichtig als deine tats\u00e4chliche und wahrgenommene Leistung. Um diese Ressource effizient zu nutzen, wird empfohlen, Google Analytics lokal zu hosten.<\/p>\n<p>Plugins wie <a href=\"https:\/\/wordpress.org\/plugins\/host-analyticsjs-local\/\">Complete Analytics Optimization Suite (CAOS)<\/a> und Perfmatters erm\u00f6glichen dies. Du kannst mehr \u00fcber den Prozess in unserer <a href=\"https:\/\/kinsta.com\/de\/blog\/leverage-browser-caching\/\">vollst\u00e4ndigen Anleitung zu diesem PageSpeed-Vorschlag lesen.<\/a><\/p>\n<h3>21. Reduzieren die Auswirkungen von Drittanbieter Code<\/h3>\n<p>Wir haben jetzt einige verschiedene M\u00f6glichkeiten erw\u00e4hnt, wie sich Skripte von Drittanbietern negativ auf deine Leistung auswirken und zu fehlgeschlagenen Pr\u00fcfungen von PageSpeed Insights f\u00fchren k\u00f6nnen. Im Idealfall ist es am besten, die Abh\u00e4ngigkeit von diesen Tools zu begrenzen, um negative Auswirkungen zu verhindern.<\/p>\n<p>In einigen F\u00e4llen ist es jedoch die beste L\u00f6sung f\u00fcr einen Bedarf deiner Webseite, ein Skript eines Drittanbieters einzubinden. Google Analytics ist ein hervorragendes Beispiel. Andere umfassen:<\/p>\n<ul>\n<li><a href=\"https:\/\/kinsta.com\/de\/blog\/wordpress-social-media-plugins\/\">Buttons und Feeds f\u00fcr Social Media<\/a><\/li>\n<li>YouTube-Video-Einbettungen<\/li>\n<li><a href=\"https:\/\/kinsta.com\/de\/blog\/wordpress-iframe\/\">iFrames f\u00fcr Anzeigen und andere Inhalte<\/a><\/li>\n<li>Bibliotheken f\u00fcr JavaScript, Schriftarten und andere Elemente<\/li>\n<\/ul>\n<p>In F\u00e4llen, in denen du die Verwendung eines Skripts eines Drittanbieters f\u00fcr notwendig erachtest, ist es wichtig, die Auswirkungen auf die Leistung deiner Webseite trotzdem zu reduzieren, wie dir die Ergebnisse deiner PageSpeed-Analyse zeigen werden:<\/p>\n<figure style=\"width: 1468px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2020\/01\/empfehlung-drittanbieter-code-1.png\" alt=\"Die Auswirkungen von Drittanbieter Code verringern Empfehlung\" width=\"1468\" height=\"348\"><figcaption class=\"wp-caption-text\">Die Auswirkungen von Drittanbieter Code verringern Empfehlung<\/figcaption><\/figure>\n<p>Um den Code von Drittanbietern effizienter zu laden, kannst du eine der Techniken in Betracht ziehen, die wir bereits in diesem Beitrag erw\u00e4hnt haben:<\/p>\n<ul>\n<li>Das Laden von JavaScript aufschieben<\/li>\n<li>Verwende Link-Tags mit <strong>Preconnect<\/strong>-Attributen<\/li>\n<li>Skripte von Drittanbietern, die selbst gehostet werden (wie wir oben mit Google Analytics beschrieben haben)<\/li>\n<\/ul>\n<p>Diese Methoden sollten die Auswirkungen auf die Leistung deiner Webseite minimieren.<\/p>\n<h3>22. Enorme Netzwerknutzlasten vermeiden<\/h3>\n<p>Diese Empfehlung ist besonders f\u00fcr deine mobilen Besucher relevant. Gro\u00dfe Nutzlasten k\u00f6nnen die Verwendung von mehr Mobilfunkdaten erfordern, was deine Benutzer Geld kostet. Die Minimierung der Anzahl der Netzwerkanfragen, die erforderlich sind, um deine Seiten zu erreichen, kann dies verhindern:<\/p>\n<figure style=\"width: 1452px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2020\/01\/empfehlung-enormous-vermeidung-1.png\" alt=\"Empfehlung zur Vermeidung von enormen Netzwerknutzlasten\" width=\"1452\" height=\"420\"><figcaption class=\"wp-caption-text\">Empfehlung zur Vermeidung von enormen Netzwerknutzlasten<\/figcaption><\/figure>\n<p>Google empfiehlt, die Gesamtgr\u00f6\u00dfe der Bytes auf 1.600 KB oder weniger zu beschr\u00e4nken. Die am h\u00e4ufigsten verwendeten Methoden zur Erreichung dieses Ziels findest du in diesem Beitrag, einschlie\u00dflich:<\/p>\n<ul>\n<li>Verschieben von CSS, JavaScript und Bildern, die sich above the fold befinden<\/li>\n<li>Code verkleinern<\/li>\n<li>Komprimieren von Bilddateien<\/li>\n<li>Verwendung des WebP-Formats f\u00fcr Bilder<\/li>\n<li>Caching implementieren<\/li>\n<\/ul>\n<p>Befolge die entsprechenden Schritte f\u00fcr diese Strategien, und du solltest diese Pr\u00fcfung ohne zus\u00e4tzlichen Aufwand bestehen.<\/p>\n<h3>23. Benutzer-Timing-Markierungen und Messungen<\/h3>\n<p>Diese Empfehlung ist nur dann relevant, wenn du die <a href=\"https:\/\/developer.chrome.com\/docs\/lighthouse\/performance\/user-timings\/\">User-Timing-API<\/a> verwendest. Dieses Tool erstellt Zeitstempel, die dir helfen, die Leistung deines JavaScript zu bewerten. Wenn du die API f\u00fcr deine Webseite eingerichtet hast, siehst du deine Markierungen und Ma\u00dfe unter dieser \u00dcberschrift in PageSpeed Insights:<\/p>\n<figure style=\"width: 1500px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2020\/01\/benutzer-timing-1.png\" alt=\"Benutzer-Timing\" width=\"1500\" height=\"727\"><figcaption class=\"wp-caption-text\">Benutzer-Timing-Markierungen und Messungen Empfehlung<\/figcaption><\/figure>\n<p>Wie man sehen kann, ist dies ein weiterer Vorschlag von Google, der nicht zu einem &#8218;pass&#8216; oder &#8218;fail&#8216; f\u00fchrt. PageSpeed Insights macht diese Informationen einfach abrufbar, so dass du sie zur Bewertung von Bereichen verwenden kannst, die m\u00f6glicherweise optimiert werden m\u00fcssen.<\/p>\n<p>Wenn du daran interessiert bist, die User Timing API in deine WordPress-Seite zu integrieren, kannst du im <a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/API\/User_Timing_API\/Using_the_User_Timing_API\">Mozilla-Leitfaden<\/a> zu diesem Thema mehr erfahren.<\/p>\n<h3>24. Vermeide eine \u00fcberm\u00e4\u00dfige Gr\u00f6\u00dfe des Dokumentobjektmodells (DOM)<\/h3>\n<p>Vereinfacht ausgedr\u00fcckt, ist das DOM die Art und Weise, wie Browser HTML in Objekte verwandeln. Dabei wird eine Baumstruktur verwendet, die aus einzelnen Knoten besteht, die jeweils ein Objekt repr\u00e4sentieren. Je gr\u00f6\u00dfer das DOM deiner Seite ist, desto l\u00e4nger dauert es nat\u00fcrlich, bis es geladen wird.<\/p>\n<p>Wenn deine Seite bestimmte <a href=\"https:\/\/developer.chrome.com\/docs\/lighthouse\/performance\/dom-size\/\">Standards bez\u00fcglich der DOM-Gr\u00f6\u00dfe<\/a> \u00fcberschreitet, empfiehlt es sich, die Anzahl der Knoten sowie die <a href=\"https:\/\/web.dev\/reduce-the-scope-and-complexity-of-style-calculations\/\">Komplexit\u00e4t deines CSS-Stylings zu reduzieren<\/a>:<\/p>\n<figure style=\"width: 1458px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2020\/01\/vermeide-ubermassige.png\" alt=\"Vermeide eine \u00fcberm\u00e4\u00dfige DOM-Gr\u00f6\u00dfe Empfehlung\" width=\"1458\" height=\"252\"><figcaption class=\"wp-caption-text\">Vermeide eine \u00fcberm\u00e4\u00dfige DOM-Gr\u00f6\u00dfe Empfehlung<\/figcaption><\/figure>\n<p>Ein h\u00e4ufiger \u00dcbelt\u00e4ter, wenn du bei dieser Pr\u00fcfung in PageSpeed Insights &#8222;durchgefallen&#8220; bist, ist dein WordPress-Theme. Schwere Themes f\u00fcgen oft gro\u00dfe Mengen an Elementen zum DOM hinzu und k\u00f6nnen auch ein verschachteltes Styling beinhalten, das deine Webseite verlangsamt. Wenn dies der Fall ist, musst du m\u00f6glicherweise das <a href=\"https:\/\/kinsta.com\/de\/blog\/wordpress-theme-andern\/\">Theme wechseln.<\/a><\/p>\n\n<h2>Zusammenfassung<\/h2>\n<p>Google PageSpeed Insights sollte ein fester Bestandteil deines Webmaster-Werkzeugkastens sein. Allerdings ist die Fixierung auf deinen Punktestand und die Besessenheit, die begehrten 100\/100 zu erreichen, wahrscheinlich nicht die beste Nutzung deiner Zeit. Es k\u00f6nnte dich von anderen wichtigen Aufgaben ablenken, die dir gr\u00f6\u00dfere Vorteile bringen k\u00f6nnten.<\/p>\n<p>In diesem Beitrag haben wir die Art und Weise behandelt, wie dein Google PageSpeed-Score funktioniert und wie nicht. Wir haben auch einige kurze Richtlinien zusammengestellt, wie du die Empfehlungen der Plattform auf deiner Seite umsetzen kannst, um deren Leistung zu verbessern.<\/p>\n<p>Hast du Fragen zu Google PageSpeed Insights oder zur Optimierung der Leistung deiner Webseite? Frage im Abschnitt Kommentare unten nach!<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Google PageSpeed Insights ist zweifellos ein n\u00fctzliches Tool f\u00fcr Webmaster, Entwickler und Webseiten-Besitzer aller Art. Wir haben jedoch festgestellt, dass viele Menschen stundenlang damit besch\u00e4ftigt sind, &#8230;<\/p>\n","protected":false},"author":38,"featured_media":31896,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_kinsta_gated_content":false,"_kinsta_gated_content_redirect":"","footnotes":""},"tags":[200,30],"topic":[1005],"class_list":["post-31859","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","tag-pagespeed","tag-webperf","topic-wordpress-leistung"],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v24.6 (Yoast SEO v24.6) - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Google PageSpeed Insights: Die Wahrheit \u00fcber die 100\/100 Bewertung<\/title>\n<meta name=\"description\" content=\"100\/100 Punkte bei Google PageSpeed zu erreichen, scheint wie ein Traum zu sein? Hier zeigen wir wie du PageSpeed Insights nutzen kannst, um stattdessen die Leistung deiner Webseite zu verbessern.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/kinsta.com\/de\/blog\/google-pagespeed-insights\/\" \/>\n<meta property=\"og:locale\" content=\"de_DE\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Google PageSpeed Insights: Die Wahrheit \u00fcber die 100\/100 Bewertung\" \/>\n<meta property=\"og:description\" content=\"100\/100 Punkte bei Google PageSpeed zu erreichen, scheint wie ein Traum zu sein? Hier zeigen wir wie du PageSpeed Insights nutzen kannst, um stattdessen die Leistung deiner Webseite zu verbessern.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/kinsta.com\/de\/blog\/google-pagespeed-insights\/\" \/>\n<meta property=\"og:site_name\" content=\"Kinsta\u00ae\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/Kinsta-Deutschland-207459890108303\/\" \/>\n<meta property=\"article:author\" content=\"https:\/\/www.facebook.com\/fm.brianleejackson\" \/>\n<meta property=\"article:published_time\" content=\"2020-02-07T15:44:11+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-04-30T12:04:05+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2020\/02\/google-pagespeed-insights-1.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1460\" \/>\n\t<meta property=\"og:image:height\" content=\"730\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Brian Jackson\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:description\" content=\"100\/100 Punkte bei Google PageSpeed zu erreichen, scheint wie ein Traum zu sein? Hier zeigen wir wie du PageSpeed Insights nutzen kannst, um stattdessen die Leistung deiner Webseite zu verbessern.\" \/>\n<meta name=\"twitter:image\" content=\"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2020\/02\/google-pagespeed-insights-1.png\" \/>\n<meta name=\"twitter:creator\" content=\"@brianleejackson\" \/>\n<meta name=\"twitter:site\" content=\"@Kinsta_DE\" \/>\n<meta name=\"twitter:label1\" content=\"Verfasst von\" \/>\n\t<meta name=\"twitter:data1\" content=\"Brian Jackson\" \/>\n\t<meta name=\"twitter:label2\" content=\"Gesch\u00e4tzte Lesezeit\" \/>\n\t<meta name=\"twitter:data2\" content=\"33\u00a0Minuten\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/kinsta.com\/de\/blog\/google-pagespeed-insights\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/kinsta.com\/de\/blog\/google-pagespeed-insights\/\"},\"author\":{\"name\":\"Brian Jackson\",\"@id\":\"https:\/\/kinsta.com\/de\/#\/schema\/person\/079824c00ccc2b7141504f27ea63bef7\"},\"headline\":\"Google PageSpeed Insights: Die Wahrheit \u00fcber die 100\/100 Bewertung\",\"datePublished\":\"2020-02-07T15:44:11+00:00\",\"dateModified\":\"2025-04-30T12:04:05+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/kinsta.com\/de\/blog\/google-pagespeed-insights\/\"},\"wordCount\":5904,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/kinsta.com\/de\/#organization\"},\"image\":{\"@id\":\"https:\/\/kinsta.com\/de\/blog\/google-pagespeed-insights\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2020\/02\/google-pagespeed-insights-1.png\",\"keywords\":[\"pagespeed\",\"webperf\"],\"articleSection\":[\"WordPress Leistungstutorials\"],\"inLanguage\":\"de\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/kinsta.com\/de\/blog\/google-pagespeed-insights\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/kinsta.com\/de\/blog\/google-pagespeed-insights\/\",\"url\":\"https:\/\/kinsta.com\/de\/blog\/google-pagespeed-insights\/\",\"name\":\"Google PageSpeed Insights: Die Wahrheit \u00fcber die 100\/100 Bewertung\",\"isPartOf\":{\"@id\":\"https:\/\/kinsta.com\/de\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/kinsta.com\/de\/blog\/google-pagespeed-insights\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/kinsta.com\/de\/blog\/google-pagespeed-insights\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2020\/02\/google-pagespeed-insights-1.png\",\"datePublished\":\"2020-02-07T15:44:11+00:00\",\"dateModified\":\"2025-04-30T12:04:05+00:00\",\"description\":\"100\/100 Punkte bei Google PageSpeed zu erreichen, scheint wie ein Traum zu sein? Hier zeigen wir wie du PageSpeed Insights nutzen kannst, um stattdessen die Leistung deiner Webseite zu verbessern.\",\"breadcrumb\":{\"@id\":\"https:\/\/kinsta.com\/de\/blog\/google-pagespeed-insights\/#breadcrumb\"},\"inLanguage\":\"de\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/kinsta.com\/de\/blog\/google-pagespeed-insights\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"de\",\"@id\":\"https:\/\/kinsta.com\/de\/blog\/google-pagespeed-insights\/#primaryimage\",\"url\":\"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2020\/02\/google-pagespeed-insights-1.png\",\"contentUrl\":\"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2020\/02\/google-pagespeed-insights-1.png\",\"width\":1460,\"height\":730,\"caption\":\"Google PageSpeed Insights: Die Wahrheit \u00fcber die 100\/100 Bewertung\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/kinsta.com\/de\/blog\/google-pagespeed-insights\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/kinsta.com\/de\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"WordPress Leistung\",\"item\":\"https:\/\/kinsta.com\/de\/thema\/wordpress-leistung\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Google PageSpeed Insights: Die Wahrheit \u00fcber die 100\/100 Bewertung\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/kinsta.com\/de\/#website\",\"url\":\"https:\/\/kinsta.com\/de\/\",\"name\":\"Kinsta\u00ae\",\"description\":\"Schnelle, sichere und hochwertige Hosting-L\u00f6sungen\",\"publisher\":{\"@id\":\"https:\/\/kinsta.com\/de\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/kinsta.com\/de\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"de\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/kinsta.com\/de\/#organization\",\"name\":\"Kinsta\",\"url\":\"https:\/\/kinsta.com\/de\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"de\",\"@id\":\"https:\/\/kinsta.com\/de\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2023\/12\/kinsta-logo.jpeg\",\"contentUrl\":\"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2023\/12\/kinsta-logo.jpeg\",\"width\":500,\"height\":500,\"caption\":\"Kinsta\"},\"image\":{\"@id\":\"https:\/\/kinsta.com\/de\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/Kinsta-Deutschland-207459890108303\/\",\"https:\/\/x.com\/Kinsta_DE\",\"https:\/\/www.instagram.com\/kinstahosting\/\",\"https:\/\/www.linkedin.com\/company\/kinsta\/\",\"https:\/\/www.pinterest.com\/kinstahosting\/\",\"https:\/\/www.youtube.com\/c\/Kinsta\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/kinsta.com\/de\/#\/schema\/person\/079824c00ccc2b7141504f27ea63bef7\",\"name\":\"Brian Jackson\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"de\",\"@id\":\"https:\/\/kinsta.com\/de\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/79623d815f4ed4c8c2457392d728cb16?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/79623d815f4ed4c8c2457392d728cb16?s=96&d=mm&r=g\",\"caption\":\"Brian Jackson\"},\"description\":\"Brian has a huge passion for WordPress, has been using it for over a decade, and even develops a couple of premium plugins. Brian enjoys blogging, movies, and hiking. Connect with Brian on Twitter.\",\"sameAs\":[\"https:\/\/www.facebook.com\/fm.brianleejackson\",\"https:\/\/www.linkedin.com\/in\/brianleejackson\",\"https:\/\/x.com\/brianleejackson\"],\"url\":\"https:\/\/kinsta.com\/de\/blog\/author\/brianjackson\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Google PageSpeed Insights: Die Wahrheit \u00fcber die 100\/100 Bewertung","description":"100\/100 Punkte bei Google PageSpeed zu erreichen, scheint wie ein Traum zu sein? Hier zeigen wir wie du PageSpeed Insights nutzen kannst, um stattdessen die Leistung deiner Webseite zu verbessern.","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:\/\/kinsta.com\/de\/blog\/google-pagespeed-insights\/","og_locale":"de_DE","og_type":"article","og_title":"Google PageSpeed Insights: Die Wahrheit \u00fcber die 100\/100 Bewertung","og_description":"100\/100 Punkte bei Google PageSpeed zu erreichen, scheint wie ein Traum zu sein? Hier zeigen wir wie du PageSpeed Insights nutzen kannst, um stattdessen die Leistung deiner Webseite zu verbessern.","og_url":"https:\/\/kinsta.com\/de\/blog\/google-pagespeed-insights\/","og_site_name":"Kinsta\u00ae","article_publisher":"https:\/\/www.facebook.com\/Kinsta-Deutschland-207459890108303\/","article_author":"https:\/\/www.facebook.com\/fm.brianleejackson","article_published_time":"2020-02-07T15:44:11+00:00","article_modified_time":"2025-04-30T12:04:05+00:00","og_image":[{"width":1460,"height":730,"url":"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2020\/02\/google-pagespeed-insights-1.png","type":"image\/png"}],"author":"Brian Jackson","twitter_card":"summary_large_image","twitter_description":"100\/100 Punkte bei Google PageSpeed zu erreichen, scheint wie ein Traum zu sein? Hier zeigen wir wie du PageSpeed Insights nutzen kannst, um stattdessen die Leistung deiner Webseite zu verbessern.","twitter_image":"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2020\/02\/google-pagespeed-insights-1.png","twitter_creator":"@brianleejackson","twitter_site":"@Kinsta_DE","twitter_misc":{"Verfasst von":"Brian Jackson","Gesch\u00e4tzte Lesezeit":"33\u00a0Minuten"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/kinsta.com\/de\/blog\/google-pagespeed-insights\/#article","isPartOf":{"@id":"https:\/\/kinsta.com\/de\/blog\/google-pagespeed-insights\/"},"author":{"name":"Brian Jackson","@id":"https:\/\/kinsta.com\/de\/#\/schema\/person\/079824c00ccc2b7141504f27ea63bef7"},"headline":"Google PageSpeed Insights: Die Wahrheit \u00fcber die 100\/100 Bewertung","datePublished":"2020-02-07T15:44:11+00:00","dateModified":"2025-04-30T12:04:05+00:00","mainEntityOfPage":{"@id":"https:\/\/kinsta.com\/de\/blog\/google-pagespeed-insights\/"},"wordCount":5904,"commentCount":0,"publisher":{"@id":"https:\/\/kinsta.com\/de\/#organization"},"image":{"@id":"https:\/\/kinsta.com\/de\/blog\/google-pagespeed-insights\/#primaryimage"},"thumbnailUrl":"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2020\/02\/google-pagespeed-insights-1.png","keywords":["pagespeed","webperf"],"articleSection":["WordPress Leistungstutorials"],"inLanguage":"de","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/kinsta.com\/de\/blog\/google-pagespeed-insights\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/kinsta.com\/de\/blog\/google-pagespeed-insights\/","url":"https:\/\/kinsta.com\/de\/blog\/google-pagespeed-insights\/","name":"Google PageSpeed Insights: Die Wahrheit \u00fcber die 100\/100 Bewertung","isPartOf":{"@id":"https:\/\/kinsta.com\/de\/#website"},"primaryImageOfPage":{"@id":"https:\/\/kinsta.com\/de\/blog\/google-pagespeed-insights\/#primaryimage"},"image":{"@id":"https:\/\/kinsta.com\/de\/blog\/google-pagespeed-insights\/#primaryimage"},"thumbnailUrl":"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2020\/02\/google-pagespeed-insights-1.png","datePublished":"2020-02-07T15:44:11+00:00","dateModified":"2025-04-30T12:04:05+00:00","description":"100\/100 Punkte bei Google PageSpeed zu erreichen, scheint wie ein Traum zu sein? Hier zeigen wir wie du PageSpeed Insights nutzen kannst, um stattdessen die Leistung deiner Webseite zu verbessern.","breadcrumb":{"@id":"https:\/\/kinsta.com\/de\/blog\/google-pagespeed-insights\/#breadcrumb"},"inLanguage":"de","potentialAction":[{"@type":"ReadAction","target":["https:\/\/kinsta.com\/de\/blog\/google-pagespeed-insights\/"]}]},{"@type":"ImageObject","inLanguage":"de","@id":"https:\/\/kinsta.com\/de\/blog\/google-pagespeed-insights\/#primaryimage","url":"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2020\/02\/google-pagespeed-insights-1.png","contentUrl":"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2020\/02\/google-pagespeed-insights-1.png","width":1460,"height":730,"caption":"Google PageSpeed Insights: Die Wahrheit \u00fcber die 100\/100 Bewertung"},{"@type":"BreadcrumbList","@id":"https:\/\/kinsta.com\/de\/blog\/google-pagespeed-insights\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/kinsta.com\/de\/"},{"@type":"ListItem","position":2,"name":"WordPress Leistung","item":"https:\/\/kinsta.com\/de\/thema\/wordpress-leistung\/"},{"@type":"ListItem","position":3,"name":"Google PageSpeed Insights: Die Wahrheit \u00fcber die 100\/100 Bewertung"}]},{"@type":"WebSite","@id":"https:\/\/kinsta.com\/de\/#website","url":"https:\/\/kinsta.com\/de\/","name":"Kinsta\u00ae","description":"Schnelle, sichere und hochwertige Hosting-L\u00f6sungen","publisher":{"@id":"https:\/\/kinsta.com\/de\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/kinsta.com\/de\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"de"},{"@type":"Organization","@id":"https:\/\/kinsta.com\/de\/#organization","name":"Kinsta","url":"https:\/\/kinsta.com\/de\/","logo":{"@type":"ImageObject","inLanguage":"de","@id":"https:\/\/kinsta.com\/de\/#\/schema\/logo\/image\/","url":"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2023\/12\/kinsta-logo.jpeg","contentUrl":"https:\/\/kinsta.com\/de\/wp-content\/uploads\/sites\/5\/2023\/12\/kinsta-logo.jpeg","width":500,"height":500,"caption":"Kinsta"},"image":{"@id":"https:\/\/kinsta.com\/de\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/Kinsta-Deutschland-207459890108303\/","https:\/\/x.com\/Kinsta_DE","https:\/\/www.instagram.com\/kinstahosting\/","https:\/\/www.linkedin.com\/company\/kinsta\/","https:\/\/www.pinterest.com\/kinstahosting\/","https:\/\/www.youtube.com\/c\/Kinsta"]},{"@type":"Person","@id":"https:\/\/kinsta.com\/de\/#\/schema\/person\/079824c00ccc2b7141504f27ea63bef7","name":"Brian Jackson","image":{"@type":"ImageObject","inLanguage":"de","@id":"https:\/\/kinsta.com\/de\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/79623d815f4ed4c8c2457392d728cb16?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/79623d815f4ed4c8c2457392d728cb16?s=96&d=mm&r=g","caption":"Brian Jackson"},"description":"Brian has a huge passion for WordPress, has been using it for over a decade, and even develops a couple of premium plugins. Brian enjoys blogging, movies, and hiking. Connect with Brian on Twitter.","sameAs":["https:\/\/www.facebook.com\/fm.brianleejackson","https:\/\/www.linkedin.com\/in\/brianleejackson","https:\/\/x.com\/brianleejackson"],"url":"https:\/\/kinsta.com\/de\/blog\/author\/brianjackson\/"}]}},"acf":[],"_links":{"self":[{"href":"https:\/\/kinsta.com\/de\/wp-json\/wp\/v2\/posts\/31859","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/kinsta.com\/de\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/kinsta.com\/de\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/kinsta.com\/de\/wp-json\/wp\/v2\/users\/38"}],"replies":[{"embeddable":true,"href":"https:\/\/kinsta.com\/de\/wp-json\/wp\/v2\/comments?post=31859"}],"version-history":[{"count":15,"href":"https:\/\/kinsta.com\/de\/wp-json\/wp\/v2\/posts\/31859\/revisions"}],"predecessor-version":[{"id":73134,"href":"https:\/\/kinsta.com\/de\/wp-json\/wp\/v2\/posts\/31859\/revisions\/73134"}],"alternate":[{"embeddable":true,"hreflang":"it","title":"Italian","href":"https:\/\/kinsta.com\/de\/wp-json\/kinsta\/v1\/posts\/31859\/translations\/it"},{"embeddable":true,"hreflang":"en","title":"English","href":"https:\/\/kinsta.com\/de\/wp-json\/kinsta\/v1\/posts\/31859\/translations\/en"},{"embeddable":true,"hreflang":"pt","title":"Portuguese","href":"https:\/\/kinsta.com\/de\/wp-json\/kinsta\/v1\/posts\/31859\/translations\/pt"},{"embeddable":true,"hreflang":"fr","title":"French","href":"https:\/\/kinsta.com\/de\/wp-json\/kinsta\/v1\/posts\/31859\/translations\/fr"},{"embeddable":true,"hreflang":"es","title":"Spanish","href":"https:\/\/kinsta.com\/de\/wp-json\/kinsta\/v1\/posts\/31859\/translations\/es"},{"embeddable":true,"hreflang":"de","title":"German","href":"https:\/\/kinsta.com\/de\/wp-json\/kinsta\/v1\/posts\/31859\/translations\/de"},{"embeddable":true,"hreflang":"nl","title":"Dutch","href":"https:\/\/kinsta.com\/de\/wp-json\/kinsta\/v1\/posts\/31859\/translations\/nl"},{"embeddable":true,"hreflang":"ja","title":"Japanese","href":"https:\/\/kinsta.com\/de\/wp-json\/kinsta\/v1\/posts\/31859\/translations\/jp"},{"embeddable":true,"hreflang":"da","title":"Danish","href":"https:\/\/kinsta.com\/de\/wp-json\/kinsta\/v1\/posts\/31859\/translations\/dk"},{"embeddable":true,"hreflang":"sv","title":"Swedish","href":"https:\/\/kinsta.com\/de\/wp-json\/kinsta\/v1\/posts\/31859\/translations\/se"},{"href":"https:\/\/kinsta.com\/de\/wp-json\/kinsta\/v1\/posts\/31859\/tree"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/kinsta.com\/de\/wp-json\/wp\/v2\/media\/31896"}],"wp:attachment":[{"href":"https:\/\/kinsta.com\/de\/wp-json\/wp\/v2\/media?parent=31859"}],"wp:term":[{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/kinsta.com\/de\/wp-json\/wp\/v2\/tags?post=31859"},{"taxonomy":"topic","embeddable":true,"href":"https:\/\/kinsta.com\/de\/wp-json\/wp\/v2\/topic?post=31859"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}