TechBlogSD - Alles für WordPress und WEB-Entwicklung
WEB- und WordPress-Anleitungen, Neuigkeiten, Rezensionen zu Themes und Plugins

Wie erhalte ich eine 100/100-Punktzahl in Google PageSpeed ​​Insights für die WordPress-Site?

10

Google hat kürzlich angekündigt, dass die Seitenerfahrung einer der Faktoren im Algorithmus sein wird, die sich auf die Suchranking-Positionen auswirken. Der neue Begriff Core Web Vitals, den Sie in der Google Search Console sehen, werden zu wichtigen Faktoren, die die Zukunft des Webs definieren würden. Dies zwingt alle Webmaster, sicherzustellen, dass die Ladegeschwindigkeit der Website den Anforderungen von Google entspricht, um ein gutes Ranking in den Suchergebnissen zu erzielen. Wenn Sie WordPress zum Hosten Ihrer Website verwenden, ist es tatsächlich einfach, eine 100/100-Punktzahl im Google PageSpeed ​​Insights-Tool zu erhalten.

Dies ist eine Fallstudie mit unserer eigenen Erfahrung. Daher erwähnen wir die Plugins / Themes / Hosting-Firmennamen explizit. Wichtig ist, dass es nicht immer notwendig ist, sich den PageSpeed-Score anzusehen, wenn Sie einen klaren Überblick darüber haben, was Sie tun. Sie können beispielsweise bezahlte Anzeigen oder soziales Marketing verwenden, um für Ihre Website zu werben, die einen schlechten Seitengeschwindigkeits-Score aufweist. Daher gilt der Kontext dieses Artikels für Blogger, die eine höhere Geschwindigkeitsbewertung anstreben, wodurch die Chance auf ein höheres Suchmaschinenranking und eine bessere Benutzererfahrung erhöht wird.

Google PageSpeed ​​Insights

Es gibt wenige Werkzeuge; Sie können die Geschwindigkeit der WordPress-Website überwachen. Google PageSpeed ​​Insights, Pingdom, GTmetrix und WebPage Test sind einige der am häufigsten verwendeten Tools in der Liste. Da die Google-Suchergebnisse über den Traffic vieler Websites entscheiden, ist es gut, das Tool PageSpeed ​​Insights als Referenz zu verwenden.

Sie können zum PageSpeed-Tool gehen und eine beliebige Seiten-URL eingeben, um die Geschwindigkeitsbewertung zu erhalten. Es gibt viele Faktoren, die die Punktzahl beeinflussen, die Sie auf der offiziellen Google-Entwicklerseite lesen können. Nachfolgend finden Sie eine Zusammenfassung der Faktoren, die die angezeigte Punktzahl beeinflussen.

Faktor Gewicht
Erste zufriedene Farbe fünfzehn%
Geschwindigkeitsindex fünfzehn%
Größte zufriedene Farbe 25%
Zeit für Interaktiv fünfzehn%
Gesamtsperrzeit 25%
Kumulative Layoutverschiebung 5%

Nach der Analyse der Webseite vergibt Google eine Punktzahl basierend auf einer 100-Punkte-Skala. Nachfolgend sind die drei Bereiche aufgeführt, um die Geschwindigkeitsposition der analysierten Seite anzuzeigen.

  • 0-49: Schlecht
  • 50-79: Verbesserungsbedürftig
  • 80-100: Gut

Daher zeigt die 100/100-Punktzahl in Google PageSpeed ​​an, dass Ihre Website superschnell geladen wird, offensichtlich werden Google und Benutzer schnell ladende Websites lieben. Sie können den Lighthouse-Scoring-Rechner ausprobieren, um verschiedene Parameter zu überprüfen, die für die dynamische Verbesserung der Geschwindigkeit erforderlich sind.

Denken Sie daran, dass Google neben den oben genannten Faktoren auch Möglichkeiten vorschlägt, nicht verwendete Skripte zu entfernen oder nicht verwendete CSS zu entfernen. Dies sind jedoch Empfehlungen und wirken sich NICHT auf Ihre Punktzahl aus, selbst wenn Sie hart daran arbeiten, dass sie das Audit bestehen. Wir weisen auf diesen Punkt ausdrücklich hin, da viele Blogger der Meinung sind, dass das Entfernen von jQuery zu einer höheren Punktzahl beiträgt.

