Bereit für die digitale Transformation?

Jetzt mehr erfahren
pa­ge­s­peed-op­ti­mie­ren

Jede Se­kun­de zählt – war­um Pa­ge­S­peed so wich­tig ist

Als Mar­ke­ter oder Be­trei­ber ei­nes On­line­shops tut man für ge­wöhn­lich al­les Mög­li­che, um mehr Traf­fic auf der Web­sei­te zu ge­ne­rie­ren. Die Con­ver­si­onra­te soll durch Such­ma­schi­nen- und Af­fi­lia­te Mar­ke­ting er­höht wer­den, es wird Platz 1 auf der Goog­le Er­geb­nis­lis­te an­ge­strebt, um sich so­wohl ge­gen die alt­be­kann­te, als auch die täg­lich neu auf­kei­men­de Kon­kur­renz durch­zu­set­zen. Im Wett­kampf um die Klicks wird aber oft ein sehr wich­ti­ges Kri­te­ri­um au­ßer Acht ge­las­sen: die Web­sei­ten Ge­schwin­dig­keit. Trotz­dem sie in di­rek­ter Ver­bin­dung zu den Con­ver­si­ons steht, küm­mert sich kaum je­mand um ihre Op­ti­mie­rung. Es ist aber in der Tat so, dass man schon durch klei­ne Tricks die La­de­zeit ei­ner Web­sei­te um meh­re­re Se­kun­den ver­rin­gern kann.

Die La­de­zeit wird auch Pa­ge­S­peed ge­nannt und be­schreibt die be­nö­tig­te Zeit, bis eine Web­sei­te voll­stän­dig ge­la­den ist. Je schnel­ler eine Sei­te ge­la­den wird, des­to schnel­ler kann der Be­su­cher die In­hal­te na­tür­lich wahr­neh­men und ent­spre­chend in­ner­halb der Web­sei­te na­vi­gie­ren. Au­ßer­dem sorgt eine schnel­le La­de­zeit auch da­für, dass ein Be­su­cher eine Web­sei­te über­haupt be­su­chen kann und nicht auf­grund lan­ger War­te­zeit den Be­such ab­bricht, be­vor er In­hal­te se­hen konn­te.

Sei­ten­la­de­zeit be­ein­flusst die Con­ver­si­ons

Goog­le als größ­ter Such­ma­schi­nen­be­trei­ber hat den Be­griff Pa­ge­S­peed ge­prägt und ob­wohl ein gro­ßer Teil der Ran­king Al­go­rith­men un­ter Ver­schluss ge­hal­ten wird ist es in der Tat so, dass der La­de­zeit eine durch­aus si­gni­fi­kan­te Be­deu­tung zu­kommt. Die Web­sei­ten Per­for­mance ins­ge­samt ist ex­trem be­deu­tend, um beim Ran­king ganz oben zu lan­den.
Mal von der Op­ti­mie­rung für Goog­le ab­ge­se­hen, eine schnel­le­re La­de­zeit be­ein­flusst vor al­lem die Usa­bi­li­ty in ho­hem Maße! Wer war­tet schon ger­ne ewig, bis ihm beim On­line­shop­ping das Pro­dukt in ver­schie­de­nen Far­ben an­ge­zeigt wird oder bis die Bil­der ei­ner Ga­le­rie ge­la­den wer­den, die man sich an­schau­en möch­te. Dass also ein bes­se­res Nut­zer­erleb­nis ge­schaf­fen wer­den kann, ist nicht von der Hand zu wei­sen.

Das wie­der­um er­höht auch die Ver­weil­dau­er ein­zel­ner Nut­zer, die dem­entspre­chend mehr In­for­ma­tio­nen auf­neh­men oder ein bes­se­res Shop­ping Er­leb­nis ha­ben und des­halb den Be­stell­vor­gang bis zum Schluss mit­ma­chen. Die Sei­ten­auf­ru­fe pro Nut­zung er­hö­hen sich da­durch wie von selbst und die Klick­ra­ten eben­falls. Es ist also de­fi­ni­tiv so, dass E-Com­mer­ce Web­sei­ten Ihre Sa­les in Ab­hän­gig­keit von der Ver­rin­ge­rung der La­de­zei­ten er­hö­hen. Der Pa­ge­S­peed hat also ei­nen mess­ba­ren Ein­fluss, den je­der für sich nut­zen soll­te!

Bes­se­re La­de­zei­ten mit 7 ein­fa­chen Tipps

Trotz­dem es mit we­nig Auf­wand mög­lich ist, den Pa­ge­S­peed zu er­hö­hen, küm­mern sich nur sehr we­ni­ge um die Op­ti­mie­rung. Die fol­gen­den Tipps sol­len Ih­nen da­bei hel­fen, Ihre Web­sei­te auf un­kom­pli­zier­te Art und Wei­se schnel­ler zu ma­chen.

