15 Maßnahmen für besseren Page Speed

So belegen Studien, dass 75 % aller Kunden nur auf schnellen Webseiten kaufen und einem Unternehmen pro Sekunde Ladezeit etwa 7 % Umsatz verloren gehen. Wie sieht es mit Ihrer Webseitengeschwindigkeit aus?

Über das kostenlose Google-Tool „Google PageSpeed Insights“ können Sie die Performance oder den Page Speed, wie die Webseitengeschwindigkeit auch genannt wird, messen lassen und erhalten bereits erste Maßnahmenvorschläge zur Optimierung Ihrer Seite.

Maßnahme 1 – Bilder optimieren

Da das Laden von Bildern die meiste Zeit benötigt, ist es wichtig, diese im richtigen Format und in optimaler Größe hochzuladen. Verwenden Sie daher entweder das jpeg-Format oder gif-Dateien mit maximal 10 x 10 Pixel.

Benutzen Sie gern auch Gimp oder Adobe Photoshop. Dort können Sie vorhandene Grafiken komprimieren und mit dem Button „fürs Web speichern“ optimal anpassen.

Geben Sie möglichst im Quellcode die Bildgröße an, so muss diese nicht jedes Mal vom Server berechnet werden – das spart Zeit beim Laden.

Entfernen Sie auch überflüssige EXIF-Daten und Tags oder nutzen Sie das Tool „tinypng“. Oft ist bei Bildern vom Smartphone oder der Kamera zum Beispiel der Aufnahmeort oder auch das Datum gespeichert – alles unnötiger Datenballast.

Maßnahme 2 – Java und CSS minimieren

In den Quellcodes für Java und CSS tummeln sich viele unnötige Leerzeichen und Zeilenumbrüche, die sich summieren und Ladezeit fressen. Viele Quellcodes können leicht auf nur eine Zeile minimiert werden. Auch hier helfen Ihnen Tools wie „CSSmin.js“ für CSS oder „Closure Compiler“ für Java Scripts.

Maßnahme 3 –http-request optimieren

Für jedes Element der Webseite, sei es eine Tabelle oder auch ein Bild, muss jeweils ein http-request an den Server gesendet und mit jedem Seitenaufruf neu gelesen werden. Kumuliert kann das die Ladezeit nicht unerheblich erhöhen. Spammen Sie Ihre Webseite daher nicht unnötig zu und reduzieren Sie Grafiken und Elemente auf das Wesentliche.

Maßnahme 4 – Auslagerung von Java und CSS

Es gibt tatsächlich die Möglichkeit diese Dateien auszulagern. Das heißt, sie werden in einem externen Dokument zusammengeführt. So muss beim Seitenaufruf nicht jedes einzelne Element, sondern nur die Datei abgerufen werden. Wird diese dann auch noch in einem Zwischenspeicher, dem sogenannten Cache abgelegt, sparen Sie noch einmal wichtige Zeit.

Maßnahme 5 – Verwendung von CSS-Sprites

Sprites sind Dateien, die aus mehreren Grafiken bestehen. Dort können zum Beispiel alle Bilder zusammengefasst werden, die zum Hintergrund Ihrer Webseite gehören. Auch hier resultiert die verbesserte Webseitengeschwindigkeit aus der Reduzierung der benötigten Abfragen auf nur eine Datei.

Maßnahme 6 – Verwendung nur eines CSS Stylesheets

Nicht nur Bilder und grafische Elemente, auch simple Designelemente wie Schriftart, -größe oder -farbe müssen beim Aufruf Ihrer Seite vom Server abgefragt werden. Da für jedes dieser Elemente ein separater Befehl im HTML-Code hinterlegt ist, summiert sich auch hier die Ladezeit.

Fassen Sie daher alle CSS-Befehle in einem sogenannten Stylesheet zusammen und verlinken Sie dieses auf Ihrer Seite, denn auch hier entspricht ein Dokument nur einem erforderlichen Abruf.

Maßnahme 7 – CSS und Java am Ende hochladen lassen

Immer wieder landen wir bei den grafischen Elementen, Bildern und Icons Ihrer Webseite, da diese nicht nur das Erscheinungsbild wesentlich prägen, sondern eben auch die Webseitengeschwindigkeit.

Fügen Sie möglichst die CSS und Java Befehle am Ende des HTML-Codes ein. So wird auch bei einer niedrigen Servergeschwindigkeit der Seitenaufbau nicht wesentlich beeinträchtigt.

