Die vierte Woche stand ganz im Zeichen von Optimierungen und Anpassungen.
Dabei habe ich mich vor allem der Ladezeit gewidmet, da diese noch sehr schlecht war. Im Folgenden gehe ich darauf ein, was ich optimiert habe, welche Plugins ich nutze und wie sich das auf die Ladezeit ausgewirkt hat.
Zudem habe ich mich um den Footer und neue Inhalte gekümmert.
Nischenseiten-Challenge Hauptquartier
Rückblick Woche 4: Ladezeit und mehr
Leider hat mich in der letzten Woche eine Erkältung erwischt. Ab Mitte der Woche war ich etwas angeschlagen und nicht so produktiv, wie ich das gern gewesen wäre.
Allerdings habe ich dennoch das geschafft, was ich mir vorgenommen hatte, was auch daran lag, dass ich auf bewährte Plugins zurückgegriffen habe.
Ladezeit-Optimierung
Als erstes stand auf meiner Liste eine Optimierung der Ladezeit. Nach der Installation des Themes und ohne sonstige Optimierungen war die Performance ziemlich schlecht.
Da ich aus meiner Erfahrung sagen kann, dass eine gute Ladezeit sowohl bei den Rankings in Google, als auch bei den Einnahmen hilft, war mir die Ladezeit-Optimierung natürlich wichtig.
Vor der Optimierung
Ich habe mit Hilfe von 3 Online-Tools ein paar Werte ermittelt, die zeigen, dass die Ladezeit wirklich schlecht war und damit nicht nur bei Google durchaus Nachteile bringen könnte, sondern auch sicher einige Besucher kosten wird.
PageSpeed Insights
Dieses Google-Tool erstellt eine Gesamtbewertung für die mobile Ansicht und die Desktop-Version. Beide hatten vor der Optimierung sehr schlechte Werte. Man sollte mindestens 80 Punkte erreichen.
Hier die Werte für die Startseite und einen Artikel:
Mobile Bewertung | Desktop Bewertung |
44 / 100 | 52 / 100 |
44 / 100 | 51 / 100 |
Das zeigt auch dieser Screenshot, wo Google dann auch einige Probleme aufgelistet hat.
Pingdom
Das zweite Tool misst ebenfalls die Ladezeit und erstellt daraus ein sogenanntes Waterfall-Diagramm, an dem man sehen kann, welche Elemente wie lange laden. Zudem ermittelt es auch ein paar Gesamtwerte.
Hier die Werte für die Startseite und einen Artikel:
Performance Grade | Website ist schneller als … | Ladezeit | Seitengröße | Requests |
85 / 100 | 83% aller Websites | 1,4s | 1,6 MB | 33 |
83 / 100 | 74% aller Websites | 1,91s | 1,4 MB | 34 |
Die Gesamtperformance sieht zwar nicht so schlecht aus, aber die Seite ist zu groß und die Ladezeit könnte deutlich besser sein.
GTMetrix
GTMetrix ist ein sehr gutes Tool zur Ladezeiten-Analyse, welches detaillierte Auswertung mitbringt und genau anzeigt, an welcher Stelle was optimiert werden sollte.
Hier die Gesamtwerte für die Startseite und einen Artikel:
Pagespeed | YSlow | Ladezeit | Seitengröße | Requests |
35% | 75% | 3,9s | 1,18 MB | 27 |
50% | 74% | 3,8s | 1,45 MB | 34 |
Auch hier ist die Bewertung der Ladezeit sehr schlecht. Die hohen Ladezeiten kommt dadurch zustande, dass der Test von Amerika durchgeführt wird. Aber als Ausgangswert vor der Optimierung ist das genauso hilfreich.
Was habe ich gemacht?
Eigentlich gar nicht so viel.
Die Tools haben vor allem die folgenden Punkte bemängelt:
- Fehlende Komprimierung
Die HTML-Datei insgesamt ist nicht komprimiert. Es fehlt also die gzip-Komprimierung. - Blockierende JavaScript- und CSS-Dateien
Im Header werden alle JavaScript- und CSS-Dateien geladen, was natürlich erstmal dauert. - Script-Größen reduzieren
Zudem waren diesen JavaScript- und CSS-Dateien nicht komprimiert. - Browser-Caching nicht aktiviert
Es gibt grundsätzliche Einstellungen in der .htaccess Datei, mit denen der Browser die Elemente einer Website länger speichert, damit sie nicht bei jedem Seitenaufruf neu heruntergeladen werden müssen.
Das sind eigentlich gar nicht so viele Probleme und relativ leicht durch Plugins zu beheben.
Ich habe deshalb diese Plugins installiert und eingerichtet:
- WP Fastest Cache
Das ist ein Caching-Plugin, welches unter anderem die gzip Komprimierung mitbringt und auch Möglichkeiten zur JS und CSS Komprimierung anbietet. - WP Minify Fix
Für die Komprimierung der CSS und JavaScript Dateien habe ich aber lieber auf dieses Plugin gesetzt, da es diese zuverlässig zusammenfasst und komprimiert, was der Ladezeit sehr hilft. Zudem optimiert es den HTML-Code. - Scripts to Footer
Mit Hilfe dieses Plugins habe ich dann die meisten die JS- und CSS-Dateien vom Header in den Footer verschoben. Damit bremsen diese nicht mehr das Laden der Seiten.
Ich hätte natürlich lieber nur ein Plugin genutzt als 3, aber nach etwas herumprobieren hat sich das als die beste Kombination herausgestellt.
Eine weitere Sache habe ich noch gemacht. Ich habe die neue WP Emoji Funktion in der functions.php deaktiviert. Das sind nur zusätzlich Scripte für eine Funktion, die ich überflüssig finde.
Nach der Optimierung
Im folgenden seht ihr, was die Optimierung gebracht hat.
PageSpeed Insights
Ich konnte fast alle angezeigten Probleme beheben und sehr gute Werte erreichen.
Hier wieder die Werte für die Startseite und einen Artikel:
Mobile Bewertung | Desktop Bewertung |
84 / 100 | 94 / 100 |
84 / 100 | 91 / 100 |
Das sind für mich völlig ausreichende Werte. Ich brauche keine 100%.
Das zeigt auch dieser Screenshot, wie die Desktop-Analyse nach der Optimierung aussah:
Hier werden nur noch wenige Scripte im Header bemängelt und beim Browsercaching betrifft dies nur noch das Analytics-Script.
Pingdom
Bei Pingdom waren die Verbesserungen in der Ladezeiten ebenfalls deutlich sichtbar.
Hier die Werte für die Startseite und einen Artikel:
Performance Grade | Website ist schneller als … | Ladezeit | Seitengröße | Requests |
88 / 100 | 96% aller Websites | 573ms | 638 kb | 16 |
88 / 100 | 95% aller Websites | 699ms | 749 kb | 20 |
Die Ladezeit hat sich deutlich verbessert und ist nun nur noch ein Drittel so lang. Ebenso deutlich besser ist die Seitengröße und die Requests sind ebenfalls deutlich weniger geworden.
GTMetrix
Und auch die Auswertung mit diesem Tool hat nun deutlich bessere Werte gebracht.
Hier die Gesamtwerte für die Startseite und einen Artikel:
Pagespeed | YSlow | Ladezeit | Seitengröße | Requests |
96% | 94% | 2,0s | 632 kb | 15 |
94% | 94% | 2,0s | 742 kb | 19 |
Die Pagespeed und YSlow Bewertung ist nahe am Maximum und die Seitengrößen und Requests konnte deutlich reduziert werden. Auch die Ladezeit aus den USA wurde halbiert.
Fazit nach der Ladezeit-Optimierung
Durch ein paar Plugins konnte ich die Werte deutlich verbessern und bin mit dem Ergebnis mehr als zufrieden, gerade für eine solch bilderlastige Nischenwebsite.
Man sollte sich also auf jeden Fall um die Ladezeitoptimierung kümmern, da dies relativ einfach und schnell umzusetzen ist.
Footer
Sehr schnell ging die Gestaltung des Footers. Hier habe ich mich nicht groß aufgehalten und einfach die Widgets mit den letzten Artikel, den Kategorien und den Seiten gefüllt.
Evtl. werde ich später nochmal den Footer etwas mehr optimieren, aber aktuell reicht das völlig aus.
Neue Inhalte
Zu guter Letzt habe ich 2 neue Artikel verfasst.
Zum einen ist das ein allgemeiner Artikel über wichtige Orte auf der Halbinsel Jandia mit ein paar Infos über diese. Später plane ich dann noch zu jedem Ort einen extra Artikel. Zum anderen habe ich einen Reisetipp über Sommer- und Winter-Urlaube auf Jandia bzw. Fuerteventura verfasst.
Nach und nach werden weitere Artikel erscheinen.
Stunden, Einnahmen und Ausgaben
Diese 3 Dinge haben mich insgesamt 4 Stunden in der letzten Woche gekostet. Es war also insgesamt wirklich recht schnell erledigt.
Kosten sind diesmal keine hinzugekommen und Einnahmen habe ich auch noch nicht, da ich mit der Monetarisierung noch nicht begonnen habe.
investierte Stunden (Woche/Insgesamt) | 4 Stunden | 17 Stunden |
Ausgaben (Woche/Insgesamt) | 0,- Euro | 89,03 Euro |
Einnahmen (Woche/Insgesamt) | 0,- Euro | 0,- Euro |
Weitere Teilnehmer und ihre Reports
Auf nischenseiten-guide.de findet ihr die Wochenreports vieler weiterer Teilnehmer der Nischenseiten-Challenge 2016.
Mehr als 250 Teilnehmer veröffentlichen dort eine Menge Praxis-Einblicke und Erfahrungen in den 13 Wochen der Challenge.
- Danke für 16 tolle Jahre - 13. Juli 2023
- So erstellst du deine erste Newsletter-Mail in 10 Schritten mit CleverReach - 13. Juli 2023
- Die 5 besten Features des Amazon Affiliate WordPress Plugin – AAWP - 12. Juli 2023
Was ich neben den deaktivieren der Emojis noch empfehlen kann, ist die Rest API und die Header-Einträge zu entfernen, wenn selbige nicht benötigt werden. Außerdem integrieren die neuen Embeds immer eine “wp-embed.min.js”, die du ebenfalls entfernen kannst, wenn du sie nicht benötigst.
Ansonsten würde ich darüber nachdenken jQuery herauszuschneiden, da ich auf den ersten Blick gar nicht sehe wozu ein Framework wie jQuery genau nötig wäre. Ohne wäre die Seite aber deutlich flotter unterwegs.
Wer jetzt angestachelt ist und noch mehr machen will, darf mal bei mir vorbeischauen. Dort gibts ne Menge Tipps für Optimierungswütige 🙂 …um nicht zu sagen alle Tipps die bei WordPress Sinn ergeben.
http://fastwp.de/wordpress-performance/
Hi Per, interessanter Artikel. Ich finde das Thema immer recht schwierig, da ich mich mit der technischen Seite (Programmierung) nicht sonderlich gut auskenne. Da bin ich für jedes Plugin, dass mir hilft dankbar.
VG
Sebastian
Hallo Peer,
ich habe gerade mal meine Seiten überprüft, die Fallen alle sehr schlecht aus. Vorallem im Mobilen Ansicht sind meine Seiten unter der 50 bis 70% Marke. Ich hatte mir daher bisher keine Gedanken gemacht. Deshlab werde ich mir das für diese Woche auf meine Todo-Liste aufnehmen.
Schöne Grüße
Metin
Da sieht man auch immer wieder wie schnell sich einige Dinge optimieren lassen 😉
Leider habe ich noch keine Lösung für das VG-Wort Plugin gefunden…
Gibt es da eine Möglichkeit?
Peer, nutzt du das Plugin nicht auch noch und hast das mal gelöst?
Was genau meinst du? Hast du ein Ladezeit-Problem mit einem VG Wort Problem?
Genau, ich nutze dieses Plugin:
Prosodia VGW OS für Zählmarken (VG WORT)
Als Meldung wird mir dann immer angezeigt:
vgwort.de/blank.gif (Ablaufdatum nicht festgelegt)
Aber wie kann ich das lösen. Das bleibt immer bestehen. Es ist ja eine externe Quelle. Darf ich da überhaupt etwas cachen und wenn ja, wie?
Da kann ich dir bei dem Plugin auch nicht helfen, da ich es nicht nutze. Aber wie oben geschrieben, muss man keine 100% erreichen. Wenn bei mir 1-2 Ressourcen nicht gecached werden, ist mir das egal.
Ich würde mir da auch keine Gedanken machen. Dann gibt es halt eine Ressource und an dieser Stelle muss man auch sagen, dass die Heuristik von Google schwerwiegende “Verstöße” nicht von “leichten” unterscheiden kann:
Bei der Datei handelt es sich wahrscheinlich um eine kleine transparente Grafik von 1×1 Pixeln. Die ist verschwindend gering, was die Dateigröße angeht und wenn die nicht gecached ist, dann ist es halt so. Performanceeinbußen würde ich nicht erwarten.
Schlimmer wäre ein wirklich großes Bild, dass nicht gecached wird.
Aktuell steht da eh ein 307 Temp. Redirect hinter.
Hallo Peer, das “Scripts to Footer” brauchst du eigentlich nicht. Das bringt doch WP-Minifiy-Fix schon mit. In den Experten-Einstellungen wechseln und ein Häkchen setzen.
Nach meinen Erfahrungen funktioniert das mit Scripts to Footer besser.
Hallo Peer,
mich würde interessieren, was du für welche detailierten Einstellungen bei den 3 Plugins WP Fastest Cache, WP Minify Fix und dem YOAST Seo tätigst, um eine guten Pagespeed und ein gute SEO Technische Performance bekommst. Es muss nicht 100% sein, sondern ich bin der gleichen Meinung wie du, dass man eine 80% gute / 20% weniger gute Einstellung einen voran bringen. Aber mit diesen drei Plugins habe ich kaum Erfahrung. Und meinem eigenen Blog habe ich, dass ausprobiert, sodass das sogar negative Bewertungen bei der Analyse auf Google PageSpeed gebracht hat 🙁
Kannst du mir da weiterhelfen oder auf eine Quelle hinweisen?
Schöne Grüße
Metin
Hallo Peer,
ich habe die drei Plugins WP Fastest Cache, WP Minify Fix und Scripts to Footer alle drei geladen und die Werte bei Google Pagespeed und Pingdom konnten sich verbessern.
Das Plugin WP Minify Fix musste ich löschen, da das Review Plugin nicht mehr richtig angezeigt wurde. Das hatte aber auch keine Auswirkung auf die Ergebnisse.
Mobile bin ich nun bei 79 und auf dem Desktop erreiche ich 91, ich denke, dass das in Ordnung ist.
Hallo Peer,
wie immer ein guter Beitrag. Erst einmal möchte ich ein riesen Lob an deine Blogs aussprechen. Die sind wirklich sehr informativ und auch sehr gut zu lesen.
Ich habe deine Plugins mal ausprobiert und festgestellt, dass das WP Fastest Cache Plugin nicht bei WordPress multisite läuft. Hast du hierzu vielleicht eine gute Alternative?
Phantastischer, extrem hilfreicher Artikel für die Ladezeit-Optimierung.
Perfekt recherchierte und verständliche sowie nachvollziehbare Tipps, die enorm weiterhelfen.
Danke!!!