Speed Matters – 9 Tipps für eine schnelle Website

Dass Pagespeed wichtig ist, ist nicht neu. Neu hingegen ist die Art, wie Google den Pagespeed misst. Und dadurch könnten so einige Rankings ins Wackeln kommen. Was es damit auf sich hat und wie man damit umgehen kann, lesen Sie hier.

Pagespeed ist essenziell. Nicht nur, weil Menschen nicht gerne warten – schon gar nicht darauf, dass eine Website lädt, sondern auch weil Pagespeed ein wichtiges Qualitätsmerkmal für die Suchmaschinen ist. Und entsprechend langsame Webseiten ganz einfach schlechter gerankt werden und ergo weniger Sichtbarkeit erhalten. Beide Faktoren spielen natürlich zusammen – denn Suchmaschinen beurteilen letztlich auch nur so, wie die User es tun, schliesslich wollen sie für den User die besten Ergebnisse anzeigen.

Das ist nicht neu – zumindest nicht für diejenigen unter uns, für die die Website ein wichtiger Zulieferer ist. Neu hingegen ist der Massstab, mit dem Google den Pagespeed misst. Mit dem „largest contentful paint“ wurde eine Metrik erschaffen, die die Ladezeit noch besser abbilden soll. Der „largest contentful paint“, kurz LCP, bezeichnet – vereinfacht gesagt – das grösste Element im sichtbaren Bereich. Der Pagespeed wird nun zu grossen Teilen daran festgemacht, wie lange es dauert, bis dieses lädt. Und Grösse bezeichnet in dem Fall nicht Filegrösse, Kilobyte oder ähnliches, sondern Pixel. Wer auf der Startseite ein grosses Header-Bild oder ein Video im sichtbaren Bereich hat, ist da sicher im Nachteil.   

Diese neue Metrik ist beim letzten Update im Mai in die Bewertung mit eingeflossen und hat so einige Messergebnisse über den Haufen geworfen. Wer früher im Google Speedtest noch im grünen Bereich gelandet ist, sieht möglicherweise heute plötzlich rot. Ohne dass er an der Seite etwas verändert hätte.

Mobile Page Speed ist besonders schwierig

Wer schon einmal seinen Pagespeed beobachtet hat, weiss: Besonders der Mobile Page Speed ist extrem schwierig, in den «grünen Bereich» zu bekommen. Der Grund: Google Page Speed misst die Geschwindigkeit der Seite bei verschiedenen Bandbreiten, unter anderem anhand einer simulierten langsamen 3G-Verbindung.

Google-Produkte verlangsamen die Seite

Spannend: Wenn man auf der Suche nach Performance-Bremsen den Sitespeed analysiert, wird man schnell merken, dass ganz vorne bei den Bremsklötzen Googl-Produkte mitspielen. Google Maps, YouTube, Google Recaptcha, sogar Google Analytics bremsen die Performance der Seite überdurchschnittlich.

Was tun für eine schnelle Seite?

Die Massnahmen, die man ergreifen kann, um eine Website schneller zu machen, haben sich eigentlich nicht gross verändert. Höchstens die Reihenfolge und der Impact der einzelnen Massnahmen. Was Sie tun können, für eine schnelle Website? Hier 9 Tipps:

