Sebastian Müller.

Ja Februar. Seit dem 2. Kalendermonat diesen Jahres hat mein Blog ein neues Design. Die Feinanpassungen habe ich dafür schon längst gemacht, die Muse darüber zu schreiben hatte ich allerdings nicht. Ich wurde aber bereits auf meine Beweggründe angesprochen und reiche daher diesen Changelog nun nach.

Hauptproblem des alten Designs war die Größe.
Auch wenn man es nicht sofort mitbekommen hat, der 1. Aufruf der Seite hat insgesamt 23 Bilder, 6 Stylesheets und 8 Javascripte geladen. Insgesamt wurden knapp 800 Kilobyte übertragen. Auch wenn die Javascripte/Stylesheets minimalisiert, komprimiert und in eine Anfrage umgewandelt und ausgeliefert wurden, war die Größe aus meiner Sicht auf Dauer ein No-Go. Zum Vergleich, die Seite von T-Online hat eine ähnliche Größe.

Ein weiteres Manko war die doch eher dunkle Farbgebung. Auch wenn 4 verschiedene Designs integriert waren und gerade das mit den Wolken heller war, ist es schwer Transparenzeffekte ohne dunklere Farben umzusetzen. Ähnlich ging es mir mit dem HTML Teil. Um dieselben Effekte im Internet Explorer zu verwirklichen, musste ich an einigen Stellen zudem absichtlich schlampig arbeiten. Da der IE nur bedingt den HTML und CSS Standards folgt, braucht man für Parameter wie border-radius Alternativen. Um den Effekt zu simulieren habe ich mehrere DIV’s verschachteln müssen, die natürlich durch den mehrfachen Einsatz den Quelltext aufgebläht haben.

Das jetzige Design ist da um einiges einfacher gestrickt. Auch in diesem Design wird die jQuery Bibliothek genutzt, sogar intensiver als zuvor. Mit 46 Kilobyte Gesamtgröße ist sie aber um einiges kleiner und schneller. 4 Bilder, 1 Stylesheet und 1 Javascript Anfragen werden beim ersten Aufruf benötigt um die Seite komplett zu laden. Webpagetest bewertet die Seite nun sogar mit 100/100 Punkten (das Alte bekam 92 Punkte).