web bastler logo weiß mit umrandung
web
bastler
Pagespeed Optimierung

Pagespeed Optimierung in 2022
Der ultimative Leitfaden um die Ladezeit der WordPress Website zu verbessern

Letztes Update: 04.22 | Autor: Manuel
20, 21 ,22 ... Diese Zahlen sind vielleicht Relevant beim Abstand Messen auf der Autobahn ( eigentlich nicht mal da), jedoch mit Sicherheit nicht beim Laden einer Webseite. Die Performance einer Website ist eines der wichtigsten Aspekte für Ihre Besucher.

Ich erkläre Ihnen was es genau mit Pagespeed Optimierung im Jahr 2022 aufsich hat und worauf es wirklich ankommt, um die Ladezeit der WordPress Website zu verbessern.

Stellen Sie sich vor Sie stehen bei der Kassa im Supermarkt und der Kunde vor Ihnen hat vergessen seine Bananen abzuwiegen ...Richtig, Ihre Kabeln werden ersichtlich.

Genau so geht es den Besuchern Ihrer Webseite, wenn Sie mit Ladezeiten zu kämpfen haben.  
Inhaltsverzeichnis
Testen Sie die Geschwindigkeit Ihrer Website

Gründe

Warum ist das Optimieren der Website wichtig?

Aus folgenden zwei Gründen:

  1. um Nutzererlebnis / Nutzererfahrung Ihrer Besucher zu steigern (keine Lade- / Wartezeit)
  2. um ein besseres Google Ranking zu erreichen
1.

Nutzererlebnis / Nutzererfahrung

Wartezeiten sind einfach nur nervig und sollten maximal bei Ihren Mitbewerbern entstehen.

Versetzen Sie sich einfach in Ihre eigene Lage.

Wenn Sie eine Webseite besuchen wollen Sie das bestmögliche Nutzererlebnis erleben und zeitgleich die beste Nutzererfahrung genießen während der Inhalt der Webseite sich so schnell als möglich aufbaut um nicht gleich wieder den Hut drauf zu werfen und vielleicht weiter nach Alternativen suchen zu müssen.

Genau so geht es auch Ihren Besuchern/Kunden.

Es würde nichts schlimmeres geben als wenn Ihre Besucher genervt aufgrund zu langer Ladezeit/Wartezeit auf die Webseite von Ihren Mitbewerbern wechseln weil nur der Ladebalken statt dem Inhalt ersichtlich ist.
nutzererlebnis
google ranking
Auszug aus der Google Search Console (Search Console Insights)
2.

Besseres Google Ranking

Indirekt war der Pagespeed, neben den klassischen SEO Maßnahmen seit jeher bereits ein wichtiger Rankingfaktor für Google, da die Ladezeit einer Website wichtige Nutzer Signale beeinflusst.

Mit der Einführung des Mobil First Index ist es nun seitens Google offiziell, dass der Pagespeed ausschlaggebend für das Ranking der Website ist.

Gerade beim responsiven Webdesign trennt sich die Spreu vom Weizen zwischen einer optimierten und nicht optimierten Website. 
google pagespeed insights
Google Pagespeed Insight
gtmetrix
GTMetrix
pingdom
Pingdom

Allgemeine Messmethoden

Wie kann ich die Ladezeit meiner Website messen?

Der einfachste Weg um die Ladezeit bzw. Pagespeed Ihrer Website messen zu können ist ein kostenloses Tool zu verwenden. Die Bekanntesten unter ihnen sind Google Pagespeed Insights, GTMetrix sowie Pingdom. Weiters gibt es auch die Möglichkeit direkt im Browser die Ladezeit zu messen.
Der größte Vorteil beim Benutzen von kostenlosen Tools ist, dass Verbesserungen/Empfehlungen direkt angezeigt werden. Wenn man jedoch ein Laie ist und Steine Ahnung hat werden einem die Vorschläge relativ wenig sagen.