Unser Website-Score und -Größe

Bevor wir erklären, wie Sie 100/100 erreichen, möchten wir Ihnen die Punktzahl unserer Homepage zeigen. Wie Sie sehen können, erhalten wir 100 sowohl für Mobilgeräte als auch für Desktop-Computer.

Wie erhalte ich eine 100/100-Punktzahl in Google PageSpeed ​​Insights für die WordPress-Site?

Startpunktzahl

Denken Sie daran, wir sprechen von dieser Live-Website mit fast 2000 Blog-Posts und der Verwendung von etwa 20 Plugins. Wenn wir die volle Punktzahl erreichen können, ist dies für Websites mit einer geringeren Anzahl von Beiträgen und Plugins sehr gut möglich.

5 Faktoren, um 100/100 Punkte in Google PageSpeed ​​zu erhalten

Im Folgenden sind die fünf wichtigsten Faktoren aufgeführt, die wir im Detail besprechen werden und die unserer Meinung nach wichtig sind, um eine 100/100-Punktzahl in Google PageSpeed ​​zu erreichen.

  1. Holen Sie sich ein gutes Hosting-Unternehmen
  2. Keine Werbecodes
  3. Verwenden Sie ein leichtes Design
  4. Entfernen Sie schwere Plugins
  5. Caching-Plugin verwenden

Abhängig von Ihrer Situation können auch einige andere Faktoren wie DB-Bereinigung und CDN hilfreich sein. Auch diese Aspekte werden wir behandeln.

1 Gutes Hosting

Wir haben diese Website auf Weebly gestartet und sind mit Bluehost auf WordPress umgestiegen. Später haben wir die Site auf den SiteGround GoGeek-Plan und dann im Mai 2016 auf SiteGround Cloud VPS verschoben. Von diesem Zeitpunkt an gab es kein Zurück mehr oder keine Zeit für Hosting-bezogene Probleme.

Vor kurzem hat SiteGround seine Infrastruktur auf die Google Cloud-Plattform umgestellt. Dies hilft sehr, eine solide erste Antwortzeit vom Server zu haben. Wir verwenden nicht einmal Cloudflare oder ein anderes CDN, um eine 100/100-Punktzahl in Google PageSpeed ​​zu erhalten. Es geht um das gute Hosting, das Sie für Ihre Site verwenden. Stellen Sie daher sicher, dass Sie einen Premium-Hosting-Plan wie SiteGround Cloud VPS oder ähnliches erwerben. Dies wird Ihnen helfen, viel Zeit zu sparen und sich auf andere Aspekte des Betriebs einer Website zu konzentrieren.

2 Keine Werbecodes

Fast 90% der Blogger beginnen zu bloggen, um online Geld zu verdienen. Die erste Wahl für sie ist, sich für Google AdSense zu bewerben und die zweite Wahl ist, Affiliate-Marketing auszuprobieren. Da Affiliate-Marketing eine vertrauenswürdige Website benötigt, ist Google AdSense eine ideale Option für neue Blogger.

Wir verwenden Google AdSense und das ist unsere Haupteinnahmequelle für den Betrieb dieser Website. Die Probleme mit AdSense und der Seitengeschwindigkeit haben wir in unserem Artikel – AdSense vs. Seitengeschwindigkeit an Ironie – erläutert. Die von uns in PageSpeed ​​getestete Seite ist die Startseite dieser Site. Der Grund für die 100/100-Punktzahl ist, dass wir auf der Startseite keinen AdSense-Code verwenden. Auf der gesamten Website ist jedoch eine automatische Anzeige verfügbar. Als wir die Seite nach Überprüfung des PageSpeed-Scores überprüften, stellten wir fest, dass unten auf der Seite eine Anzeige geschaltet wurde. Die Seite wird schneller geladen, da unten eine einzelne Anzeige erscheint.

