Tipps, Tricks, Codeschnipsel für eine schnellere Ladezeit und Performance-Optimierung

Bildabmessungen hinterlegen

Für eine korrekte Anzeige der Bilder in allen Browsern bedarf es der Angabe von Breite und Höhe innerhalb des Bildes im Quellcode. Außerdem ist die Angabe der Breite und Höhe der Bilder wichtig für ein schnelleres Rendering. Diese notwendigen…

Zeichensatz oder Response Header angeben

Je nach der Verwendung eines CMS kann es passieren, dass bei der Analyse der Webseite mit einem Page Speed Tool der Punkt des fehlenden Zeichensatzes ausgewiesen wird. In diesem Fall wird von dem CMS kein vollständiger Zeichensatz des Content-Type…

Parallele Downloads – Ressourcen von Subdomains laden

Der Analysepunkt Parallelize downloads across hostnames (parallele Downloads) zeigt pauschal alle Dateien an, meistens Bilder, die von der Webseite geladen werden. Dies beinhaltet sowohl Dateien die für das Design als auch für die Inhalte…

Umleitungen minimieren (Minimize redirects)

Wer bei der PageSpeed Analyse den Punkte Minimize redirects (Umleitungen minimieren) angezeigt bekommt, der sollte sich auf die Suche Weiterleitungen auf der Webseite. Weiterleitungen sind unvorteilhaft, sowohl für den Besucher der Webseite…

Bilder optimieren

Bilder jeglicher Art und Weise lockern eine Webseite optisch auf und sorgen für einen Blickfang. Gleichzeitig sind sie sehr wichtig um die Besucher auf der Webseite zu halten. Dennoch kann es sinnvoll sein die angezeigten Bilder (GIF, JPG,…

HTML Quellcode minimieren

Die Länge des HTML-Codes (Quelltext) hat ebenfalls einen Einfluss auf die Ladezeit einer Webseite, denn je länger der HTML-Quellcode ist, desto größer ist diese „Datei“ und damit deren Ladezeit in dem Browser des Besuchers. Dieser Punkt…

Nicht verwendeter CSS-Code

Unter dem Page Speed Optimierungspunkt "nicht verwendeter CSS-Code (Remove unused CSS)" werden alle CSS Codeschnipsel aufgelistet die auf der aktuell zu analysierenden Seite nicht verwendet werden. Dieser Analysepunkt ist somit Seitenbezogen…

CSS-Dateien minimieren

Ein oft vernachlässigter Punkt bei der PageSpeed-Optimierung ist die Minimierung der CSS Dateien (minify CSS). Hier kann sehr schnell angesetzt und sofort sichtbare Performance-Verbesserungen erzielt werden. Das Ziel der CSS Optimierung ist…

Browser-Caching aktivieren

Wenn das PageSpeed Tool den Punkt Browser-Caching (Leverage browser caching) als offenen Punkt aufzeigt, dann weist dies auf nicht vorhandenes oder eingeschränktes Cachen der analysierten Webseite hin. In diesem Fall muss der Browser, mit dem…

Javascript-Dateien kombinieren

Die Ladezeit einer Webseite hängt sehr stark von der Anzahl der http Requests ab, sowie der damit verbundenen Größen der benötigten Dateien (CCS, Javascript, Bilder, etc.). Da aktuelle und moderne Webseiten kaum noch auf JavaScript und den…

CSS Sprites – Bilder kombinieren

Für jedes Bild, das für das Design einer Webseite geladen wird, startet der Server eine Anfrage (eröffnet einen neuen http Request). Um diese Anfragen (http Request) zu minimieren ist die Entwicklung der CSS Sprites Technik entstanden. Was…

CSS Dateien kombinieren

CSS-Dateien zu kombinieren (Combine external CSS) kann und muss bei der PageSpeed-Analyse unterschiedlich bewertet werden. Jeder Webmaster muss technologisch prüfen ob seine für das Webdesign verwendeten CSS-Dateien kombiniert werden können.…