Google Pagespeed oder GTmetrix? Welches Tool soll ich verwenden?

Kann man pauschal wie im realen Leben nicht sagen. Meine Empfehlung wäre für eine übersichtlichere Darstellung GTMetrix. Mit dem Wasserfall Diagramm sieht man schön. was genau wann geladen wird. 

Achtung hier sei erwähnt, dass man sich registrieren/anmelden sollte, da ansonst der Server von Kanada gewählt wird. Nach Anmeldung kann man den Standort London auswählen, welcher eher eine realistischen Wert ausgibt.

Auch werden Verbesserungsvorschläge bekannt gegeben, jedoch nicht spezifisch auf den Core Web Vitals Test bezogen.. 

Google Pagespeed hingegen gibt kein Wasserfall Diagramm an, jedoch eine genaue Erklärung an welchen Schrauben gedreht werden muss, um den Core Web Vitals Test zu bestehen.
all inkl
Google Pagespeed Insights Wert von web-bastler
all inkl
GTMetrix Wert von web-bastler
google pagespeed insights
Google Pagespeed Insight Score

Brauch ich einen 100/100 Score in Google Pagespeed?

Nein dieser ist natürlich nicht von nöten. Vor Allem gilt folgende Regel: “Nutzererfahrung über Score” 

Was damit gemeint ist, dass es keinen Sinn macht zwar einen 100/100 Score zu erreichen, jedoch die Webseite wie hingespieben aussieht. (CSS Formatierung für die Fisch, Qualität der Bilder nicht ausreichend, …) 

Dennoch gilt, wie bereits erwähnt, dass ein besserer Score in der Regel zu einer besseren Nutzererfahrung führt und somit (sollte Content SEO Technisch auf gleichem Niveau mit Mitbewerbern sein) mit einem besseren Ranking belohnt wird.

Ladezeit in Chrome, Firefox & Edge messen

Gleiches vorgehen für alle Browser. Nach Aufrufen der Website können Sie mittels rechter Maustaste / Untersuchen bzw. in Chrome mittels F12 Taste im Entwicklertool den Reiter “Netzwerk”/”Netzwerkanalyse” aufrufen. Nach erneutem Aufrufen der Seite bzw. drücken der F5 Taste sehen Sie in einem Wasserfalldiagramm die genaue Daten über den Ladevorgang.

Unterschieden werden die Dateien in HTML, CSS, JS, Bilder sowie Schriften.
all inkl
Untersuchen der Website in Chrome mit Netzwerkansicht
hosting

Domains, Webspace & mehr

Hosting, der Grundbaustein einer schnellen WordPress Website

Ähnlich wie beim Hausbau ein stabiles Fundament, ist ein guter Hoster das A und O einer Website. 

Ohne einem starken Hosting Partner, wird die Performance einer Website nicht optimal sein und nur Unmut bei Ihren Besuchern sowie beim Ranking Ihrer Website von Google führen.

Wie findet man einen guten Hoster?

Auf der Suche nach einem guten Hoster sind folgende Punkte relevant:

  • Geringe Reaktionszeit des Servers(TTFB)
  • Verfügbarkeit
  • Inkludierter SSL Schutz
  • Speichergröße
  • Inklusiv Leistungen ( Domains, Easy Install, …)
  • Support

Gutes Hosting muss nicht teuer sein

Da wie bereits bekannt Preis/Leistung für mich enorm wichtig ist, will ich meine Erfahrungen mit diversen Hostern Ihnen nicht vorenthalten.
Vorweg in der Regel haben ich den Ansatz primär lokale Unternehmen zu unterstützen, da es dank dem X-ten Lockdown ansässige Firmen bereits genug schwer haben.

Jedoch bringt einem der falsche Patriotismus relativ wenig, wenn die Leistung mit anderen Mitbewerbern ansatzweise mithalten kann,

Zu Beginn noch bei einem großen Österreichischen Hoster gewesen, habe ich schnell festgestellt, dass das Gebotene leider nicht ansatzweise mit den “Wir schaffen das” Nachbarn mithalten kann.

Teurere Preise, wenigere Leistung & schlechterer Support.

Mit diesen Argumenten war es nicht schwer, den nationalen Stolz hinter sich zu lassen.

Meine Empfehlung: All Inkl

Nach langer Recherche und Vergleiche bin ich seit vielen Jahren glücklicher Kunde bei All Inkl*. Und da ich nicht neidig bin um mein Glück zu teilen, will ich all unsere Kunden an unserer Freude teilhaben lassen. All Inkl bietet im Tarif Privat Plus das beste Preis/Leistungs Paket an.

Lassen Sie sich vom alten Design der Website nicht täuschen.

  • 100GB
  • 5 Domains inklusive
  • SSL Schutz (Website wird als Sicher dargestellt)
  • 1000 Emails Postfächer
  • 50 Kunden pro Server
  • und und und…

Ein wichtiger Punkt, welcher mich eigentlich hauptsächlich dazu getrieben hat den Österreichischen Hoster zu verlassen, war der Support. Es gibt nichts schlimmeres, als wenn man ad hoc eine Lösung für sein Problem benötigt, eine Anfrage Freitagnachmittag gestellt wird und !Dienstag! Mittag erst die Antwort kommt.

Das wäre vielleicht noch in den 90ern durchgegangen, jedoch nicht im Zeitalter, wo Regierungen schneller wechseln, als die Österreichische Nationalmannschaft ihr erstes Tor bekommt.

Und all das für lächerliche ~8€ pro Monat. Sie haben richtig gelesen ...Zwei Krügerln kosten das Gleiche beim Wirten … Und diese können Sie auch nur konsumieren, wenn nicht wieder Lockdown ist.

all inkl
Hoster All Inkl
google pagespeed insights
Gecachte Website
gtmetrix
Nicht gecachte Website

Optimale Ladezeiten durch Caching

Benötige ich Caching?

Eine gecachte Website ist neben einem guten Hoster die effizienteste Maßnahme einer schnelle Website zu bekommen. Ohne dem Zwischenspeichern verschenken Sie massenhaftes Potential der Ladezeit.

Was genau ist Caching?

Cache wird Ihnen vielleicht ein Begriff vom Internetsurfen von Ihrem Browser sein. Sobald Sie einmal eine Internetseite besuchen wird diese in Ihrem Browser Cache gespeichert um beim erneuten Aufrufen die Seite schneller anzeigen zu können. 

Genau wie im Browser wird diese Methode auch bei Websites eingesetzt. Durch das Zwischenspeichern der Website auf dem Server können Besucher die Website schneller angezeigt bekommen, da sich nicht jedesmal beim Aufrufen der Website die Seitenstruktur erneut aufbauen muss.

Was ist wenn sich meine Inhalte ändern?

Berechtigte Frage. Hier zählt die richtige Einstellung. In der Regel sollte man das Caching Plugin genau so einstellen, dass bei einer Änderung der Cache sich erneut aufbaut. Somit vermeidet man, dass eine alte Version der Website dem Besucher angezeigt wird. 

Weiters ist zu beachten, dass wenn ein CDN benutzt wird, diese Daten auch im Caching Plugin hinterlegt sind, damit auch dieser gelöscht und erneut aufgebaut wird.

Ist Caching wirklich effektiv und lohnt es sich für Pagespeed Optimierung?

Ja, ja und nochmals ja. Wenn ich Ihnen nun sage, dass eine Website mit aktiviertem Caching um bis zu 300% schneller dargestellt werden kann können Sie es mir glauben oder nicht. Besser wäre es noch sich selbst davon zu überzeugen.
optimierung
Cloudflare Überblick
Cloudflare Überblick

Optimale Ladezeiten durch Caching

Was genau ist ein CDN und ist Cloudflare die beste Wahl?

Stellen Sie sich vor Sie sind im Ausland und wollen Ihre Liebsten via Smartphone anrufen. Um eine Verbindung dafür aufzubauen muss das Smartphone sich in ein Netz wählen. Gottseidank hat es so viel Hirnschmalz, dass es das unmittelbar nächste Netz nutzt und nicht das Heimische Netz.

Genau so funktioniert ein CDN (Content Delivery Network). Um die Website darzustellen verbindet es sich nicht mit dem Server des Hosters (meistens in der Nähe von Ihrem Zu Hause) sondern nutzt den am naheliegendste Server.

Nicht nur, dass die Anzeige der Website schneller vollbracht ist, bietet ein CDN in der Regel auch noch Schutz gegen DDOS Attacken.

Warum soll ich Cloudflare als CDN wählen?

Kurz und knapp. Weil Preis/Leistung stimmt. Cloudflare bietet diverse Pakete an jedoch reicht in der Regel der kostenlose Plan. Dieser beinhaltet 3 Gratis Regeln. Sie haben richtig gehört es kostet Sie keinen Cent. Mehr zu den Regeln weiter unten.

Update: Es sei erwähnt, dass mit Stand 04.22 Cloudflare dem Urteil nach von Schrems II (Privacy Policy Shield) nicht DSGVO konform ist. Cloudflare selbst ist hier bereits an einer Europäischen Lösung dran. Hier sollte jeder selbst für sich abschätzen, ob der Erweiterte Schutz gegen DDOS Attacken sowie Mehrwert im Bezug der Performance überwiegt.

Quasi nach dem Motto wo kein Kläger da kein Richter oder nach dem Lied "Tango Korrupti" von Reinhard Fendrich.

Wie installiere ich Cloudflare?

Hierfür sollte schon ein wenig technisches Know-How vorhanden sein. Sie müssen die Nameserver Ihrer Domain anpassen und diese mit den Nameservern von Cloudflare ersetzen. Bei All Inkl ist dies genau eine Aufgabe von einer Nachricht an den Support. Bei anderen Hostern können Sie gegebenenfalls die Nameserver selbst editieren.

Weiters gehören noch die DNS Einstellungen angepasst. Diese sollten Sie von Ihrem Hoster erfahren.

Achtung:Beachten Sie bitte, dass mit dem Herumpfuschn falscher Einstellungen Ihre Website gegebenenfalls nicht mehr erreichbar sein kann.
cloudflare cns einstellungen
Cloudflare DNS Einstellungen

Welche sind die besten Einstellungen bei Cloudflare?

Es gibt unzählige Einstellungen bei Cloudflare jedoch haben sich für mich folgende Punkte nach einigen Projekten immer als gut erachtet:

SSL/TLS - Edge Zertifikate

Immer HTTPS verwenden
Sollte Ihr Hoster keine automatische Funktion dafür haben bzw. dies nicht in der htaccess hinterlegt ist, immer aktivieren.

Speed - Optimierung

Auto Minify
JS, CSS & HTML aktivieren um die Dateigröße des Quellcodes zu reduzieren.
Brotli
Aktivieren Sie diese Einstellung um den HTTPS Datenverkehr zu beschleunigen.

Caching - Konfiguration

Browser-Cache-TTL
Legen sie den Zeitraum mit einem Jahr fest. Dadurch wird gewährleistet, dass der Cache ein Jahr lang gespeichert bleibt.
(Optional) Always Online
Sollten Sie öfters Ausfälle haben, könnte diese Option interessant sein. Selbst wenn Ihre Website nicht mehr aufgrund eines technischen Gebrechens erreichbar ist, wird die letzte funktionierende Version angezeigt.

Netzwerk

HTTP/3
Beschleunigt die HTTP Anfrage … Alles was mehr Power bewirkt kann nur gut sein.

Welche Regeln soll ich bei Cloudflare verwenden?

Meiner Meinung nach mitunter einer der wichtigsten Punkte. In der Gratis Version kann man drei Regeln wählen. Bitte die Reihenfolge beachten.
Hier meine Empfehlung:
  1. ihre-domain.at/wp-admin*
    Cache-Level: Umgehen, Sicherheitsstufe: Hoch
  2. ihre-domain.at/*preview=true*
    Cache- Level: Umgehen
  3. ihre-domain.at/*
    Cache-Level: Alles zwischenspeichern, Edge-Cache-TTL: 2419200 Sekunden (längste Möglichkeit)
Was sagen diese Regeln aus?
Der Admin Zugang sowie die Vorschau als eingeloggter Benutzer wird nicht gecached und zwischengespeichert. Weiters hat der Admin Zugang eine erhöhte Sicherheitsstufe. Die Domain wird gecached und der Zwischenspeicher ist auf ein Monat gesetzt bis sich der Cache erneuert.
cloudflare regeln
Empfehlung für Regeln bei Cloudflare
bilder richtig dimensionieren

Bilder optimieren und in modernen Format bereitstellen

Bilder richtig dimensionieren

Ein ziemlich einfacher jedoch sehr effektiver Schritt die Ladezeit zu verbessern ist das Verkleinern / richtige Skalieren der Bilder. Am besten sollte geschaut werden, was die maximale Breite der Website ist, wo das gewählte Bild dargestellt wird. Wenn zB. das Bild in einer Section dargestellt wird, welche maximal 1280 Pixel breit ist, sollte das Bild … na wer weiß es … richtig, 1280 Pixel breit sein.

Was aber wenn das Bild über die ganze Website geht?

Mein Tipp hier ist sich daran zu orientieren, welche Hauptzielgruppe die Besucher sind und von welchem Endgerät die Website besucht wird. In der Regel reicht es die Bilder auf eine Größe von 1920x1080 (Full HD) zu verkleinern.

Das mag bei einem Bild vielleicht nur ein paar Kilobyte sein, jedoch wenn man die Summe aller Bilder betrachtet können schon einige Megabyte eingespart werden.

Wer richtig am Putz hauen will, komprimiert die verkleinerten Bilder noch zusätzlich. Durch den Komprimierungsvorgang können weitere kb eingespart werden. Durch das Komprimieren wird die Bildqualität zwar verschlechtert, jedoch ist dies mit dem bloßen Auge nicht erkennbar … zumindest wenn Sie nicht die Augen von Bravestarr haben.

Als Sahnehäubchen oben drauf sollten Sie die Bilder noch in modernen Format
WebP bereitstellen. Die einfachste Methode ist dies via einem Plugin durchführen zu lassen. Meine Empfehlung ist klar ShortPixel oder über das Caching Plugin Swift Performance Pro. Vorteil im Vergleich zu kostenlosen Plugins ist, dass dieser Vorgang mit nur einem Klick durchzuführen ist.

Bildern explizite Width und Height geben

Um eine Layoutverschiebung (Content/Bilder, welcher beim Nachladen/Rendern einer Seite das Layout verschiebt) zu reduzieren und einen schlechteren CLS Wert zu umgehen sollten Sie Bildern immer eine Breite und Höhe geben. Der Core Web Vitals Test wird es Ihnen danken.

Sollten Sie Swift Performance Pro benutzen gibt es dafür eine Option, dass Width und Height automatisch gesetzt werden.
width und height setzen
Width und Height setzen
Schmäh am Rande für Profis und dies noch werden wollen:
In nur zwei einfachen Schritten können Sie die Bilder Skalierung sowie Komprimierung online selbst durchführen.

Bild skalieren

bild skalieren
Laden Sie einfach das gewünschte Bild hoch und skalieren Sie es nach der benötigen Breite in Pixel. Anschließend laden Sie es runter.
Bild skalieren

Bild komprimieren

bild komprimieren
Nun laden Sie das skalierte Bild hoch und führen die Komprimierung durch. Je nach ursprünglicher Größe ist das Bild um bis zu 50 % verkleinert.
Bild komprimieren

Text während Ladevorgang sichtbar lassen & lokal einbinden

Fonts optimieren

Google stört es, dass Ihr Text während der Webfont-Ladevorgänge nicht sichtbar bleibt?

Nichts leichter als das. Es gibt eine schnelle und eine langsame Methode.

Schnelle & kostenpflichtige Methode

Die schnelle Methode ist via einem Plugin (Swift Performance Pro), die Schriftart automatisch vorzuladen. Weiters können die Fonts simpel lokal eingebunden werden.

Durch zwei Klicks haben sich dieses Probleme in Luft aufgelöst.

Langsame & kostenlose Methode

Die zweite Methode, welche jedoch mehr Zeit in Anspruch nimmt ist nicht weniger Effizient.

Je nach dem ob Sie eine eigene Schrift oder eine Google Font benutzen, müssen diese auf zuerst runtergeladen werden und anschließend via Ftp Zugang auf Ihren Webserver gespeichert werden.

Durch das Hinzufügen folgendes Codes in den Head ( am besten mit einem kostenlosen Plugin. zB.: Insert Headers and Footers) sollte die Font sichtbar bleiben.

<link rel="preload" href="fonts/name-der-font.woff2" as="font" type="font/woff2" crossorigin>

Wohlgemerkt hat das Vorladen einer Font auch den positiven Effekt, dass kein FOUT ( Flash of Unstyled Text - Aufscheinen von nicht gestyltem Text) erzeugt wird.
Webfont-Ladevorgänge nicht sichtbar
Google Pagespeed Insight Webfont-Ladevorgänge nicht sichtbar
Swift Performance Font optimieren
Swift Performance Einstellung zum Font optimieren
font einbinden
Font mit dem Plugin "Insert Headers and Footers" einbinden
shortpixel
Einsparung bei ShortPixel

Auswahl aus der Praxis

Welche Plugins soll ich zum Optimieren der Website verwenden?

Plugins gibt es mittlerweile wie Sand am mehr. Hier kann man ziemlich schnell den Überblick verlieren, welche Plugins sich wirklich auszahlen und welche nicht.

Hier meine Empfehlungen:

Die Besten Plugins zum Optimieren von Bildern

ShortPixel

Seit langem ist ShortPixel schon der Platzhirsch unter den Bildoptimierungs Plugins. In seiner Gratis Version bietet es bereits 300 Bilder pro Monat an. Weiters werden auch moderne Bildformate zur Verfügung gestellt.

Alternative: EWWW Image Optimizer

Via Appsumo kann zur Zeit (Stand 12.21) ein attraktiver Lifetime Deal ergattert werden. Für gerade mal einmalige $99 können 200 GB Traffic verarbeitet werden. Von Lazyload über automatische Erstellung von WebP ist alles dabei. 

Ein richtiges Schnäppchen.

Die Besten Plugins zum Cachen der Website

Swift Performance

Sollten Sie das Bestmögliche rausholen wollen, ist dieses Plugin die erste Wahl. Bereits in der Gratis Version bietet es einen enormen Umfang. 

Wer jedoch auf der Überholspur fahren will, sollte sich die Pro Version mal näher ansehen. Für gerade mal $50 pro Jahr bekommt man etwas geboten, was man seinesgleichens vergeblich sucht.

Meine besonderen Highlights von Swift Performance Pro sind wie folgt:

  • Caching
  • GZIP Komprimierung
  • Bilder Optimierung (kein weiteres Plugin notwendig)
  • Fonts lokal einbinden/Preloaden/Font Display
  • Optimierung von CSS/HTML/JS
  • WooCommerce Optimierung
  • CDN einbinden
  • Plugin Organizer

Ich kann mich nur wiederholen, dieses Plugin ist der Ferrari unter den Optimierungs Plugins. Damit werden die besten Pagespeed Werte erreicht.

Einen kleinen Nachteil gibt es dennoch. Man kann nicht einfach mit einem Klick die optimalen Einstellungen herbei zaubern. Grundwissen ist vorausgesetzt.

Alternative: WP Rocket

Wenn es darum gehen soll mit nur wenig Klicks und kaum Ahnung gute Pagespeed Werte zu erreichen, trumpft der Platzhirsch WP Rocket auf, welches es nur in einer Premium Version von $50 pro Jahr gibt.
swift performance pro Übersicht
Übersicht von Swift Performance Pro
Hilfe bei der Optimierung erforderlich?
Verstehen Sie nach wie vor nur Bahnhof und wollen sich damit nicht beschäftigen aber dennoch eine optimierte Website haben?
Unverbindlich anfragen

Sauber Codiert & nicht zugebloated

Welches Theme ist für einen guten Pagespeed geeignet?

Je schlanker, desto besser. Was damit gemeint ist, dass das Theme nicht aufgebläht sein sollte, sauber codiert und nur wirklich benötigte Funktionen/Javascripte besitzen sollte, welche auch wirklich verwendet werden.

Meine Empfehlungen:

Generate Press

Dieses Theme beinhaltet alles, wenn es darum geht die bestmögliche Performance rauszuholen. Umfangreiche Layouts, Page Builder tauglich, Vorlagen Bibliothek sowie Kompatibilität mit Woocommerce sind nur einige Auszüge, welche Generate Press bieten. Es gibt eine Gratis sowie eine Premium Version. 

Ob die Gratis Version reicht, müssen Sie selbst für sich entscheiden.

Alternative: Custom Theme

Mir ist durchaus bewusst, dass dies absolut nicht Anfängerfreundlich ist und ohne Programmierkenntnisse kaum umzusetzen ist dennoch gehört es erwähnt, dass diese Lösung mitunter die schnellste Methode wäre, wenn ein Theme verwendet werden will.

Ein selbst, sauber codiertes Theme ist mitunter das schnellste, was Sie bekommen können.
generate press
Website von Generate Press
oxygen builder logo

Verzicht auf Theme & Bloat

Page Builder und schnelle Website?

Auf diese Frage gibt es nur eine Antwort. Oxygen Builder.

Kein anderer Page Builder kann Oxygen das Wasser reichen. Nicht nur, dass kein Bloat mitgeladen wird, nein es wird auch noch komplett auf das Theme verzichtet, da dieses deaktiviert wird.

Ich kann nur innigst davon abraten Elementor, Divi, Beaver Builder zu benutzen, wenn Ihnen Pagespeed wichtig ist.

Erfahren Sie mehr warum Oxygen Builder der beste Pagebuilder für WordPress ist.

Pagespeed wegen mobilen Rankingfaktor bei Google

Mobile First & Core Web Vitals

Googles Mobiler Ranking Faktor bekam mit Juli 2019 Einzug. Seit dem Zeitpunkt wurden alle neuen Websites, welche bis dato nicht in den Weiten des Internets vertreten oder von Google nicht indexiert waren, für die Mobile First Indexierung herangezogen. Dies bedeutet, dass die mobile Version der Websites für das Crawlen bei Google genommen wird und nicht mehr die Desktop Version.

März 2021 war geplant, dass die restlichen bestehenden Websites auf Mobile First umgestellt werden. Dies wurde aber von Google bis dato auf unbestimmte Zeit verschoben. Laut John Müller sollte eine komplette Umstellung mit erster Jahreshälfte 2022 passieren.

Was hat Mobile First mit Pagespeed zu tun?

Eigentlich ziemlich viel. In der Regel ist es um einiges schwerer die mobile Version der Website zu optimieren, da viel mehr auf die sogenannten Core Web Vitals, also den Largest Contentful Paint (LCP), First Input Delay (FID) sowie Cumulative Layout Shift (CLS) geachtet werden muss.

generate press
Core Web Vitals Ergebnis
core web vitals
Core Web Vitals

Was genau sind die Core Web Vitals und wie werden sie unterteilt?

Wie bereits erwähnt zieht Google seit dem Einzug der Mobile First Indexierung die Nutzererfahrung für das Ranking heran. Diese wird Core Web Vitals genannt und setzen sich aus folgenden Punkten zusammen:

  • Ladevorgang der Webseite (Largest Contentful Paint)
  • Interaktion eines Besuchers (First Input Delay)
  • Änderungen des Layouts (Cumulative Layout Shift

Mit den Core Web Vitals werden von Google einheitliche Qualitätssignale bereitgestellt, die die Nutzererfahrung einer Webseite widerspiegelt. Seiteninhaber können über die Kennzahlen die Nutzererfahrung einer Webseite einstufen und bewerten.

Auch hier ein kleiner Vergleich aus dem echten Leben. Wer gern einefetzt kann dies nun öffentlich machen und es wird sogar eine Anerkennung gegeben.

Was hat Mobile First mit Pagespeed zu tun?

Eigentlich ziemlich viel. In der Regel ist es um einiges schwerer die mobile Version der Website zu optimieren, da viel mehr auf die sogenannten Core Web Vitals, also den Largest Contentful Paint (LCP), First Input Delay (FID) sowie Cumulative Layout Shift (CLS) geachtet werden muss.

Wichtigsten Fragen & Antworten

FAQ

Folgende Punkte sind essentiell um den Pagespeed der Website zu verbessern:

  • auf unnötige Plugins verzichten
  • aufgeblähte Page Builder meiden
  • schlankes Theme nutzen
  • Medien/Bilder optimieren
  • CDN Netzwerk benutzen
  • Caching Plugin benutzen
  • Font/Schriften lokal einbinden
  • guten Hoster wählen

Entweder durch das Nutzen von kostenfreien Tools von Google Page Speed, GTMetrix & Pingdom oder das Untersuchen via Browser ( Chrome, Edge & Firefox > rechte Maustaste > Netzwerk)

Weil höchstwahrscheinlich einer dieser Punkte zutreffen wird:

  • schlecht codiertes Theme
  • Verwendung eines aufgeblähten Page Builders
  • Medien/Bilder nicht optimiert
  • kein Cache Plugin / nicht richtig eingestellt
  • schlechte Wahl des Hosters

Um dem Besucher das bestmögliche Nutzererlebnis (User Experience kurz UX) zu bieten. In weiterer Folge wird durch zufriedene Besucher Google signalisiert, dass die Website einen Mehrwert besitzt und dementsprechend verbessert sich das Ranking.

oxygen logo

Positive Nutzererfahrung & zufriedene Besucher

Zusammenfassung: Pagespeed Optimierung ist in 2022 unumgänglich

Da sich auch weiterhin alles um eine positive Nutzererfahrung dreht ist es unumgänglich sich nicht mit dem Thema Pagespeed Optimierung zu beschäftigen. Manche Maßnahmen sind geringer, manche sind größer doch am Ende des Tages zählt, wie kann es auch anders sein zufriedene Besucher.

Abermals sei erwähnt, dass es bei der Website Optimierung im Bezug Seitengeschwindigkeit nicht auf den Score des jeweiligen Testtools ankommt, sondern dem Besucher ein befriedigendes Ergebnis zu geben. Wie im echten Leben kommt es auch hier nicht auf die Länge an. Der Besucher sollte mit einem befriedigendem Gefühl Ihre Website wieder verlassen können.

Zu groß wäre die Einbuße, wenn sich potentielle Kunden für den Mitbewerber aufgrund zu langer Ladezeiten/Wartezeiten entscheiden würden.
Kontakt aufnehmen
*Bei diesem Link handelt es sich um einen Affiliate Link. 
cross