Webseiten Performance verbessern | 5 Tipps zur Pagespeed Optimierung

Inhalt

Magst Du langsame Webseiten? …nein? Ich auch nicht. Und all die anderen Internetnutzer da draußen auch nicht. Deshalb bekommst Du in diesem Artikel fünf Tipps, wie Du die Performance Deiner Website verbessern kannst.

YouTube

Mit dem Laden des Videos akzeptieren Sie die Datenschutzerklärung von YouTube.
Mehr erfahren

Video laden

Warum ist die Webseiten Performance wichtig?

Stell Dir vor, Du startest eine Google Suche. Du suchst nach „Laufschuh Größe 43“. Das erste Ergebnis auf der Suchergebnisseite scheint ganz gut zu passen, also klickst Du drauf. Und wartest. Und wartest. Und wartest. Der Bildschirm bleibt weiß, der Fortschrittsbalken des Browsers kommt ins Stocken. Und Du? Du gehst reflexartig zurück auf die Suchergebnisseite und klickst auf das nächste Ergebnis. Die neue Seite lädt kaum mehr als eine Sekunde und Du kommst Deinen Laufschuhen endlich näher.

Was ist da gerade passiert? Ganz einfach: Du hast – womöglich unterbewusst – entschieden, dass Dir die erste Seite zu lange lädt. Also bist Du einen Schritt zurück und hast Dir ein anderes Suchergebnis ausgesucht.

Was bedeutet das für den Betreiber der ersten Website? Klar: weniger Umsatz. Er hat Dich als potenziellen Laufschuh-Käufer an den Wettbewerb verloren, weil seine Website zu langsam war.

Du siehst: die Ladezeiten einer Website beeinflussen die User Experience (also die Erfahrung der Nutzer mit einer Website) ganz maßgeblich. Das gilt ganz besonders für Smartphone-Nutzer (Stichwort mobile Usability). Diese sind noch ungeduldiger unterwegs. Hinzu kommt der hin und wieder schlechte Empfang, der die Ladezeiten zusätzlich verlängern kann.

Webseiten Performance ist ein Ranking-Faktor!

Google berücksichtigt die Ladezeit einer Website deshalb als Ranking-Faktor. Für Dich bedeutet das: je schneller Deine Website ist, umso leichter schaffst Du’s auf die oberen Google Ränge (vice versa). Die standardisierte Metrik nennt sich „Pagespeed“ und gibt an, wie lange Deine Website unter bestimmten Bedingungen lädt, bis sie interaktionsfähig und fertig gerendert ist.

Website Performance messen

Bevor Du die Ladezeiten Deiner Website verbesserst, solltest Du erstmal einen Performance Test machen. Ich nutze dazu gern GTmetrix.

Die Ergebnisse solcher Pagespeed-Tests (in diesem Fall GTmetrix) geben Dir wichtige Anhaltspunkte für die Optimierung der Webseiten Performance.

Tipp 1: Bilder optimieren

Der erste große Hebel sind die Bilder. Häufig stößt Du hier bereits auf mehrere Megabyte Optimierungspotenzial. Prüf zum Beispiel mal, in welchen Auflösungen Bilder auf Deiner Website eingebettet sind. Die Fotos moderner Kameras und Smartphones sind so hochauflösend, dass Du sie vor der Verwendung auf einer Website unbedingt reduzieren und komprimieren solltest. Wichtig ist dabei, dass Du die Balance zwischen einer ordentlichen Bildqualität und der niedrigsten Dateigröße findest.

Die Dateigröße variiert natürlich mit der Auflösung. Als (sehr) grobe Daumenregel kannst Du Dir merken: Bilder sollten im Allgemeinen kleiner als 0,3 Megabyte sein. Dabei spielt auch das Dateiformat eine entscheidende Rolle: für einfache Illustrationen und Grafiken mit wenigen Farben eignet sich das Format .png gut. Für Fotos ist .jpg gut geeignet.

Laptop: simple Illustration mit wenigen Farben. Hier ist PNG ein gutes und kompaktes Dateiformat.
Wald: Foto mit vielen Farben. Im JPG Format ist diese Datei deutlich kleiner als im PNG Format.

