WordPress-Performance optimieren: An diesen Schrauben mĂŒssen Sie drehen

Die WordPress-Performance optimieren – immer wieder ein relevanter Punkt bei unseren Kunden: Wie reduziere ich meine Seitenladezeit? Das Internet ist voll von guten RatschlĂ€gen, doch uns als WordPress-Agentur fĂ€llt immer wieder auf, dass bei der Reihenfolge der Maßnahmen oft Planlosigkeit herrscht. Welchen Schritten muss man welche Relevanz zuordnen? Wir versuchen hier etwas Logik in die Reihenfolge der Optimierungen zu bringen, sodass Sie schnell zum gewĂŒnschten Erfolg gelangen.

Erst einmal vorab: Den grĂ¶ĂŸten Gewinn bei der Ladezeit Ihrer WordPress-Seite erreichen Sie mit leicht umzusetzenden Methoden. Sie mĂŒssen sich nicht als erstes von den Google PageSpeed Insights verwirren lassen. Eine Ladezeitoptimierung fĂŒhrt zu einer besseren User Experience und erhöht zudem Ihre Sichtbarkeit bei Google. 

Schneller ist immer besser – zumindest aus der Sicht Ihrer Webseitenbesucher. LĂ€dt Ihre Seite zu langsam, springen Ihre Besucher innerhalb kĂŒrzester Zeit wieder ab. Sie mĂŒssen also Maßnahmen ergreifen, um keine Conversions zu verlieren.

Sebastian Niestroj, Teamleiter WordPress in Heilbronn und Heidelberg

Doch eine schnellere Seitenladezeit ist nicht nur ausschlaggebend, um Ihre Kunden zufriedenzustellen, denn auch Google bezieht sie in das Ranking Ihrer Seite bei den Suchergebnissen mit ein. Ab jetzt zĂ€hlen zu den bestehenden vier sogenannten „Core Web Vitals“ drei weitere hinzu: Die Zeit fĂŒr den gesamten Ladevorgang, die Dauer der InteraktivitĂ€t und die visuelle StabilitĂ€t. Sie sehen also, je lĂ€nger Ihre Kunden auf Ihrer WordPress-Seite bleiben und je besser die Ladezeit, desto besser ist auch Ihr Ranking. DarĂŒber, wie Ihre Internetseite dabei abschneidet, gibt unter anderem die Google Search Console Aufschluss.

Tipp 1: Caching

Hierbei handelt es sich um den wichtigsten Punkt bei Optimierung Ihrer WordPress-Performance ĂŒberhaupt. Chaching heißt, dass Ihre Webseite nicht erst beim Server angefragt werden muss und sich danach in Schritten aufbaut. Ihre Webseite befindet sich in einem Zwischenspeicher, sodass man sie aus diesem direkt fertig gerendert aufrufen kann. Da WordPress nun nicht jedesmal bei einem Aufruf die Seite neu berechnen muss, was auch gerade bei PHP (auf das WordPress basiert) elementar wichtig ist.

Möglichkeit 1: Caching-Plugin
Die meisten Nutzer haben ein Plugin, die man allerdings auch installieren können muss. Es gibt W3 Total Cache oder WP Super Cache – bei beiden ist etwas Programmierarbeit nötig. Gerne sind wir Ihnen als Agentur fĂŒr die Digitalisierung Ihrer Unternehmensprozesse bei der Programmierung behilflich und verbessern gemeinsam Ihre WordPress-Ladezeit.

Möglichkeit 2: Caching ĂŒber Ihren Hoster
Es besteht auch die Möglichkeit ein Caching ĂŒber den Server zu konfigurieren. Hier können Sie dann auf Plugins verzichten.

Tipp 2: Schaffen Sie Ordnung

Wenn Kunden wegen eines Relaunches / Redesigns zu uns kommen, dann fĂ€llt uns bei einer ersten Analyse immer wieder auf, dass die bestehende WordPress-Installation viel zu ĂŒberladen ist. Das bedeutet, es sind Plugins installiert, die nicht wirklich erforderlich sind.

Unsere WordPress-Programmierer rĂ€umen diese Plugins auf, sĂ€ubern das Template und optimieren die Datenbank. Denn: Je weniger Plugins Sie haben, desto schneller ist Ihre WordPress-Seite. Hinsichtlich der WordPress-Plugins ist von besonderer Bedeutung, diese auch zu löschen, nur deaktivieren genĂŒgt nicht. Denn dann wird trotzdem noch PHP-Code ausgefĂŒhrt. Und beschrĂ€nken Sie sich auf ein Theme, man benötigt so gut wie nie mehrere. Dieser Punkt wird ĂŒbrigens nicht in den Insights erwĂ€hnt…