Wir zeigen Ihnen das Ergebnis einer zufälligen Seite mit 5 AdSense-Anzeigen auf dieser Website. Wie Sie sehen können, liegt die Punktzahl im Bereich 55/90. Dies ist ein Rückgang von 45/10% auf Mobilgeräten und Desktops.

Wie erhalte ich eine 100/100-Punktzahl in Google PageSpeed ​​Insights für die WordPress-Site?

Mobile Geschwindigkeit der zufälligen Seite

Wie erhalte ich eine 100/100-Punktzahl in Google PageSpeed ​​Insights für die WordPress-Site?

Desktop-Geschwindigkeit einer zufälligen Seite

Wenn Sie AdSense oder ähnliche Werbeprogramme verwenden möchten, vergessen Sie die Seitengeschwindigkeit. Google PageSpeed ​​zeigt Ihnen viele Probleme aufgrund des Ladens von Skripten von Drittanbietern auf Ihrer Website. Leider können Sie diese Probleme nicht lösen, ohne den Werbeskriptcode zu entfernen.

Wie erhalte ich eine 100/100-Punktzahl in Google PageSpeed ​​Insights für die WordPress-Site?

Auswirkungen von AdSense auf die Geschwindigkeit

3 Verwenden Sie ein leichtes Thema

Wir haben das Highend-Theme 4 Jahre lang verwendet. Dies ist ein sehr gutes Thema mit gebündelten Funktionen. Leider haben wir 90% der Funktionalitäten wie Karten, FAQ, Testimonials usw. nicht genutzt. Das Theme lädt jedoch CSS- und JS-Ressourcen, die für all diese Funktionen benötigt werden, unabhängig davon, ob Sie auf der Seite verwenden oder nicht. Das ist bedeutungslos, als ob man einen großen Palast besitzt, aber trotzdem in einer kleinen Hütte außerhalb des Palastes lebt.

Leider war es aufgrund der engen Integration des Highend-Themas auf der gesamten Site nicht einfach, ein Thema zu wechseln. Das Highend-Theme bietet beispielsweise eine Option zur Integration von Google Analytics mithilfe von Designoptionen. Wir haben also viel Zeit damit verbracht, ein Ersatz-Theme zu finden, das von Natur aus minimal ist, aber Basisfunktionen ohne Plugins bietet.

Glücklicherweise erfüllten nur sehr wenige Themen unsere Kriterien. Um genau zu sein, haben wir uns für GeneratePress- und Astra-Themen entschieden und uns später für den Kauf von GeneratePress entschieden. Nach sechs Monaten Migrationsarbeit haben wir im Juni 2020 das Thema geändert und der PageSpeed-Score stieg um mindestens 30 % (mit AdSense-Anzeigen).

Wir haben fünf Jahre zuvor verloren, weil wir ein falsches Thema gewählt haben, das wir nicht brauchten. Stellen Sie sicher, dass Sie nicht den gleichen Fehler machen und kaufen Sie ein Premium- und minimalistisches Thema, das Ihren Bedürfnissen entspricht. Das GeneratePress-Theme bietet Hooks mit Elementen, Abschnitten, Typografie und anderen grundlegenden Funktionen, die wir benötigen. Für alle anderen Zwecke ist es besser, Plugins zu verwenden, damit wir später keine weiteren fünf Jahre verschwenden müssen, um dieses Thema zu ändern.

4 Entfernen Sie schwere Plugins

Ähnlich wie beim Thema gibt es schwere Plugins, die die Seitengeschwindigkeit nach unten ziehen. Zuvor haben wir auf dieser Seite die Plugins WPBakery Page Builder, WooCommerce und WP Review verwendet. Jetzt haben wir all diese Plugins zusammen mit dem Highend-Theme in ein Unterverzeichnis verschoben. Dies hat uns zusammen mit den Google-Algorithmus-Updates im Mai 2020 einen starken Traffic-Verlust verursacht. Wir müssen jedoch mit einer Geschwindigkeitssteigerung von ~30 % weitermachen.