Tipp 2: Caching aktivieren

Caching kann Deine Webseiten Performance massive verbessern. Aber was steckt dahinter? Caches sind Zwischenspeicher, in denen häufig benötigte Daten gespeichert werden. Daten, die im Cache liegen, sind schneller abrufbar als solche, die erst noch von der Festplatte oder vom Server geladen werden müssen. Für Dich sind vor allem zwei Caches wichtig: der Browser-Cache und der Server-Cache. Die besten Pagespeed Ergebnisse erreichst Du, wenn Du beide Caches verwendest!

Browser-Cache

Der Browser-Cache liegt auf dem Gerät Deines Website-Nutzers. Wenn der Nutzer zum ersten Mal Deine Website besucht, werden in diesem Browser-Cache einige Daten zwischengespeichert. Zum Beispiel Bilder und Stylesheets (das sind Design-Dateien). Der Vorteil des Browser Caching: diese Daten müssen nur einmal vom Server heruntergeladen werden und können anschließend aus dem Cache verwendet werden. Das spart wertvolle Website-Ladezeit.

Der Browser-Cache kann der Nutzer jederzeit selbst löschen. Beim nächsten Kontakt mit Deiner Website werden die o.g. Ressourcen dann einfach wieder auf seinem Gerät gespeichert. Ab und zu kommt es aufgrund des Browser-Caching zu Darstellungsfehlern: es kann passieren, dass auf dem Gerät des Nutzers alte Versionen der Ressourcen gespeichert sind. Wenn Du zwischenzeitlich etwas beispielsweise am Design Deiner Website verändert hast, wird sie bei Nutzern mit „alten“ Ressourcen u.U. nicht richtig angezeigt. Das lässt sich aber durch Löschen des Browser-Caches einfach lösen.

Server-Cache

Server-Caching ist der serverseitige Weg, Deine Webseiten Performance zu verbessern. Insbesondere wenn Deine Website in einem Content Management System (CMS) wie WordPress oder Typo3 erstellt wurde, lässt sich die Website Ladezeit stark verkürzen.

Content Management Systeme speichern alle Inhalte der Website in einer zentralen Datenbank. Jedes Mal, wenn ein Nutzer eine bestimmte Seite lädt, startet das CMS eine Datenbank-Abfrage, um die Inhalte der URL zu erhalten. Das kostet wertvolle Ladezeit! Mit einem serverseitigen Cache kannst Du Deinen Nutzern diese Ladezeiten ersparen. Die Inhalte zu jeder URL der Website werden „ready to go“ auf dem Server zwischengespeichert. Die Kommunikation zwischen CMS und Datenbank entfällt und Du verbesserst Deinen Pagespeed um bis zu 500 %.

Auf meinen Websites arbeite ich am liebsten mit dem Caching-Plugin WP Rocket und erreiche so wunderbare Ladezeiten (siehe Screenshot weiter oben).

Beim serverseitigen Caching wird die Website dem Nutzer direkt aus dem Cache (grün) ausgespielt. Die Kommunikation zwischen CMS und Datenbank entfällt

Tipp 3: Animationen mit Bedacht einsetzen

Alles, was sich auf Deiner Website in irgendeiner Form bewegt, bezahlst Du teuer mit einer schlechteren Website Ladezeit. Übrigens verwendet Google in seiner Dokumentation zu Animationen und Performance tatsächlich den Begriff „expensive“. Mit jeder zusätzlichen Animation erhöhst Du das Risiko, Nutzer (und Google!) wegen zu langer Ladezeiten zu verlieren. Animationen können – je nach Endgerät – auch ins Stottern kommen und so die User Experience trüben. Besonders ungünstig sind aufwändige Layout-Animationen.

Bild-Slider rausschmeißen

Und noch etwas kann ich beim Thema Webseiten Performance einfach nicht unerwähnt lassen: Bild-Slider. Sie kommen auf nahezu jeder Webseite zum Einsatz. Irgendwann, vor vielen vielen Jahren, waren diese animierten Diashows mal etwas Besonderes. Aber das ist lange her! Die Slider mit ihren Animationen können heute vor allem eins: Dir den Pagespeed vermasseln. Ersetze die Homepage-Slider lieber durch ein aussagekräftiges, korrekt skaliertes Bild oder einen starken Call-to-Action!

Tipp 4: Professionelles Hosting

Wo liegt Deine Website? Wahrscheinlich – wie die Mehrheit der Webseiten – bei einer Shared Hosting Plattform. Shared Hosting bedeutet, dass sich eine Vielzahl von Websites zusammen einen Server bzw. definierte Server-Ressourcen teilen. In der Regel hast Du als Website-Betreiber keine Ahnung, mit wem Du Dir diesen Server teilst und wie viele weitere Websites auf diesem Server verwaltet werden. Die Ressourcen werden unter den Websites dynamisch aufgeteilt. Je nach Tarif kannst Du maximal einen bestimmten Anteil der Server-Ressourcen verwenden. Shared Hosting ist sehr beliebt, weil es sehr günstig ist. Die Kehrseite der Medaille: Shared Hosting bedeutet in der Regel längere Ladezeiten.

Wesentlich schneller wird Deine Website auf einem dedizierten Server („managed Server“ oder „managed vServer“). Bei diesen Hosting-Angeboten stehen Dir die im Tarif enthaltenen Ressourcen allein und garantiert zur Verfügung. Je nachdem, wie Deine Website aufgebaut ist und welches CMS Du nutzt, gibt es darauf spezialisierte Hosting-Unternehmen und Angebote. Für WordPress-Websites empfehlen wir den Starter-Tarif von Raidboxes aus Münster. Und für WordPress Multisite Projekte den Team-Tarif von HostPress aus Eppelborn.

Ein eigener physischer Server in Deinem Büro ist für die Webseiten Performance keine gute Idee: professionelle Hosting-Unternehmen verfügen über einen besseren Internet-Anschluss und meist auch über aktuellere Hardware. Generell bedeutet ein eigener Server – egal ob in Deinem Büro oder in der Cloud – viel Verantwortung und Verwaltungsaufwand. Daher bin ich ein Fan von „managed Server“ Angeboten.

Tipp 5: Content Delivery Network (CDN)

Du möchtest Deiner Webseiten Performance den letzten Schliff verleihen? Dann solltest Du ein Content Delivery Network (CDN) einsetzen. Ein CDN ist ein Netzwerk aus weltweit verteilten Servern. Auf jedem dieser Server wird eine Kopie Deiner Website gespeichert. Der Besucher bekommt Deine Website dann von dem ihm am nächsten gelegenen Server ausgeliefert. So erreichst Du schnellere Ladezeiten und eine bessere User Experience. Das ist v.a. interessant, wenn Deine Website international ausgerichtet ist. Das bekannteste CDN ist Cloudflare.

Ein CDN besteht aus weltweit verteilten Servern, sodass Deine Website immer auf dem schnellsten Weg ausgeliefert wird.

Fazit: gute Website Performance ist ein "Must-have!"

Eine gute Webseiten Performance ist Pflicht, wenn Du es mit dem Online Marketing ernst meinst. Es gibt viele Schrauben, an denen Du zur Pagespeed Optimierung drehen kannst. Am besten gehst Du das Thema Stück für Stück an und beginnst mit den Tipps #1 und #2. Wenn Du professionelle Unterstützung dabei und generell bei der Suchmaschinen-Optimierung brauchst, nimm gern Kontakt zu mir auf!

Willkommen bei PeakRelevance!

Ich bin Oliver Gibietz und seit ein paar Jahren begeisterter Online Marketer. Ich helfe Unternehmen, ihre Zielgruppe online zu erreichen und zu begeistern. 

Hier bei PeakRelevance und auf meinem YouTube Kanal spreche ich über Online Marketing, Content Marketing, SEO und SEA.

Mehr über mich erfahren →
Mit mir arbeiten →

Möchtest Du meinen Blog weiterverfolgen? Dann gebe ich Dir gern per Mail Bescheid, wenn ein neuer Artikel oder ein neues Video erscheint.

Ja, ich will →