Redesign des Blogs

Es ist soweit: Ich lasse das neue Blogdesign offiziell vom Stapel!
(Die RSS-Feed-Leser dürfen jetzt einmal hier klicken.)

Insgesamt habe ich jetzt über einen Monat daran herumgebastelt. Die wichtigsten Änderungen auf einen Blick:

• Der Artikeltext ist größer und hat mehr Platz, die Zeilenlänge ist begrenzt. Das sollte besser lesbar sein.
• Das Blog nutzt jetzt explizite Schriftarten (Webfonts).
• Umstellung auf HTML5 (ich muss nochmal gucken, ob auch wirklich alles valide ist ;-).
• Seitenleiste: nur noch eine, weniger Inhalt, unaufdringlicher.
• Responsives Design: Auf kleinen Displays (Handy, Tablet) verschwindet die Seitenleiste, es gibt dann oben eine Mini-Navigation.
• Sinnvollere HTML-Struktur, z.B. kein <h3> für das Datum eines Eintrages.
• Navigationslinks zum vorherigen und nächsten Eintrag in der Artikel-Ansicht (und zwar in der für mich gefühlt richtigen Richtung; alle anderen Blogs navigieren für mein Empfinden genau falsch herum ;-).

Meiner Meinung nach ist das jetzt soweit präsentabel und es sollte sich nichts Grundsätzliches mehr ändern, das ist aber noch nicht komplett das Ende aller Arbeiten. Einerseits werde ich bestimmt noch über das eine oder andere stolpern (vielleicht gibt’s ja auch Leser-Rückmeldungen), andererseits habe ich auch noch konkrete Dinge auf der Liste:

• Alte Artikel anschauen (zumindest die der letzten Jahre, da habe ich ja nicht so sehr viel geschrieben) und gucken, ob bei denen alles in Ordnung aussieht. Dummerweise springen mir dort ständig "falsche" Anführungszeichen entgegen, die ich dann manuell „korrigieren“ muss, das wird dauern…
• Bei den Webfonts kann man sich wohl aussuchen, in welches Problem man läuft: FOUT, FOIT oder lieber FOFT?. Mein aktueller Standpunkt ist: keine komischen Krücken und Sonderlocken, kein gesondertes JavaScript, soll der Browser das mal selber machen. Ich überlege aber noch, ob ich nicht für ganz kleine Displays (Handys) einfach die Standard-Browser-Fonts nehme, um dort den Download zu beschleunigen.
  Ich hatte das @font-face mal eine Zeit lang innerhalb der @media-Selektoren: Das funktionierte im Firefox wie gewünscht, ist aber in CSS nicht erlaubt und damit nur zufällig toll. Keine Schweinereien. Zumindest nicht hier, meine Homepage macht das aktuell noch so.
• Practical Typography macht zwei Dinge, die ich auch übernehmen will: Basis-Fontgröße abhängig von Displaygröße und Seiten-Navigation per Klick auf den linken bzw. rechten Displayrand. Ersteres dürfte recht fix gehen. Letzteres finde ich sexy, aber das benutzt vermutlich eh niemand, weil man ohne Hinweis gar nicht bemerkt, dass es das gibt und weil es nur für die Artikel-Einzelansicht relevant wäre (oder ich muss ganz viel basteln und es auch in Übersichtsseiten einbauen). Und es funktioniert natürlich auch nur dann, wenn die Seitenleiste ausgeblendet ist.
• Um den Blocksatz im Artikel zu verschönern, würde ich gerne noch CSS-Hyphenation einsetzen, aber in meinen Tests habe ich das bisher nicht zum Laufen bekommen. Fehlt meinem Firefox dafür ein deutsches Wörterbuch?

Da kann ich mich also weiter mit beschäftigen. Oder ich suche mir erstmal wieder irgendeine komplett andere Baustelle.

Für die Nachwelt gibt es hier ein paar visuelle Eindrücke: