In Zeiten, in denen fast jede Information zu jeder Zeit und von jedem Ort aus verfügbar ist, müssen Webseiten und andere Online-Inhalte gewisse Kriterien erfüllen, um User (und damit auch die Suchmaschinen) zufriedenzustellen. Eines dieser Kriterien ist die Ladezeit. Wir erklären euch, wie ihr die Performance analysiert und im Anschluss optimiert, um langfristig bessere Rankings zu erzielen.

Performance optimieren heißt Usability verbessern

Stellt euch mal vor, ihr betretet einen Imbiss, habt riesigen Kohldampf und werdet einfach nicht bedient. Was passiert? Genau, ihr verlasst den Laden fluchtartig und geht zur Konkurrenz, in der Hoffnung dort schneller etwas zum Beißen zu kriegen. Selbst wenn ihr nicht direkt das Weite sucht: Wiederkommen werdet ihr wohl kaum.

Schlechte Performance = hohe Bounce-Rate

Überträgt man dieses Beispiel in die digitale Welt, wird aus dem Imbiss die Webseite und aus der Schnelligkeit die Bedienung die Ladezeit dieser Webseite. Wer in puncto Rankings in der obersten Liga mitspielen will, sollte sich also um seinen Service, anders ausgedrückt seine Performance schleunigst Gedanken machen. Denn Google rankt gerne Webseiten, die besonders nutzerfreundlich sind. Zur Nutzerfreundlichkeit zählt neben einer stimmigen Aufteilung und einer übersichtlichen Aufbereitung eines Themas auch die Ladezeit des Contents. Braucht die Seite zu lange, um sich aufzubauen, steigt die Bounce-Rate (Absprungrate), weil viele User den “Zurück-Button” klicken und sich auf der Google SERP beim nächsten Suchergebnis bedienen.

Schritt 1: Performance Check

Bevor ihr die Performance eurer Webseite verbessert, checkt am besten zu allererst einmal wie schlimm es denn tatsächlich um euren PageSpeed bestellt ist. Hierzu könnt ihr verschiedene Tools nutzen.

PageSpeed Insights

PageSpeed Insights ist ein von Google bereitgestelltes Tool, mit dem ihr im Handumdrehen die Performance einer jeweiligen URL überprüfen könnt. Im Idealfall bekommt ihr sowohl für die Ausgabe auf Mobilgeräten als auch für die Ausgabe auf dem Desktop Gerät das Prädikat “Good” verliehen. Ist die Ladezeit nicht ganz so optimal, bewertet da s Tool die Performance als “Medium”. Optimierungsbedarf besteht bei der Bewertung “low”. Das Schöne: Google liefert euch nach der Analyse direkt Optimierungsvorschläge.

Pingdom

Verwendet ihr dem Pingdom Website Speed Test zur Analyse eurer Page Performance werdet ihr feststellen, dass ein deutlich positiveres Bild der Ladezeiten vermittelt wird als bei PageSpeed Insights von Google. Außerdem habt ihr die Möglichkeit, verschiedenen Serverstandorte für eure Abfrage auszuwählen. Nach der Analyse zeigt euch das Tool die Ladezeit (hoffentlich in Millisekunden), den Google PageSpeed Performance Grade (sollte A sein), die Größe der der Webseite und eine Reihe weiterer Daten an.

Webpagetest

Noch umfangreicher wird die Analyse mit dem Tool von webpagetest.org. Hier könnt noch ein paar mehr Serverstandorte auswählen und – besonders cool – die Testumgebung (Smartphone-Modell, Browser, etc.) definieren. Die Ergebnisse sind außerordentlich umfangreich und bieten eine hervorragende Datenbasis, die euch bei der Performance Optimierung eurer Website hilft.

Schritt 2: Die Optimierung

Nachdem ihr analysiert habt, wo der Schuh in Sachen Website-Ladezeit drückt, könnt ihr mit der Optimierung starten.

Um die ausgelieferten Analysedaten ein wenig verständlicher für euch zu machen: Die häufigsten Ursachen für eine schlechte Performance sind…

  • …große Datenmengen,
  • nicht komprimierte Bilder,
  • ein überladenes Theme und
  • langsame Datenbanken & Server.

Theme überdenken & unbenötigte Plugins deaktivieren

Eure Website läuft auf WordPress oder Joomla! und das gekaufte Premium-Theme sieht so richtig schick aus? Gut so, aber nicht selten sind Themes komplett überladen, was zu langsamen Website-Ladezeiten führt. Schaut einfach mal, ob es nicht ein schlankeres Theme gibt, dass sich neben der auf Anhieb ansprechenden Optik insbesondere durch seine Performance auszeichnet.