Maßnahme 8 – Komprimierung durch Gzip nutzen

Wie jede zip-Datei auf dem Rechner kann auch die Datei Ihrer Webseite durch dieses Tool komprimiert werden. Weniger Daten bedeuten weniger Seitenladezeit. Die Handhabung ist einfach und die ausgegebene Datei mittlerweile auf nahezu allen Servern nutzbar.

Maßnahme 9 – Quellcodes optimieren

Räumen Sie auch in den Quellcodes Ihrer Texte auf und achten Sie in Zukunft direkt beim Einfügen auf eine optimale Formatierung. Sobald Sie einen fertig formatierten Text aus Word einfügen, enthält dieser Unmengen an überflüssigen Codes wie zum Beispiel Leerzeichen, Formatierungen oder Kommentare.

Optimal ist es, den Text direkt als HTML einzufügen oder aber einen Plain Text erst im CMS zu formatieren.

Maßnahme 10 – Verwendung dedizierter Server

Bei den meisten Webhosting-Anbietern müssen Sie sich den Server mit vielen anderen Unternehmen oder auch Privatpersonen, mit Webshops und Dienstleistern teilen. Da kann es passieren, dass einem Server bis zu 100 Webseiten zugeordnet sind.

Sie können sich vorstellen, was das für Ihre Webseitengeschwindigkeit bedeutet, wenn in aller Welt Menschen zur gleichen Zeit auf alle diese Seiten zugreifen wollen. So liegt zwar die Servergeschwindigkeit nicht in Ihrem Einflussbereich, jedoch können Sie sich für einen sogenannten dedizierten, also einen nur Ihnen zugeordneten Server entscheiden.

Maßnahme 11 – Minimierung externer Skripte

Auch externe Skripte wie zum Beispiel Trackingcodes oder Sharebuttons verringern Ihre Webseitengeschwindigkeit. Reduzieren Sie diese daher auf ein für Sie akzeptables Minimum. Hier sollte der Nutzen jedes Einzelnen die Verlangsamung der Geschwindigkeit rechtfertigen können – wenn nicht, weg damit!

Maßnahme 12 – Nutzung von CDN – Content Delivery Network

Bei der Nutzung von Content Delivery Network werden die Inhalte Ihrer Webseite bildlich gesprochen in einzelne Teile zerlegt und jedes davon auf verschiedenen Servern gespeichert. So können diese bei Aufruf Ihrer Homepage zeitgleich geladen werden. Das kann bei großen Datenmengen einen eindrucksvollen Vorteil bringen.

Es gibt auf dem Markt Anbieter, die das kostenlos zur Verfügung stellen. Doch sollte man dort genau auf die Konditionen achten. Zu verschenken hat niemand etwas. Kostenpflichtige Verträge werden meist nach dem genutzten Datenvolumen abgerechnet.

Maßnahme 13 – Browser Caching nutzen

Bei dieser Maßnahme werden die Elemente Ihrer Webseite vom Browser zwischengespeichert. So ist nicht jedes Mal ein Abruf vom Server erforderlich und die Ladezeit geringer. Wordpress beispielsweise bietet das Browser Caching bereits an. Hierzu muss lediglich das Plugin installiert und aktiviert werden (WP Rocket). Doch auch andere Content Management Systeme (CMS) haben dieses Feature bereits (z. B. W3 Total Cache).

Maßnahme 14 – Caching vom Server nutzen

Auch das Zwischenspeichern eines HTML-Dokuments mit den wichtigsten Webseitenelementen auf dem Server ist möglich. So müssen die Hauptelemente bei wiederholtem Aufruf Ihrer Seite nicht komplett neu geladen werden.

Maßnahme 15 – Verwendung von CSS3

Statt mit HTML ist es ratsam, Icons und Grafiken über CSS3 zu erzeugen. Das Cascading Stylesheet ist eine Programmiersprache, welche die Quellcodes für grafische Elemente reduziert. Der Nachteil hierbei ist allerdings, dass dies nicht für Fotos, sondern nur für Buttons, Icon usw. anwendbar ist.

Icon Rechts
No items found.
Steve Jobs

Design ist nicht nur, wie es aussieht und wie es sich anfühlt. Design ist, wie es funktioniert.

Steve Jobs
früherer CEO of Apple Inc.

Icon Rechts
No items found.

Fazit

Summary