1. Wenig externen Code: binden Sie so wenig externe Items auf der Seite ein, wie es nur geht. Jeder Facebook Like Button, jede Google-Maps.Karte, jedes Recaptcha etc. lädt, um zu laufen, erst mal jede Menge Code nach. Das sehen Sie zwar nicht – es bremst die Website aber massiv aus. Gleiches gilt übrigens auch für Inhalte, die Sie live / mittels Ajax von anderen Websites her anziehen – z.B. Blogposts, News etc.
2. Schlanker Code: Wenn immer möglich, lassen Sie Templates individuell programmieren und nutzen Sie keine fertigen Themes – diese beinhalten von Natur aus immer auch viel unnötigen Code (HTML, CSS, JavaScript), der die Seite verlangsamt. Jedes mögliche Element, jede Darstellungsoption und interaktive Funktion in einem fertigen Theme ist im Code hinterlegt und wird in vielen Fällen mit jedem Seitenaufruf geladen, auch wenn der entsprechende Code nirgends verwendet wird.
3. Schlanke Struktur: Browser müssen den Code einer Webseite interpretieren, um die Seite grafisch auf dem Bildschirm anzuzeigen. Das bedeutet etwas vereinfacht gesagt, dass mehr Code mehr Arbeit für den Browser darstellt und es entsprechend länger dauert. Vor allem das parsen, kompilieren und ausführen von JavaScript kann wertvolle Zeit in Anspruch nehmen. Gekoppelt mit einer aufgeblähten HTML-Struktur kommt es schnell zu markanten Einbussen am Pagespeed.            
4. Wenig Plugins: Setzen Sie wirklich nur die Plugins ein, die unvermeidbar sind. Und prüfen Sie regelmässig, ob nicht noch Plugins installiert sind, die ev. gar nicht mehr im Einsatz sind, aber die ev. noch geladen werden und die Ladezeit hemmen.
5. Schneller Server: Die Server-Performance ist bei kleinen und mittleren Websites eigentlich selten ein Problem. Wenn es zur Optimierung des Pagespeed kommt, sollte man den Server aber sicher auch mit prüfen. Denn lange Antwortzeiten können die Performance bremsen. Da lohnen sich ein paar Franken mehr im Monat für ein performantes Hosting schnell.
6. Bilder optimieren: Auch im Jahr 2020 können Bilder auf Webseiten immer noch Bremsklötze sein – auch wenn das aufgrund der heute verfügbaren Bandbreiten fast etwas unglaubwürdig erscheint. Es ist aber so. Bei der Bilderoptimierung gibt es verschiedene Stufen. Die erste: Bilder grundsätzlich „für den Webgebrauch“ abspeichern – hierbei wird schon einmal sehr viel komprimiert, ohne dass man qualitative Abstriche machen muss. Zweitens: Bilder in der Grösse hochladen, die man braucht. Nicht grösser. Drittens: ein Plugin (wir empfehlen ShortPixel Image Optimizer) kann helfen, die Bilder nach dem Upload nochmal zu verkleinern
7. Unwichtiges nachladen: Der Browser rendert die Seite grundsätzlich von oben nach unten. Da dies aber nicht unbedingt immer der Reihenfolge der Relevanz entspricht, kann es Sinn machen, über JavaScript-Elemente nachladen zu lassen, die nicht auf den ersten Blick sichtbar sein müssen. Zum Beispiel: Bilder, die auf den Positionen 2+ im Slider erscheinen sollen.
8. Caching: Mit einem Website Cache werden Seiten, die mehrfach aufgerufen werden, zwischengespeichert und so schneller verfügbar gemacht. Fast zu schön um wahr zu sein. Wer schon einmal einen Cache im Einsatz hatte, weiss, dass es bisweilen auch nervt – weil manchmal die neusten Aktualisierungen nicht automatisch erscheinen, und man erst den Cache leeren muss. Aber: Wer grosse Seiten hat weiss auch, dass man daran für eine schnelle Seite fast nicht dran vorbei kommt.
9. AMP: Wem das alles nicht reicht, dem bleibt am Schluss immer noch die Möglichkeit, die mobile Seite mittels AMP umzusetzen – als „Accelerated Mobile Page“, einem 2015 eingeführten Standard, der wahlweise als Erweiterung, Ergänzung oder Konkurrenz zu Responsive Websites gesehen wird. 

Confused oder convinced? Wenn Sie Unterstützung brauchen bei der Optimierung, melden Sie sich gerne – wir schauen zusammen mit Ihnen was wir optimieren können.