LADEZEITEN DEUTSCHERONLINESHOPS

Ist ein Onlineshop langsam, so reduziert jede Sekunde mehr

Ladezeit die Conversion Rate um -7%. Zusätzlich werden

langsame Seiten von den Suchmaschinen mit negativem

Rankingfaktor bestraft und führen zu weniger Traffic.

Schnelle Ladezeiten sind somit doppelt wichtig, Onsite und

Offsite!

Wir haben 100 deutsche Onlineshops für Sie analysiert,

verglichen und die wichtigsten Optimierungspotenziale in

dieser Infografik zusammengefasst.

Durchschnittsangaben

STATUS QUO - WIE SIEHT ES AKTUELL AUS?

01. UMFANG REDUZIEREN

1.701 DOM Elemente143,7 KB

21 JavaScript

59 Bilder

6 CSS

1 Den HTML-Code aufräumen

Maßnahmen Maßnahmen

Die Anzahl DOM-Elemente sollte reduziert werden, indem das Dokument ein

sauberes Markup und keine unnötigen Elemente aufweist.

2 Dateien zusammenfassen

Die Anzahl der zu ladenden Dateien sollte durch das Kombinieren von mehreren

CSS- und JavaScript-Dateien reduziert werden. Eine CSS- und jeweils eine

JavaScript-Datei im Header und Footer sind ideal.

3 Unnötiges Entfernen

Generell sollten alle Elemente und Angaben, welche nicht (mehr) benötigt

werden, entfernt werden. Dazu zählen z.B. nicht verwendete oder redundante

Style-Eigenschaften und JavaScript.

Maßnahmen Maßnahmen

3 Die richtigen Dateiformate

Inhaltsgrafiken sollten im geeigneten Dateiformat angelegt werden, z. B.

Pixelbilder als JPEG (mit Komprimierung) und Grafiken als PNG (8 Bit).

2 GZIP Komprimierung

In der Serverkonfiguration sollte die GZIP-Komprimierung für textbasierte

Inhalte aktiviert werden. Auch Grafiken lassen sich mit belustbehafteten

Komprimierungsmethoden zusätzlich verkleinern (z. B. JPEG).

1 Textbasierte Inhalte minimieren

Das HTML, JavaScript und CSS sollte z. B. mit einem YUICompressor minimiert

werden. JavaScript sollte allerdings nicht zusätzlich komprimiert werden.

</>html

{ js} { js} { js} { js} { js} { js} { js}

{ js} { js} { js} { js} { js} { js} { js}

{ js} { js} { js} { js} { js} { js} { js}

Unnötiges Datenaufkommen

62 × DNS Abfragen

2.237,2kb

02. INHALTE MINIMIEREN

Ohne Minimierung / Komprimierung

324,3 kb 761,3 kb 1.007,9 kb 143,7 kb

71%

35%

03. AUSLIEFERUNG

css{...} { js} ...

css{...}

{ js}

61%

14%

64%

88%

25%

css{...}

css{...}

css{...}

css{...}

css{...}

css{...}

</>html

{ js}css

{...}

1%

4%

56%

38%

1%

0%

2,9 s

A

B

C

D

E

F

0 68 100

39 96

Pagespeed Score

Yslow Performance Index

25%

36%

7%

CDN

Asset Domain

Beides

{ js}

{ js}

{ js}css

{...}{ js}

css{...}

Caching

Cookie Informationen

Etags

GZIP Komprimierung

Nein

Unnötig

Ja

Nein

{ js}

Ja

Nein

Ja

Nötig

Nein

Ja

Etag

Etags

AJAX

1 Inhalte verteilen

Maßnahmen

Alle Assets sollten Cookieless verteilt werden. Bilder sollten zumindest auf

Asset-Domain(s) liegen, besser im einem Content Delivery Netzwerk (CDN).

2 CSS & JavaScript extern lagern

Es sollte so wenig CSS und JavaScript Code Inline vorhanden sein wie möglich.

Externe Dateien lassen sich besser cachen. Möglichst das CSS im </head> und

JS vor dem schließenden </body>-Tag.

3 Caching ermöglichen

Die Assets sollten lange im Browsercache liegen können, z. B. durch entsprechende

Expire Header. Zusätzliches serverseitiges Caching (z. B. APC, OpCache, MemCache)

verkürzt die Reaktionszeit (z. B. bei Datenbank- oder Objekt-Caching).

4 AJAX einsetzen

Inhalte, die nicht sofort zur Verfügung stehen müssen, sollten asynchron per

AJAX geladen werden. Das gilt für alle Arten von Assets (JS, Bilder etc.).

5 DNS Lookups & Redirects vermeiden

Jeder DNS-Lookup kostet Zeit, jeder Redirect (301, 302) gleich doppelt. Es gilt,

diese so gut es geht zu vermeiden.

{ js}

</>html

css{...}

Im Durchschnitt laden die deutschen Onlineshops in 2,9s. Bei einigen dauert

das Laden über 20s. Im Vergleich werden im Schnitt 68 / 100 Punkte im

Google Pagespeed Score und die Note C im Yslow Performance Index erzielt.

Die Top 100 Onlineshops in Deutschland bewegen sich somit eher im oberen

Mittelfeld. Kaum ein Shop sticht besonders heraus!

Folgende 3 Tipps helfen bei der Verbesserung der Ladezeit und sorgen damit

zusätzlich für einen Wettbewerbsvorteil!

> ANALYSIERTE ONLINESHOPS ZUR LADEZEIT 2015

© 2015 konversionsKRAFT.de Manuel Brückmann / Illustration Patrick Castronovo / Datenerhebung Thomas Kraus

Inline CSS Inline JS

</>html

<head> <head>

<body>

{ js}css{...}34 × 94 ×

CSS im Body JS im Head

{ js}css{...}13 × 30 ×

Webserver DNS Server

Webserver

26 × 301REDIRECT