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: 11.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 deine Besucher.

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

Stell dir vor du stehst bei der Kassa im Supermarkt und der Kunde vor dir hat vergessen seine Bananen abzuwiegen ...Richtig, deine Kabeln/Krampfadern werden ersichtlich.

Genau so geht es den Besuchern deiner Webseite, wenn sie mit Ladezeiten zu kämpfen haben.  

Inhaltsverzeichnis

Teste die Geschwindigkeit deiner Website

Gründe

Warum ist das Optimieren der Website wichtig?

Aus folgenden zwei Gründen:

  1. um Nutzererlebnis / Nutzererfahrung deiner 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.

Versetze dich einfach in deine eigene Lage.

Wenn du eine Webseite besuchst, willst du 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 musst.

Genau so geht es auch deinen Besuchern/Kunden.

Es würde nichts schlimmeres geben als wenn deine Besucher genervt aufgrund zu langer Ladezeit/Wartezeit auf die Webseite von deinen 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 deiner 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 kannst du mittels rechter Maustaste / Untersuchen bzw. in Chrome mittels F12 Taste(Windows) im Entwicklertool den Reiter “Netzwerk”/”Netzwerkanalyse” aufrufen. Nach erneutem Aufrufen der Seite bzw. drücken der F5 Taste(Windows) bzw. Command+R (Mac) siehst du in einem Wasserfalldiagramm die genaue Daten über den Ladevorgang.

Unterschieden werden die Dateien in HTML, CSS, JS, Bilder sowie Schriften.
untersuchen der website in chrome mit netzwerkansicht (1)
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 deinen Besuchern sowie beim Ranking deiner 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 dir 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.

Lass dich nicht vom alten Design der Website 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 kannst du 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 verschenkst du massenhaftes Potential der Ladezeit.

Was genau ist Caching?

Cache wird dir vielleicht ein Begriff vom Internetsurfen von deinem Browser sein. Sobald du einmal eine Internetseite besuchst, wird diese in deinem 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 jedes mal 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 dir nun sage, dass eine Website mit aktiviertem Caching um bis zu 300% schneller dargestellt werden kann, kannst du es mir glauben oder auch nicht. Besser wäre es noch sich selbst davon zu überzeugen.
optimierung
Cloudflare Überblick
Cloudflare Überblick

Infos über CDNs

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

Stell dir vor du bist im Ausland und willst deine 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 deinem" 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. Du hast richtig gehört es kostet dich 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. Du musst die Nameserver deiner 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 kannst du gegebenenfalls die Nameserver selbst editieren.

Weiters gehören noch die DNS Einstellungen angepasst. Diese solltest du von deinem Hoster erfahren.

Achtung: Beachte bitte, dass mit dem Herumpfuschn falscher Einstellungen deine 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 dein 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
Aktiviere diese Einstellung um den HTTPS Datenverkehr zu beschleunigen.

Caching - Konfiguration

Browser-Cache-TTL
Lege den Zeitraum mit einem Jahr fest. Dadurch wird gewährleistet, dass der Cache ein Jahr lang gespeichert bleibt.
(Optional) Always Online
Solltest du öfters Ausfälle haben, könnte diese Option interessant sein. Selbst wenn deine 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. deine-domain.at/wp-admin*
    Cache-Level: Umgehen, Sicherheitsstufe: Hoch
  2. deine-domain.at/*preview=true*
    Cache- Level: Umgehen
  3. deine-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 du nicht die Augen von Bravestarr hast.

Als Sahnehäubchen oben drauf solltest du die Bilder noch inmmodernen 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 dir danken.

Solltest du 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
Lade einfach das gewünschte Bild hoch und skaliere es nach der benötigen Breite in Pixel. Anschließend ladest du es runter.
Bild skalieren

Bild komprimieren

bild komprimieren
Nun ladest du das skalierte Bild hoch und führst 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, welche DSGVO konform ist

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

Nach aktuellen Vorkommnissen (September 2022)  ist dies auch zu empfehlen, da diverse Abmahnanwälte ihr Unwesen treiben und Webseitenbetreiber aufgrund der nicht DSGVO konformen Variante abmahnen.

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 du eine eigene Schrift oder eine Google Font benutzt, müssen diese auf zuerst runtergeladen werden und anschließend via Ftp Zugang auf deinen 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

Solltest du 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 seinesgleichen 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?
Verstehst du nach wie vor nur Bahnhof und willst dich 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, musst du selbst für dich 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. 
Back to top
cross