Jetzt WordPress-Performance optimieren!

Verlieren Sie keine User und steigern Sie Ihre Sichtbarkeit in den Suchmaschinen mit professioneller WordPress-Performance-Optimierung. Wir haben die nötigen WordPress-Experten im Haus!

Tipp 3: Optimieren Sie unbedingt Ihre Bilder

Immer wieder gesagt und immer wieder vergessen: Komprimieren Sie Ihre Bilder! Diese machen in den meisten FĂ€llen die grĂ¶ĂŸte Datenmenge einer Webseite aus. Also liegt hier eines der am einfachsten und effektivsten umzusetzenden Potenziale zur Verringerung der Ladezeit Ihrer WordPress-Seite.

Bilder können Sie manuell komprimieren oder aber Sie verwenden ein Compression-Plugin. Ein Plugin komprimiert nicht nur neue Bilder, sondern auch deren Thumbnails und es bedient auch alle vorhandenen Bilder automatisch mit. Neben den bekannten Bildformaten gibt es inzwischen speziell fĂŒr die Verwendung im Web das Format Webp. Bei diesem Format werden Bilder komprimiert und kann damit zwischen 25 – 80% der originalen BildgrĂ¶ĂŸe einsparen. Das Format unterstĂŒtzt verlustfreie Transparenz und Animation, kann aber nur mithilfe von Tools oder Plugins erstellt werden.

Vergleich JPG und WebP

WordPress-Performance-Vergleich Dateityp JPG

Dateityp JPG

Entwickler steigert WordPress-Performance

Dateityp WebP

Eine weitere Möglichkeit, um die WordPress-Ladezeit zu verringern und die WordPress-Performance zu erhöhen ist das sogenannte „Lazy Load“. Hierbei handelt es sich um ein Script, das bewirkt, dass Bilder erst geladen werden, sobald sie in das Sichtfeld des Nutzers kommen. Das heißt: befindet sich ein Bild z.B. direkt ĂŒber dem Footer, der Nutzer verlĂ€sst aber die Seite bevor er dorthin gescrollt hat, dann wird das Bild gar nicht erst geladen. 

Tipp 4: KĂŒmmern Sie sich um CSS und Java Script

Klingt technisch, ist aber eigentlich nicht schwer zu optimieren. Es handelt sich um drei essenzielle Schritte, die Sie hier vornehmen mĂŒssen. Bedenken Sie dabei, dass wir bei diesem Thema von der zweitgrĂ¶ĂŸten Datenmenge auf Ihrer Internetseite nach den Bildern reden.

Fassen Sie zuerst die einzelnen Dateien zusammen, denn das verringert die zu ladenden Dateien und somit auch die der Requests. DafĂŒr gibt es ein Plugin.

Danach sollten Sie den Code reduzieren. Menschen benötigen zum Schreiben und Verstehen des Codes mehr als Computer. Plugins wie „Autoptimize“ können von fĂŒr Menschen lesbaren Code in nur fĂŒr Maschinen lesbaren Code umwandeln und Ihre WordPress-Performance erhöhen.

Tipp 5: Komprimieren der Datenpakete

Die Datenpakete, die Sie an den Browser Ihrer Webseitenbesucher senden, sollten möglichst klein sein. DafĂŒr muss Ihr Server die GrĂ¶ĂŸe der Datei bei einem Request minimieren, bevor der Browser die Daten entpackt und berechnet. Dies gibt Ihnen nochmals einen „Boost“ Ihrer Seitenladezeit.

Sie können dies ĂŒber Caching-Plugins einrichten, es gibt manuelle Möglichkeiten oder Ihr Hoster hat das schon in seinen ServeraktivitĂ€ten hinterlegt. An dieser Stelle können wir versichern, dass Sie schon die entscheidendsten Schritte fĂŒr eine deutlich bessere WordPress-Performance unternommen haben.

Tipp 6: PrĂŒfen Sie Ihr Hosting

Wenn Sie die oben erwĂ€hnten Schritte alle unternommen haben und Ihre Geschwindigkeit immer noch zu wĂŒnschen ĂŒbrig lĂ€sst, dann könnte das an Ihrem Hosting liegen. Und zwar daran, dass Ihr Hoster es nicht möglich machen kann, WordPress zu optimieren. Achten Sie fĂŒr performantes Hosten auf die aktuelle PHP-Version, auf ein PHP Memory-Limit von mindestens 64 MB, darauf, dass das Rechenzentrum in Deutschland liegt und Ihnen eine SSD-Festplatte zur VerfĂŒgung steht sowie ein kostenloses SSL-Zertifikat und HTTP/2.

Tipp 7: Falsche Ladereihenfolge

Bei den Google PageSpeed Insights wird immer wieder auf eine Reihenfolge beim Laden hingewiesen, die das Rendern ausbremst. Beispielsweise entsteht ein Slider durch Bilder, die mit einem Animationsbefehl zum Rotieren gebracht werden. Falls nun zuerst der Befehl vor den Bildern erscheint, ist der Slider zuerst als Funktion ohne Bilder angelegt. Tauschen Sie hier die Reihenfolge.

Wir optieren Ihre WordPress-Performance!

Unsere WordPress-Experten analysieren Ihre Webseite, definieren die nötigen Maßnahmen und optimieren Ihre Seitenladezeit. Fragen Sie jetzt an und gemeinsam optimieren wir Ihre Webseite!

Tipp 8: Optimieren der gefĂŒhlten Ladezeit

Zwischen der tatsĂ€chlichen Ladezeit und der Zeit, in der der Besucher die Seite wahrnimmt, können kleine Tricks den Eindruck beschleunigen, dass die Seite schon geladen ist, im Hintergrund aber noch fleißig gerechnet wird. Optimieren Sie „Above th Fold“, d. h., dass der erste sichtbare Bereich mit priorisierten Inhalten und Funktionen punktet.

Tipp 9: Zu große Datenbank

Auch eine Datenbank kann zu groß werden und die Performance Ihrer WordPress-Seite ausbremsen. Mit dem Plugin WP-Optimize haben Sie Ihre Datenbank im Griff.

Tipp 10: Verhindern Sie Hotlinking

Wenn irgendjemand auf ein Bild verlinkt, das auf Ihrem Server liegt und quasi Ihre Bandbreite klaut, oder auch pdf-Dateien von Ihnen verlinkt, dann nennt man das Hotlinking. Dies können Sie durch bestimmt Blockaden, die Sie in Ihren Code schreiben, verhindern.

Es geht bei der Optimierung Ihrer Seitenladezeit hauptsĂ€chlich um eine Reduktion der WebseitengrĂ¶ĂŸe, des HTTP-Requests, eine Komprimierung der Datenpakete und last but not least um die Optimierung Ihrer User Experience. Doch wie können Sie Optimierungspunkte an Ihrer Webseite ganz scnhell und einfach erkennen? Wir verraten es Ihnen.

Das Wasserfalldiagramm: Analysieren Sie Ihre Webseite in einfachen und schnellen Schritten

FĂŒr die Optimierung Ihrer WordPress-Performance gibt es natĂŒrlich Google PageSpeed Insights und Co. Doch wir schauen heute genauer hin, da öfter Seiten, die perfekt optimiert scheinen, doch noch verstecktes Potenzial haben.

Der Markt liefert ganz hervorragende Performance-Tools, die Ihnen in kĂŒrzester Zeit genau aufzeigen können, wo Sie noch Luft nach oben haben. Die Google-Tools Test My Site oder Google PageSpeed Insights geben Ihnen bei der Analyse umfangreiche HandlungsvorschlĂ€ge. Allerdings muss man wissen, wie diese Tools anzuwenden sind und wonach man sich auf die Suche begeben muss.

Nicht mit Erfindungen, sondern mit Verbesserungen macht man Vermögen.

Henry Ford

Wasserfalldiagramm

Wenn man WordPress-Seiten sinnvoll optimieren möchte, dann sollten Sie sich mit den einzelnen Ladezeiten der Unterseiten oder auch Landingpages beschĂ€ftigen. FĂŒr die Informationen, wie Ihr Blog, Ihr Shop oder Ihre Unternehmensseite performt, sind beispielsweise die Tools GTMetrix, Webpagetest oder Pingdom relevant. Diese Tools beinhalten ein sogenanntes Wasserfalldiagramm, das leider nicht viel Beachtung findet, aber ganz interessante und nĂŒtzliche Informationen ausgibt. Inzwischen werden dort auch die CoreWeb Vitals bewertet.

Nichts kann so gut aufzeigen, wie gut Ihr Hoster ist, wie schnell Ihre Seite lÀdt und wo genau der Hase im Pfeffer liegt.

Wenn Sie Ihre Optimierungsmaßnahmen bis dato auf Ihr Caching, Ihre Bildoptimierung, das Komprimieren von CSS und JavaScript und Ihr Hosting ausgelegt haben oder schon auf CDN migriert sind, dann haben Sie schon eine gute Grundlage fĂŒr Ihre WordPress-Performance. Doch glauben Sie uns, es gibt versteckte Fallstricke. Hier kommt nun das Wasserfalldiagramm ins Spiel. Denn dieses zeigt genau auf, wie Ihre Seite und vor allem die einzelnen Elemente laden und wie schnell das geht. Wir empfehlen und beschreiben auch am Beispiel von Webpagetest.

