Bin am Schrauben. u1amo01.de sieht gut aus und passt sich an kleine Bildschirme an.

Für das Blog kommt der gleiche Aufbau und das fast gleiche, leicht erweiterte CSS zum Einsatz. Nur das mit der Darstellung auf Handys klappt nicht. Wahrscheinlich habe ich irgendwo ein falsches Komma gesetzt. Oder so.

Mir gefällts.

Bin gestern bei einer Google-Suche auf meinem eigenen Blog gelandet. Zumindest sah es auf den ersten Blick so aus. War ein s9y-Blog mit 2k11. Das Standard-Layout sieht so gut aus, dass mir Änderungen schwer fallen. Und große Bilder im Header habe ich wegen der Bandbreitenverschwendung noch nie gemocht.

Also zurück zur Füllhalterversion. Die kommt ohne mir unbekannte Scripte aus. Auch wenn Änderungen des CSS' nicht ganz so einfach wie eine Fahrradwartung sind. Muss die Anpassung an alle möglichen Ausgabegeräte eben noch ein bisschen warten.

u1amo01.de, 320x480 Ansicht iPhone

Ehe ich über die Website der gefräßigsten besten Big Band von allen herfalle, übe ich an meiner eigenen Webseite. Mühsam ernährt sich das Eichhörnchen ...

Ach ja, das Heft »Responsive Web Design« von Ethan Marcotte kann ich empfehlen (Dan Cederholm hat das Werk schon vor Monaten gelobt – ja, ich weiß ich bin spät dran. Besser zu spät als nie).

Die Füllhalterversion dieses Blogs wurde so gelobt, dass ich mich fast nicht traue, das nach 3 Monaten zu ändern.

Aber Lesbarkeit geht vor. Jeden Tag sehe ich Dutzende von Leuten im Zug, die mit ihren Smart Phones spielen. Höchste Zeit also, diesem Trend Rechnung zu tragen. Die Zeiten, als man eine Webseite für zwei, drei gerade übliche Bildschirmgrößen bauen konnte, sind vorbei.

Das Theme »2k11« von Matthias (soll beim nächsten Serendipity-Release Standard werden enthalten sein) hat mir auf den ersten Blick gefallen. Und es passt sich automagisch an eine Vielzahl von Anzeigegeräten an. Bis ich das selbst so zusammengestrickt bekäme, müsste ich eine Menge lesen und herumprobieren. Und dann wäre es immer noch nicht halb so gut.

Also – tataaa! – hier ist das neue Bloglayout: »2k11« mit einer Handvoll zusätzlicher Zeilen in der user.css. Wie das auf verschiedenen Kleingeräten aussieht, kann man sich über das nützliche Tool von Matt Kersley ansehen.

Vor einigen Jahren habe ich unsere Bandwebsite http://www.buenotebigband.de/ komplett überarbeitet. Danach habe ich hauptsächlich an der Verbesserung der Navigation gearbeitet. Seit 2008 wurden nur noch Kleinigkeiten geändert, wie z. B. die letztes Jahr eingebaute Timeline.

Mittlerweile hat sich die Webwelt weitergedreht. Früher war es ausreichend, beim Design an einige wenige Bildschirmgrößen bzw. Auflösungen zu denken. Heutzutage gibt es mehr Ausgabegeräte und Formate, als man sich merken kann: PCs, Notebooks, iPads, Smartphones und so weiter.

Also höchste Zeit, auch als Hobbywebmaster den Hintern hochzukriegen. Und sich mit aktuellen Techniken beschäftigen. Eine gute Übersicht an Lesestoff dazu bietet Matthias unter Responsive Ressourcen 2011.

Wer lieber Papier in die Hand nimmt: da kann ich die kurz und bündig verfassten Hefte von »A Book Apart« empfehlen.

PS: die Blue-note-Seite im Wandel der Zeit kann man sich in der Artikelkomplettansicht anschauen.

Nachdem ich entdeckt hatte, daß mein Bloglayout verblüffend den Fahrkartenautomaten der Bahn ähnelt, musste etwas anderes her.

Ein schöner Header in »Scriptina« oder einer englischen Schreibschrift. »Libelle« hat mir gut gefallen. Nur wollte ich keine 75,- EUR dafür zahlen.

Schließlich dachte ich: vergiß all die sterilen Schriften und schreib den Header selbst.

Gesagt, getan.

Alt:

Neu:

Was sich geändert hat? Der Header ist handgeschrieben, die Lila-Links wurden durch Tintenblau ersetzt, die runden Ecken der Boxen wurden begradigt und Schatten gibt es auch keine mehr. Ich gebe zu, dass das nur Kleinigkeiten sind. Eigentlich sollte sich noch mehr tun; nur habe ich in der Zwischenzeit ein anderes Blogsystem gesehen, das ich vielleicht ausprobiere. Mal sehen.

Als ich neulich einem Fahrkartenautomaten der Bahn fasziniert beim Booten von Windows XP zugeschaut habe, ist mir aufgefallen, dass mein Blogdesign dem neuen Design der Automatenoberfläche verflixt ähnlich sieht.

Ach du liebes Lieschen!

Ich sollte mir schleunigst etwas neues einfallen lassen ...

Das Kinoblog nebenan hatte schon immer einen dezenten schwarzen Header mit einem Schriftzug in »Kinescope«.

Zeit für etwas neues. Den Experten muss ich ja nicht sagen, was das für ein Filmstreifen ist.

Nachdem dieses EDV-Thema mit dem Monitorpapier und dem grünen Rand schon seit unglaublich langen Wochen zu sehen war, habe ich angefangen umzubauen.

Nein, lieber Leser, lamentieren hilft nicht. Widerstand ist zwecklos. Das ist mein Blog. Früher hat man an der elektrischen Eisenbahn herumgefrickelt, heuer muss das Blog dran glauben.

Das vorherige Layout war um Ostern entstanden und wurde deshalb natürlich »Osterei« getauft. Dank des Statistikwerkzeugs Piwik hatte ich festgestellt, dass mehr Besucher als gedacht über Suchmaschinen hier landen. Und deshalb das Blog leicht modifiziert. Weil Piwik schuld war, hieß das Layout dann zwischendurch »Kiwi«.

Die aktuellen Farben stammen vom Cover einer Count-Basie-Platte. Und wie heißt dann das aktuelle Thema? Eben.

Wie immer bei Umbauten ist noch (?) nicht alles perfekt. Und wie immer kann es sein, dass mir morgen die alte Version besser gefällt. Nun ja. Schaun'wer mal.

Für optimale Lesbarkeit wird eine Anzahl von 45 bis 75 Zeichen/Zeile empfohlen. Der folgende Satz aus dem bekannten Blindtext hat einen Mittelwert von 69 Zeichen:

Lorem ipsum dolor sit amet, consectetuer adipiscing elit accumsan

Ich bin ein Satz mit einer Zahl von 46 Zeichen.

Dies ist ein Satz mit genau der als Max. empfohlenen Anzahl von 75 Zeichen.