Wenn Sie einen Page Builder oder ähnliche Plugins verwenden oder suchen möchten, halten Sie an und überlegen Sie es sich zweimal.

  • Wir haben das WPBakery Page Builder-Layout konvertiert und verwenden den Standard- Gutenberg, um unsere Homepage zu erstellen. Sogar GeneratePress bietet Elementor-Layouts und einen eigenen Mini-Page-Builder, aber Sie können mit dem Gutenberg-Gruppenblock mit Sicherheit anständige Layouts mit Jumbotron- und Hero-Headern in voller Breite erstellen.
  • Vermeiden Sie aufgeblähte Plugins wie WP Review – es verwendet immer noch Font Awesome 4.7 zum Preis von $97 (3-Sites-Lizenz). Das ist absolut lächerlich, wenn die Version 4.7 auf jeder einzelnen Seite geladen wird, wenn Version 6 gestartet wird. Denken Sie daran, wir sprechen von 2000 Seiten, von denen nur 70 Seiten die Bewertungsvorlage des Plugins verwenden. Dies ist eine Art Kompromiss, über den Sie nachdenken sollten, bevor Sie ein Plugin auf Ihrer Website installieren.
  • WooCommerce ist ein weiteres Plugin, das Ihre Website zerstört, indem es AJAX-Aufrufe des Administrators für den Warenkorb hinzufügt. Auch hier sind 50 Produkte gegen 2000 Posts kein guter Weg, um sie sowohl aus Traffic- als auch aus Umsatzsicht zusammenzuhalten.

Dies sind harte Lernmethoden, die wir erst nach Jahren verstanden haben. Ich hoffe, Sie können den Punkt verstehen und nur die erforderlichen Plugins auf Ihrer Website verwenden.

5 Caching-Plugin verwenden

Wir verwenden WP Rocket seit mehr als einem Jahr. Der beste Teil des Plugins ist, dass es kritisches CSS für jeden Beitragstyp auf Ihrer Website generiert. Zusammen mit Caching und Preloading kurbelt kritische CSS die Geschwindigkeit Ihrer Website an die Spitze. Beachten Sie, dass wir auch WP Rocket im Highend-Thema mit WooCommerce und anderen schweren Plugins verwendet haben, wie oben beschrieben. Das Ergebnis war jedoch 30/60 in Google PageSpeed.

Das Ergebnis ist also, dass das Caching-Plugin mit den am besten codierten Themes / Plugins am besten funktioniert. Andernfalls haben Sie eine falsche Kombination ohne viel Geschwindigkeitssteigerung. Beachten Sie, dass SiteGround standardmäßiges Server-Caching mit dem SG Optimizer-Plugin bietet. Dies funktioniert bei uns jedoch nicht einmal mit einem einfachen GeneratePress-Theme. Da wir das Caching unabhängig vom Hosting halten wollen, war WP Rocket oder ein ähnliches Plugin für uns die beste Option. Im Folgenden sind das Caching und andere Funktionen aufgeführt, die Sie mit WP Rocket erhalten:

  • Browser-Caching, GZIP-Komprimierung, Abfragezeichenfolge entfernen und Google-Schriftarten optimieren.
  • Deaktivieren Sie Einbettungen, Emojis und steuern Sie die Heartbeat-API.
  • Kritische CSS-Generierung für jeden Beitragstyp mit Vorladen von URLs basierend auf Ihrer XML-Sitemap.
  • Hosten Sie jQuery Migrate, Google Analytics und Facebook Pixels, um die Geschwindigkeit zu verbessern.
  • Kombinieren und minimieren Sie CSS und JS.
  • Bereinigen Sie redundante Datenbankeinträge wie Transienten, Revisionen und Autosaves.
  • Lazy Laden von Bildern, Videos und Frames.
  • Separater Cache für Mobilgeräte und Desktops, falls erforderlich.

Sie können auch CDN erwerben und das Bildoptimierungs-Plugin gegen Aufpreis verwenden (wir verwenden diese Funktionen nicht).

Andere Faktoren