Bewertung der WordPress-Performance ĂŒber Wasserfall-Diagramm

Wasserfall-Diagramm von GTmetrix zur Aufdeckung der WordPress-Performance

Wie lesen Sie ein Wasserfalldiagramm?

Ein Wasserfalldiagramm fĂŒttert Sie geballt mit Informationen und erscheint fĂŒr Neulinge im ersten Moment recht unĂŒbersichtlich. Doch so schwer ist es gar nicht. Man muss vier Sachen verstehen, um hinter die DatensĂ€tze schauen zu können:

X-Achse

Ein Wasserfalldiagramm besitzt einen chronologischen Aufbau. Die X-Achse zeigt auf, wann genau ein Element mit dem Laden beginnt und welche Zeit es dafĂŒr benötigt. Somit wissen Sie genau, wo Ihnen Ihre Performance verloren geht. Parallel wissen Sie, wo genau auf der Seite nun Optimierungsbedarf besteht. Die X-Achse sollte den Wert 10 nicht ĂŒberschreiten.

Y-Achse

Die Y-Achse hÀlt jeden HTTP-Request fest. Hier gibt es oft die Möglichkeit, das man die einzelnen Elemente anklicken kann, um an detailliertere Informationen zu kommen.

Legende

Hier erhalten Sie die Auskunft, welcher Ressourcen-Typ geladen wurde. Manche Plugins benutzen hierfĂŒr Symbole, mache unterscheiden farblich.

Codiersystem

Wie die einzelnen Anfragen ausgefĂŒhrt werden, darĂŒber erhalten Sie Aufschluss ĂŒber ein zusĂ€tzliches Codiersystem. Das weist unter anderem aus, wie lange Ihre Seite benötigt, um sich mit dem Server zu verbinden. Sie erfahren auch, ob HTTPS angewendet wird.

Sie benötigen UnterstĂŒtzung?

Unsere Spezialisten stehen Ihnen gerne beratend zur Seite. Sie möchten Ihre Webseite ganz in die HÀnden von Experten geben? Das machen wir!

7 Erkenntnisse und Hacks zur Performancesteigerung

1. Anzahl der Anfragen

Umso mehr Elemente auf Ihrer Y-Achse erscheinen, desto mehr Anfragen. Diese machen Ihre Seite langsamer. Nun mĂŒssen Sie ĂŒberlegen, auf welche Features Sie nicht verzichten können. Auch HTTP/2 ist mitverantwortlich, dass die Anzahl nicht allein ausschlaggebend ist, denn hier können Requests parallel bearbeitet werden und Ihr Server sendet HTML-Dateien an den Browser. FĂŒr diese Vorteile mĂŒssen Sie allerdings ein SSL-Zertikikat besitzen.

Über den Daumen gepeilt kann man als OrientierungsgrĂ¶ĂŸe sagen, dass ab 100 aufgelisteten Requests Optimierungspotenzial besteht.

2. TatsÀchliche Ladezeit

Wenn Sie Ihre X-Achse betrachten, gibt Ihnen der grĂ¶ĂŸte ausgewiesene Wert Aufschluss. Dieser zeigt Ihnen genau die Zeit auf, die Ihre Webseite benötigt, um komplett gerendert zu sein. Hier geben wir Ihnen den Richtwert, dass ab einer maximalen AusprĂ€gung von 10 Ihre Seite zu langsam lĂ€dt. Bringen Sie den Wert unter 10.

3. GefĂŒhlte Ladezeit

Es gibt einen Unterschied zwischen der tatsĂ€chlichen und gefĂŒhlten Ladezeit. Und genau auf diese kommt es Ihren Nutzern an. Also mĂŒssen Sie auch auf das GefĂŒhl der Besucher RĂŒcksicht nehmen. TatsĂ€chlich können Sie auch dieses GefĂŒhl optimieren. Voraussetzung bildet hier ein optimales Caching oder eine Above-the-Fold-Optimierung, aber auch das Wasserfalldiagramm kann eine Unterscheidung zwischen der tatsĂ€chlichen und der gefĂŒhlten Ladezeit Ihrer WordPress-Seite treffen. Diese finden Sie versteckt zwischen den blauen und grĂŒnen Linien in Ihrem Wasserfalldiagramm.

Wenn das erste visuelle Element auf Ihrer Seite geladen ist, sehen Sie das an der grĂŒnen Linie. Die blaue Linie gibt an, wann Ihr Besucher die Seite als komplett geladen wahrnimmt. Hat er das Laden quasi durchgehalten, haben Sie eine vielfach höhere Wahrscheinlichkeit, dass der Besucher mit Ihrer WordPress-Seite kommuniziert. Das heißt also, dass die Linien möglichst links liegen und der Abstand dazwischen idealerweise gering ist.

4. Vorteil von HTTP/2 zu HTTP/1

HTTP/2 hat den entscheidenden Vorteil wesentlich schneller zu laden. Voraussetzung ist, dass Ihr Hoster dieses auch bereitstellt. Hier herrscht oft Unklarheit bei den Webseitenbetreibern. Ein Trumpf von HTTP/2 ist, dass es mehrere Anfragen gleichzeitig bearbeiten kann. Und genau diese sind im Diagramm zu erkennen, indem hier mehrere Balken am gleichen Punkt der X-Achse erscheinen.

WordPress-Performance-Optimierung fĂŒr mehr Erfolg

Mehr als 10 Jahre Erfahrung, spezialisierten WordPress-Entwickler & Online-Marketing-Spezialisten – Wir fĂŒhren Ihre Webseite zum Erfolg.
Jetzt kontaktieren fĂŒr mehr Leads und messbaren Erfolg.

5. Trotz WordPress-Optimierungen: Bilder oft noch zu groß

Bei ungefĂ€hr 30 Prozent aller Webseiten besteht noch Potenzial im Optimieren der Bilder, auch wenn man davon ausgeht, hier schon alles in die Wege geleitet zu haben kann die WordPress-Performance verbessert werden. Doch Bilder sind neben dem Caching hauptentscheidend fĂŒr die Ladezeit Ihrer WordPress-Seite. Wenn Sie ein Bild hochladen, dann legt WordPress weitere Dateien an (Thumbnails oder Featured Images). WordPress bietet eine Reihe Bildoptimierungs-Plugins. Das Wasserfalldiagramm zeigt Ihnen eine ĂŒbermĂ€ĂŸige Ladezeit (Webpagetest) mit violetten Balken an. Sind hier jetzt hier ein oder mehrere der Balken lĂ€nger, dann ist hier deutlich, dass Sie optimieren / komprimieren mĂŒssen, um Ihre Seitenladezeit zu verringern.

6. Wohin gehen Ihre Weiterleitungen?

Ein Wasserfalldiagramm gibt Ihnen Aufschluss darĂŒber, wie viele Weiterleitungen Sie eingerichtet haben und wo diese hinweisen. Denn Anfragen mit Weiterleitungen werden farblich akzentuiert. Sie sehen also, wie viele Weiterleitungen sie eingerichtet haben und wohin diese fĂŒhren. Weiterleitungen werden gelb angezeigt und Sie können hier nicht nötige oder auch schĂ€dliche Weiterleitungen aufspĂŒren.

7. Fehler auf einen Blick erkennen

Alles, was im Diagramm rot erscheint, weist einen Fehler aus. Das mag sein, wenn manche Elemente nicht richtig gerendert sind, beispielsweise AdSense Frames oder eventuell auch Karten auf der Webseite oder sogar Schriften. Das Diagramm sagt Ihnen auch genau, welcher Fehler im Spiel ist und wo er entsteht.

Fazit in KĂŒrze

  • Ist Ihr Diagramm zu lang, d. h. ĂŒber 100 Anfragen?
  • Weist Ihre X-Achse ein Maximum ĂŒber 10 aus?
  • Anfragen können ĂŒber HTTP/2 parallel geladen werden?
  • Haben Sie noch schlecht komprimierte Bilder?
  • Befindet sich die blaue Linie zu weit rechts?
  • Sind die blaue und die grĂŒne Linie zu weit auseinander?
  • Tauchen gelbe Zeilen fĂŒr schlechte Weiterleitungen auf?
  • Haben Sie rot angezeigte direkte Fehlermeldungen?

Ein Wasserfalldiagramm kann Ihnen dabei helfen, Ihre WordPress-Webseite schnell auf ihren Optimierungsbedarf zu testen und auch dabei, wertvolles Potenzial zu erkennen und umzusetzen. Ihre WordPress-Webseite hat Optimierungsbedarf? Dann sind wir Ihr Ansprechpartner. Als WordPress-Agentur mit ĂŒber 10 Jahren Erfahrung in der Entwicklung neuer und Optimierung bestehender WordPress-Webseiten sind wir Ihre Experten.

0 Kommentare

Beitrag kommentieren

Wir freuen uns auf Ihr Feedback!

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.

Diesen Beitrag bewerten