1. Brow­ser Caching ak­ti­vie­ren

Das Brow­ser-Caching sorgt bei­spiels­wei­se da­für, dass wie­der­keh­ren­de Ele­men­te ei­ner Web­sei­te, wie die Logo-Gra­fik, nicht je­des mal neu vom Ser­ver an­ge­for­dert wer­den müs­sen. Eine Ver­bes­se­rung in die­ser Hin­sicht kann er­zielt wer­den, wenn der Web­ent­wick­ler die Ab­lauf­da­ten von Da­tei­en op­ti­miert. Web­sei­ten­in­hal­te, die sich sel­ten än­dern, kann ein län­ge­res Ab­lauf­da­tum zu­ge­wie­sen wer­den, so­dass die glei­chen Ele­men­te nicht im­mer wie­der neu ab­ge­ru­fen wer­den müs­sen.

2. Asyn­chro­nes La­den der Res­sour­cen

Auf den meis­ten Web­sei­ten wer­den alle ver­füg­ba­ren Res­sour­cen di­rekt ge­la­den, ob­wohl sie erst nach ei­ner Ak­ti­on oder ei­nem Scrol­len sicht­bar wer­den. Um die in­iti­al zu la­den­de Da­ten­men­ge so ge­ring wie mög­lich zu hal­ten, soll­ten Res­sour­cen asyn­chron la­den, da­mit In­hal­te erst dann ge­la­den wer­den, wenn sie nö­tig sind und tat­säch­lich ab­ge­ru­fen wer­den.

3. Da­tei Kom­pri­mie­rung

Wei­ter­hin ist es mög­lich, Da­tei­en au­to­ma­tisch zu kom­pri­mie­ren. Nach ei­nem Kom­pres­si­ons-Al­go­rith­mus kön­nen wie­der­keh­ren­den Zei­chen­ket­ten in Da­tei­en iden­ti­fi­ziert und dann in Va­ria­blen ab­ge­spei­chert wer­den, so­dass wie­der­keh­ren­de Text­mus­ter ge­spart wer­den.

4.Bild & Gra­fik Kom­pri­mie­rung

Ne­ben der Kom­pri­mie­rung von Tex­ten kann auch die Bild- und Gra­fik-Op­ti­mie­rung hilf­reich sein. Un­ter­schie­den wer­den kann in ver­lust­freie und ver­lust­be­haf­te­te Kom­pri­mie­rung. Ers­te­re ent­fernt nicht be­nö­tig­te, iden­ti­sche Bild­ab­schnit­te. Die zwei­te Va­ri­an­te macht Bild­be­rei­che aus­fin­dig, die un­ge­fähr die sel­ben Far­b­räu­me auf­wei­sen und gleicht die­se auf ex­akt den­sel­ben Farb­wert an. Die un­ter­schie­de zwi­schen dem Ori­gi­nal und der op­ti­mier­ten Ver­si­on sind für Nicht-Gra­fi­ker so gut wie nicht er­kenn­bar.

5. Code auf­räu­men

Es soll­te au­ßer­dem eine Tren­nung von un­nö­ti­gem Bal­last bei der Pro­gram­mie­rung vor­ge­nom­men wer­den. Kom­men­ta­re und um­fang­rei­che Ein­rü­ckun­gen ma­chen den Code zwar ver­ständ­lich, der Brow­ser be­nö­tigt die­se In­for­ma­tio­nen aber na­tür­lich nicht. Dop­pel­te Leer­zei­chen, Ta­bu­la­to­ren und Zei­len­um­brü­che las­sen sich also voll­stän­dig ent­fer­nen, ohne die Lauf­fä­hig­keit zu be­ein­träch­ti­gen!

6. CSS Da­tei­en kom­bi­nie­ren

Durch Zu­sam­men­le­gung von Da­tei­en kann der Sei­ten­auf­bau eben­falls dras­tisch be­schleu­nigt wer­den. Ers­tens er­lau­ben mo­der­ne Brow­ser so­wie­so oft nur eine be­grenz­te An­zahl an gleich­zei­ti­gen Down­loads, zwei­tens wer­den mit Coo­kies bei­spiels­wei­se In­for­ma­tio­nen mit­ge­sen­det, die gar nicht be­nö­tigt wer­den. Die Kom­bi­na­ti­on von CSS-Da­tei­en bringt also ei­nen gro­ßen Vor­teil mit sich.

7. Above-the-Fold nut­zen

Der Above-the-Fold-Be­reich, der für den Nut­zer auf den ers­ten Blick sicht­bar ist, soll­te mit den wirk­lich wich­ti­gen In­for­ma­tio­nen so­fort ver­füg­bar sein. Alle an­de­ren Da­tei­en soll­ten erst im An­schluss vom Ser­ver an­ge­for­dert wer­den.

Kommentar verfassen: