In eigener Sache: Redesign meines Portfolios
Ich habe so eben den Relaunch meines Portfolios vollzogen und möchte die Gelegenheit nutzen, ein wenig darüber zu erzählen. Denn mein Plan war nicht nur, es so gut wie möglich aussehen zu lassen. Es sollte auch responsive sein, also auf allen Geräten mit Browser funktionieren. Und das, ohne eine separate Mobile-Version zu entwickeln. One template to rule them all, quasi.
Design und Layout
Das Design hat sich nicht großartig verändert, da ich das vorige immer noch zu sehr mochte. Ich binde weiterhin Fotografien von mir als Hintergrundbild ein, allerdings nur für die Desktops. Mobile Geräte bekommen aufgrund der Datenmenge eine Kachel. Zudem wirken die Fotos auch nur auf größeren Auflösungen.
Die kubischen Module gibt es auch weiterhin, allerdings mit dezent angerundeten Ecken. Die Webfont sind nun PT Sans, PT Narrow und PT Serif. Das Blau als Signal- und das Pink als Linkfarbe, bleiben weiterhin bestehen. Im Großen und Ganzen ist das Thema also beibehalten worden, außer dass die Seite nun eine Single page ist.
Entwicklung
Als Framework habe ich wieder auf Smarty gesetzt. Von XHTML 1.0 strict habe ich mich verabschiedet und verwende nun HTML5 mit Modernizr, damit mir IE-Nutzer nicht wieder die Ohren vollplärren.
Das responsive Layout kommt von Bootstrap, welches ich allerdings anpassen musste, wie schon hier beschrieben. Ansonsten funktioniert dies ganz gut, da ich auf das Layout nicht fluid haben wollte und mir Bootstrap in der Hinsicht viel Gefrickel erspart hat. Die JS-Library von Bootstrap brauchte ich allerdings nicht. Die teste ich mal bei einem anderen Projekt aus.
Entwickelt habe ich das restliche CSS mit LESS, lokal kompiliert hat das CodeKit für mich, wobei ich Letzteres nicht mehr missen möchte. Der Vorteil bei CodeKit bzw. dem lokalen Kompilieren ist, dass man LESS nicht mehr per JavaScript einbinden muss, um es clientseitig zu rendern. Was sich positiv auf die Performance auswirkt.
Die Portfolio-Screens werden auf die jeweilige Auflösung komprimiert, sodass man auf dem Smartphone nicht die 1100px großen Bilder laden muss.
Fazit
Abgesehen davon, dass es immer noch viel Zeit und Nerven kostet, für sich selbst zu gestalten, hat es sich dieses mal wieder ausgezahlt, in bestimmten Bereichen auf Frameworks zu setzen. Das perfekte Framework, vor allem im responsive CSS, habe ich noch nicht gefunden. Dafür gibt es aber auch für jeden Anspruch genügend Alternativen geboten.
Was LESS angeht, so werde ich Projekte wohl nicht mehr ohne entwickeln, sofern ich lokal entwickeln kann.
hannes
bin irgendwie ueber deine seite gestolpert und dachte, hm, sieht gut. hab kurz in den code geschaut und dann gedacht ‘ne, das hat er grade erst neu gemacht’. und zack, hier ist der artikel.
daumen hoch. ich follow mal. cheers.
2. März 2012 um 10:20