Nun, im ganzen Internet finden Sie das Wort "CDN", wenn Sie über die Geschwindigkeit der WordPress-Site sprechen. SiteGround bietet auch eine kostenlose CDN-Integration mit Cloudflare. Es sei denn, Sie haben eine Zielgruppe in Ländern mit Internet-Blockierung wie China, glauben wir nicht, dass CDN dies tatsächlich kann Erhöhen Sie die Geschwindigkeit drastisch. Für eine Site wie unsere wird es helfen, statische Dateien wie große Bilder schneller bereitzustellen. SiteGround hat jedoch Site-Tools eingeführt (die cPanel ersetzen ), die automatisch WebP-Bilder mit ihrem SG Optimizer-Plugin generieren. Wir verwenden es immer noch nicht Mit dieser Funktion können Sie jedes WebP-Plug-in verwenden, um leichtgewichtige Bilder für unterstützte Browser anstelle des PNG/JPEG-Formats bereitzustellen.

Ein weiterer Faktor ist die Bereinigung Ihrer Datenbank und Site. Wie bereits erwähnt, bietet WP Rocket eine DB-Bereinigungsoption, die Sie regelmäßig planen können. Das ist jedoch nicht die Reinigung, über die wir hier sprechen.

  • Wissen Sie, dass das WooCommerce-Plugin mehr als 25 Tabellen in Ihre Datenbank einfügt? Wie wir hier erklärt haben, hat die Standard-WordPress-Installation nur 12 Tabellen für eine einzelne Site. Wir haben viel Zeit damit verbracht, Bestellungen, Produkte und WooCommerce-Dateien zu migrieren. Wir müssen auch WooCommerce-Miniaturansichten löschen, um den Speicherplatz zu bereinigen. Erfahren Sie mehr darüber, wie Sie WooCommerce vollständig von Ihrer Website löschen.
  • Das WP Review Pro-Plugin fügt jedem einzelnen von Ihnen erstellten Beitrag ~25 benutzerdefinierte Felder hinzu. All dies wird den Postmeta-Tisch aufblähen. Außerdem werden 2 zusätzliche Miniaturansichten für jedes hochgeladene Bild generiert.
  • WP Bakery und viele andere Plugins haben CSS, JS und andere Ressourcen in einem separaten Verzeichnis im Upload-Ordner. Diese Skripte verlangsamen Ihre Website, indem sie auf allen Seiten geladen werden.
  • Das Highend-Theme generiert für jedes hochgeladene Bild ~10 Miniaturansichten (dies hängt von der Bildgröße und den Optionen ab).

Das einfache Ändern des Themes zu GeneratePress und das Migrieren schwerer Plugins in ein Unterverzeichnis hilft nicht, das aktuelle Chaos zu beseitigen. Wenn Sie das Thema ändern oder Plugins löschen, stellen Sie sicher, dass Sie alle Spuren löschen, die sie in den Tabellen wp_postmeta und wp_options hinterlassen. Dies trägt dazu bei, die Seitenladegeschwindigkeit zu erhöhen, indem die Ausführungszeit für Datenbankabfragen verkürzt wird.

Letzte Worte

Wir haben diesen Artikel absichtlich so geschrieben, dass Sie NICHT tun sollten, um eine 100/100-Punktzahl im Google PageSpeed ​​Insights-Tool zu erhalten. Dies ist für Blogger, die mitten im Bloggen sind und versuchen, die Geschwindigkeit zu verbessern. Wenn Sie jedoch ein neuer Blogger sind, sollte Ihnen dies eine klare Vorstellung davon geben, wie sich die Auswahl von Optionen wie AdSense und umfangreichen Designs mit Seitenerstellern auswirkt. Wie ein beliebtes Sprichwort sagt: „Einfachheit ist eine ultimative Raffinesse”, hilft Ihnen die Auswahl der benötigten Dinge, hohe Punktzahlen zu erzielen und viel Zeit zu sparen.

Aufnahmequelle: www.webnots.com
Hinterlasse eine Antwort

Diese Website verwendet Cookies, um Ihre Erfahrung zu verbessern. Wir gehen davon aus, dass Sie damit einverstanden sind, Sie können sich jedoch abmelden, wenn Sie möchten. Annehmen Weiterlesen