Liegt das Problem nicht am Theme selbst, können auch Plugins die Ladezeit von Webseiten negativ beeinflussen, wenn zu viele Datenbankzugriffe erfolgen. Das ist vor allem bei unbekannteren und schlecht umgesetzten Plugins der Fall. Überprüft einfach mal, welche Plugins sich im Laufe Zeit so angesammelt haben und deinstalliert alles, was ihr nicht unbedingt braucht.

HTTP-Requests verringern

Werden weniger HTTP-Requests durchgeführt, baut sich eure Website logischerweise schneller auf. Ein solcher Server-Request erfolgt immer dann, wenn eine Datei geladen werden muss. Packst ihr also weniger Dateien wie Bilder, Skripte und Co in ein Dokument, lädt auch eure Seite schneller.

Tipp: Ihr könnt verschiedene Stylesheets in ein einzelnes CSS-File zusammenfassen und es aus dem-Bereich des HTML-Dokuments verlinken. Sofern ihr beachtet, dass sich dann keine inline-Styleangaben mehr im HTML-Dokument befinden, kann die CSS-Datei gecached werden, was den Seitenaufbau ebenfalls beschleunigt.

Bilder fürs Web optimieren

Ohne gute Bilder (am besten im .jpg Format) und Grafiken (am besten als .png Datei) kommt eine Webseite nicht aus, schließlich sagt ein Bild oft mehr als tausend Worte. Wichtig ist jedoch, dass diese Bilder fürs Web optimiert sind, um langen Ladezeiten vorzubeugen. Der häufigste Fehler in diesem Zusammenhang ist, Bilder in ihrer Originalgröße auf den Server zu laden und genau so in den Content einzubauen.

Beispiel: Ist ein Bild 2500 x 1000 Pixel groß, wird aber nur in einen 750 Pixel breiten Contentbereich eingebunden, wird es nachher verkleinert angezeigt. Allerdings muss das Bild oder die Grafik trotzdem in seiner gesamten Größe geladen werden. Um solch unnötigen Ballast zu vermeiden, solltet ihr Bilder immer auf die Größe verkleinern, in der sie auch tatsächlich angezeigt werden sollen.

Übrigens: Sobald eine URL aufgerufen wird, werden in der Regel alle Bilder automatisch geladen – auch solche, die man noch gar nicht sieht, weil man z.B. gar nicht so weit herunterscrollt. Um Bilder erst bei Bedarf zu laden, könnt ihr Plugins wie Crazy Lazy nutzen. Und um direkt noch ein Plugin-Tipp hinterherzuliefern: WP Smush.it komprimiert die Dateigröße von Bildern beim Upload automatisch. Auch bereits hochgeladene Bilder könnt ihr damit nachträglich optimieren.

Gzip Komprimierung

Nicht nur Bilder, sondern auch Systemdateien (beispielsweise von WordPress) lassen sich komprimieren. Wie das geht? Ganz einfach mit Gzip, einem freien Kompressionsprogramm, das, genau wie das Dateiformat entsprechen Dateiformat, für alle Betriebssysteme verfügbar ist. Alles was ihr tun müsst, ist einen Codeschnipsel in die .htaccess Datei einzufügen. Bei WordPress müsst ihr an dieser Stelle nicht manuell tätig werden, sondern könnt auf Plugins wie Gzip Ninja Speed Compression zurückgreifen. Auch bei Joomla gibt es entsprechende Extensions, die exakt das Gleiche machen.

Caching nutzen

Auch um ein gutes Caching Plugin kommen WordPress User nicht herum. Beim Caching werden statische Versionen aller Seiten angelegt, statt diese dynamisch zu erstellen – mit tollen Auswirkungen auf die Ladegeschwindigkeit der gesamten Website. Ein sehr sauber geschriebenes Caching Plugin für WordPress ist Cachify. Das Rundum-sorglos-Paket bekommt ihr mit dem Plugin W3 Total Cache. Alternativ macht WP Rocket aus eurer Seite eine kleine Rakete.

OnFoxx Extra Tipp:

Um eure Website weiter zu beschleunigen, könnt ihr HTML, CSS und Javascript von unnötigen Leerzeichen und Zeilenumbrüchen befreien. Weil der gesamte Code dadurch schlanker wird, verringert sich auch die Ladezeit. Einzig und allein die Übersichtlichkeit des Codes verschlechtert sich. Das zuvor erwähnte Plugin W3 Total Cache bietet euch als WordPress User an dieser Stelle eine so genannte “Minify” Funktion. Allerdings funktioniert diese nur dann besonders gut, wenn ihr im Manual Mode des Plugins selbst definiert, wie die Java-Scripts geladen werden sollen. Weil das vor allem für Einsteiger nicht wirklich geeignet ist, empfehlen wir fürs “Minify” (Minification) das Plugin Autoptimize.