Gedanken zum Layoutwechsel

Nun möchte ich gern einige Gedanken, die ich mir im Vorfeld – bevor das neue Design entstanden ist – gemacht habe, hier näher erläutern.
Vorweg – vielen Dank für die Denkanstöße, ich fasse Kritik nicht negativ auf und hoffe dadurch zu lernen. Also nochmals vielen Dank an die schnellen und fleißigen Schreiber, die ihre Gedanken und Probleme mit dem neuen Layout haben.

Natürlich habe ich gehofft, dass es gefällt und nun übersichtlicher und einheitlicher daher kommt. Ich bin im letzten Jahr mit WordPress gewachsen – in jeder Hinsicht, zuvor entstanden Layout rein statisch und im besten Fall mit kleinen CMS-Systemen. Im Laufe der Zeit ist das Theme, welches ich zuvor verwendete, gewachsen. Dieses Theme war keine Eigenentwicklung, sonder basierte auf dem default-Theme von Michael Heilemann. Da wurde hier geschraubt und da gebastelt, aber es war eben nicht mein Theme.
Ebenso lange verfolge ich meine Statistik und diverse weiter Tools, mit dem ich erkennen kann, woher die Leute kommen. Die Besucher kommen vorrangig von Suchmaschinen oder über Links anderer Websiten – das ist wunderbar, hat aber im alten Theme den Nachteil, dass sie in der Regel nur den einen Artikel lesen und wieder verschwinden. Die Darstellung war auf die einzelnen Beiträge beschränkt und es gab keine Navigation. Viele Dauerleser meines Blogs verfolgen die Beiträge ausschließlich per Feed, was ich sehr schätze und auch nicht missen möchte. Aber diese Leser kennen das Design oft nicht und sind, wie ich auch, nur auf die Inhalte aus – die es zum Ende hin ja auch ausmachen.
Nichtsdestotrotz war es mir wichtig, dass der Teil, in dem der eigentliche Inhalt ist, also die Beiträge, am besten ins Auge fällt. Deshalb wurde er rechts platziert und die Zeichen sind größer dargestellt. Übrigens ist es keine Seltenheit, dass die Navigation links ist, siehe einfach-persoenlich und sw-guide, um nur zwei populäre deutsche Blogger zu nennen.
Übrigens Enrique – ich bin ein Fahrradfan und hatte mal einen Drahtesel, Baujahr 1939 deutsch, der besaß nur Linksgewinde. 😉
Den Hinweis zum Headerproblem habe ich angenommen und auch verändert. Das Design ist nun sogar unter einer Auflösung von 800x600Pixeln zu lesen, ohne Horizontalscrollen.

Die Inhalte in den beiden Sidebars auf der Linken Seite wurden nicht aufgestockt, sie enthalten den gleichen Inhalt, wie auf der ehemaligen Seite. Der erste Sidebar enthält die eigentliche Navigation und im zweiten Sidebar gibt es Zusatzinfos für den Leser, passend zum Artikel, ebenso die Top 10 der meistgelesenen Artikel.
Im weiteren habe ich die Templates schlank gehalten und habe das auch beim Stylesheet versucht, obwohl ich einige Sachen dort zusammen fassen könnte, was aber zu Lasten der Übersicht im Stylesheet fallen würde.
Natürlich habe ich das Layout validiert und in den meisten Fällen komme ich auch ohne Warnungen aus. Ebenso habe ich die bekannte Semantik auf der Seite umgesetzt.

Wie ist das Design nun entstanden?

Grundlegende Idee war – Content rechts und verhältnismäßig groß, Navigation links und Quicknavi in den Header. Die Quicknavi wurde auf der alten Seite immer gelobt, so dass ich sie für wichtig hielt. Der Unterschied ist nun, sie ist im Header platziert und ich habe dies zum Anlass genommen, diesen in fähigen Browsern zu fixieren, was soll auch sonst eine Quicknavi da oben. Als Ausgansgröße waren 1024 Pixel in der Breite anviesiert. Aktuell sollte es auch noch unter 800 Pixel Breite laufen, da ich die Page auf max-width gestetzt habe, so dass das Layout sich verkleinert, wenn die Auflösung nicht ausreichend ist.

In ca. 30-40 Stunden ist dann das neue Layout entstanden, wobei ich sehr wenig Grafiken verwende und so wenig Arbeit im Grafikprogramm hatte und mich mehr auf die Templates und das Stylesheet konzentrieren konnte. Die Templates sind wie immer mit Notepad++ und das Stylesheet mit dem Firefox und dem Webdeveloper-Plugin entstanden. Das Validieren überlasse ich ebenso einen Plugin für den Firefox – HTML Tidy, der mir immer aktuell alle Fehler und Warnungen anzeigt. Leider klappt das nicht immer, was zu Teil an dem Plugin für die Code-Darstellung liegt und an den Affiliate-Inhalten, die auch nicht immer xhtml-Konform sind.
Das aktuelle Design kommt nun mit 71 Kbyte incl. Grafiken aus und ich hoffe es ist ausreichend schnell. Auch in Zeiten von Bandbreite halte ich schlankes Design für wichtig, den gleichzeitig laufenden Anwendungen über die Leitung steigen und schon macht sich jedes Bit bemerkbar. Den einzigen kleinen Luxus den ich mir nun noch gönne, sind die Gravatare, da ich finde, dass sich Kommentatoren besser identifizieren können und das Zufallsbild im Header, welches sicher in Zukunft ein wenig Abwechslung in den Header bringt.
Im Zusammenhang mit dem neuen Layout habe ich dann auch meinen Atom-Feed auf Version 1.0 gebracht und das Print-Layout angepasst, so dass im Falle eines Ausdrucks von Artikeln wirklich nur der Artikel auf dem Papier erscheint und nicht unnötiger Inhalt.
Als kleinen Hinweis am Rande – ein schönes Plugin von Alex King hat mir dabei geholfen, Links aufzustöbern, die im Laufe der Zeit verändert wurden oder nicht mehr existieren – 404 Notifier.

Zum Abschluss bleibt mir nur zu hoffen, fühlt euch wohl, auch wenn es erstmal anders ist.

** Vielleicht hat ja der eine oder andere nun auch Lust ein eigenes Design zu erstellen, dazu muss man kein bestehendes Theme nutzen und dieses anpassen. Außerdem macht es eine Menge Spass und man lernt wieder dazu. Ich habe ausschließlich mit den obigen Werkzeugen gearbeitet. Zusatzlich dient mir nur ein wenig Nachschlagewerk in Sachen CSS und WordPress-Template-Tags.