Optimierung Stufe 2

Home >> Zettelkasten >> Optimierung Stufe 2

Der nächste Punkt auf der Liste: Bildgrößen. Gerade bei vollflächigen Hintergründen in full HD und mehr wie hier im Theme ein echtes Thema, auch mit aktivem EWWW Image Optimizer.

In der Vergangenheit habe ich schon gute Erfahrungen mit Responsify WP gemacht, deswegen kommt es auch hier testweise mal zum Einsatz – und zeigt schon „out of the box“ deutliche Wirkung: Google Pagespeed steigert die Bewertung für mobil von 36 auf 73 (Desktop von 39 auf 62), bei GTmetrix landet die Seite im grünen Bereich (Pagespeed von 77 auf 90, YSlow bleibt auf 93). Die Seitengröße schrumpft ebenfalls von 6,3MB auf 5,2MB.

Leider fügt das AccessPress Parallax Theme die Hintergrundbilder per Skript als Inline-CSS ein, d.h. sie werden nicht automatisch von Responsify erkannt und angepasst. Ein typischer Fall für ein Child-Theme mit entsprechend angepasster Funktion 🙂
Die Auswirkungen sind ebenfalls deutlich: Die Seitengröße schrumpft auf 2,5MB (Desktop) bzw. 1MB (mobil). Für die anderen Bilder auf der Seite muss ich noch entsprechende Größen festlegen, idealerweise lassen sich damit auch nochmal ~560kB einsparen. (Einige Bilder werden für die Mobilansicht in 150×150 Pixel ausgeliefert und vom Browser dann auf 22×22 Pixel skaliert.)

Endgültige Messwerte stehen wieder hier.

 

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht.

dealer-arrows
dealer-arrows
dealer-arrows
dealer-arrows
livid
livid
livid
livid