Pagespeed Optimierung
Ich habe mir das Buch Pagespeed Optimierung von Gregor Meier angesehen und analysiert in wie weit die dort vorgestellten Maßnahmen zum Erfolg führen. Ich habe bereits in einem früheren Artikel darüber berichtet wie ich diesen Blog für die Google Page Insights Wertung optimiert habe. Zugegeben, einen Werte 100 von 100 ist sehr schwer zu erreichen und wird in dem Buch auch mit einem Ferrari verglichen. Ein hoher Wert, oder zumindest eine deutliche Verbesserung der Ladegeschwindigkeit der eigenen Webseite jedoch sehr einfach möglich. Wer nähere technische Informationen benötigt, oder gar die perfekte Wertung um Visier hat ist bei diesem Buch richtig.
Pagespeed Optimierung
Um die eigene Webseite schneller zu machen muss man gar kein Techniker sein. Es gibt einige Punkte die man auch als Laie sehr einfach umsetzen kann, im schlimmsten Fall folgt man einer Schritt für Schritt Anleitung. Interessant ist in diesem Zusammenhang, dass der Autor von Pagespeed Optimierung selbst ein gelernter Jurist und als Beruf Suchmaschinen-Experte ist. Es gibt ein paar Punkte die technischer Natur sind, jedoch sind diese auch ohne großes Vorwissen zu meistern. Generell ist die Sprache in dem Buch sehr einfach gehalten, man kann den Schritten gut folgen und es werden auch einfachere technische Begriffe, falls notwendig, erklärt.
Der Autor vergleicht die Arbeiten zur Pagespeed Optimierung mit einem Ferrari. Dabei steht aber nicht der Preis im Vordergrund sondern die Handarbeit. Genau das ist es, was eine Webseite schneller macht. Man muss an den richtigen Stellen Anpassungen treffen und für die maximale Wertung womöglich auch viel liebe ins Detail stecken. Die Webseite wird recht einfach schneller, will man aber den Ferrari unter den Webseiten, dann muss man dort noch einmal viel Arbeit hineinstecken.
Gründe für eine Optimierung
Die Zentrale Frage die sich auch der Autor auf den ersten Seiten stellt ist: warum sollte man seine Seite auf Pagespeed optimieren? Oder anders: warum braucht man einen Ferrari? Die Antwort ist einfach:
- Schnellere Ladezeit = bessere Platzierung bei Google, weniger Absprünge, mehr Seitenbesuche pro Benutzer
- bessere Platzierung bei Google, weniger Absprünge, mehr Seitenbesuche pro Benutzer = mehr Kunden und Seitenaufrufe
- mehr Kunden und Seitenaufrufe = mehr Gewinn
Am Ende ist immer der kommerzielle Ansatz der richtige. Auch bei Webseiten, und das auch, wenn man gar nichts verkauft.
Kapitel
Bei der Optimierung von Ladezeiten unterscheidet man prinzipiell zwei Bereiche. Das ist zum einen die Zeit die vergeht bis das erste Byte geschickt wird. Alles was in dieser Zeit passiert wird am Server gemacht. Diese Zeitspanne muss man am Server durch bestimmte Techniken verbessern. Alles nach dem ersten Byte ist am Client zu ändern. Das betrifft fast ausschließlich die Darstellung, den Browser und die Internetverbindung.
Werkzeuge
In einem der ersten Kapitel werden Werkzeuge für die Optimierung vorgestellt. Das ist insbesondere Google Page Insights, aber auch Webpagetest oder das eher von Technikern bekannte und eingesetzte Ping. Es wird ferner erklärt wie man diese Tools nutzt und aus den dort anfallenden Daten Informationen herausließt.
Client Optimierungen
Die nächsten vier Kapitel drehen sich dann schon um die Optimierung der Seite aus Client Sicht. Es werden folgende Themengebiete behandelt:
- Bilder
Alle angezeigten Bilder sollen so stark wie möglich komprimiert werden ohne, dass es einen Qualitätsverlust gibt. Fast immer ist dieser Punkt der größte, da Webseiten gerne durch große Bilder aufgehübscht werden. - HTML
Der HTML Code sollte möglichst kurz sein und den modernen Anforderungen (zB keine Frames) entsprechen. - CSS
CSS kann man reduzieren und nicht verwendete Bereiche komplett entfernen. - JavaScript
JavaScript kann man wie CSS verkleinern. Durch moderne Bibliotheken wie jQuery spart man zusätzlich Code ein.
Jedes Kapitel beginnt mit einer Tabelle in denen Aufwand, Schwierigkeitsgrad und Nutzen beschrieben werden. Als Leser kann man so schnell erkennen, was man mit dem Kapitel erreichen kann und man dieses eventuell nicht schafft. Die Kapitel sind nicht aufeinander aufbauen. Für die eigene Optimierung kann man diese in beliebiger Reihenfolge oder überhaupt nur bestimmte Kapitel machen. Man kommt schon sehr weit, wenn man sich auf die Kapitel beschränkt, die einen großen Nutzen haben.
Server Optimierungen
Auf Seite des Servers sind folgende Optimierungen möglich:
- Komprimierung
Das ist der wichtigste Punkt am Server. Die Daten die zum Client geschickt werden kann man ganz einfach über einen Schalter komprimieren, sofern das der Webserver unterstützt. Alle modernen Browser können mit komprimierten Websitedaten umgehen. - Cache
Moderne Webseiten haben dynamische Bereiche die bei jedem Aufruf berechnet werden. Einen Großteil dieser kann man durch Cache zwischenspeichern, damit die Zeit für das berechnen nicht immer wieder anfällt. - Critical Rendering Path
Da geht es darum, die Bereiche der Seite, die sofort sichtbar sind an den Anfang der übertragenen Daten zu stellen. Alles weitere kann auch nachgeladen werden. Typisches Beispiel sind JavaScript Dateien die am Ende des Quellcodes stehen. - CDN
Über einen CDN Dienst kann man die Webseite weltweit sehr schnell bereitstellen. - Webserver
Der Webserver selber kann auch optimiert werden, das hängt aber davon ab, wo man die Webseite hostet. Üblicherweise kann man bei Shared Webhoster kaum Änderungen vornehmen. - Responsive Design
Das Responsive Design muss korrekt umgesetzt sein. Laut dem Autor kommt es oft vor, dass Webseiten Daten doppelt, also in Desktop und mobiler Ansicht bereitstellen. Das ist unter Umständen ein großes Performance Problem.
Fazit
Eine 100er Wertung bei Google PageInsights ist zwar nicht unmöglich, jedoch mit sehr viel Arbeit verbunden. Pagespeed Optimierung zeigt, dass man mit einigen wenigen Schritten seine Webseite um ein vielfaches beschleunigen kann. Google liebt schnelle Seiten, weshalb jede Optimierung auf lange Sicht gesehen zu deutlich größeren Traffic und deshalb mehr Kunden, einen höheren Umsatz oder einfach nur eine bessere Platzierung in den Suchergebnissen führt.
Ein Rezensionsexemplar wurde mir freundlicherweise vom Hanser Verlag zur Verfügung gestellt.
Shöner Artikel.
Ich muss dem Fazit in einer Sache widersprechen. Die Pagespeed-Optimierung wie beschrieben mit Critical Rendering Path muss immer wieder durchgeführt werden, wenn man auf einer Seite Änderungen vornimmt, die nicht mit den Inline-Styles abgedeckt werden.
Jede Erweiterung der Webseite mit Javascript-Funktionen erfordert ein neues zusammenfassen der Javascript-Dateien und ggf. CSS-Dateien.
Es ist also nicht damit getan, einmal auf 100/100 zu kommen. PageSpeed muss bei jeder Änderung geprüft und gegebenenfalls durch erneutes Optimieren wiederhergestellt werden.
Der Webserver ist in aller Regel Apache oder Nginx. Apache sollte man nicht mehr optimieren, das bringt nicht viel mehr Performance. Lieber einen Relaunch auf Nginx machen.
Wer sich kostenlos zum Thema beraten lassen möchte, kann mich gerne kontaktieren.
Wir bieten auch ein Responsive Webdesign CMSystem, das den PageSpeed mit einem Klick vollautomatisch optimiert.
https://developers.google.com/speed/pagespeed/insights/?url=bluecreator.de
Das stimmt, jede Änderung auf der Seite ändert auch den PageSpeed Wert. Wobei simple CSS Anpassungen keine bis kaum Auswirkungen haben. Der Aussage „Apache sollte man nicht mehr optimieren“ kann ich gar nicht zustimmen. Im Gegensatz zur Defaulteinstellung einer frischen Apache Installation kann man durch Anpassungen eine deutlich höhere Performance erreichen. Gerade das korrekte Caching (RAM oder HD bzw. SSD) bringt sehr viel.
Vielen Dank für die Vorstellung meines Buchs. Ich freue mich sehr, wenn meine Arbeit den Lesern wirklich hilft, Ihre Seiten schneller zu machen.
Danke für den Kommentar! Ja das Buch ist sehr hilfreich und liegt immer bei uns im Büro.
100% gehen schon:
https://developers.google.com/speed/pagespeed/insights/?hl=de&url=https%3A%2F%2Fwww.ramser-elektro.at%2F
😀
super 😉
Sehr sehr schöner Artikel! Vielen Dank fürs teilen. Dadurch habe ich eine andere Sichtweise bekommen und mir leuchtet das Thema mehr ein. Viele hilfreiche Tipps habe ich aber auch unter: tim-brettschneider.com/wordpress-pagespeed-optimieren-schritt-fuer-schritt-fuer-anfaenger/#Pagespeed_optimieren_technisch_teuer gefunden!