Nach dem ganzen Prüfungsstress habe ich nun Zeit gefunden endlich das neue Design aufzusetzen und im selben Atemzug auch dem 4pple.de Backend ein Wordpress-Update zu spendieren. Nun ist es da, auch wenn es hat länger gedauert hat, dennoch hat sich gelohnt. Ich finde es ganz gelungen! Ich hoffe euch gefällt es auch so gut.

Neue Funktionen

Ich habe sehr viel Zeit in den Feinschliff von CSS und XHTML gesteckt. Vor Allem die korrekte typografische Anpassung war mir insbesondere wichtig — denn es gibt nichts schlimmeres als schlecht lesbare und unüberschaubare Webseiten. Ich hoffe hier ein gutes Produkt geschaffen zu haben.

Code

Da ich des öfteren doch einmal das Terminal schwinge, ist es insbesondere wichtig, gut Code in den Lesefluss einzubinden. Hierfür habe ich drei unterschiedliche Möglichkeiten geschaffen, einmal Code wie z.B. echo 'Hello world!' direkt in den Fließtext einzubringen. Für die größeren Codeschnipsel gibt es die CSS-Klasse .code-80:

Dieser geht über die ganze Zeile und es passen genau 80 Zeichen von fester Laufweite in jede Zeile hinein — genau wie in unserem Terminal. Ist der Code mal umfangreicher, wie z.B. bei einem Ausschnitt aus einem Script, braucht es oftmals mehr als 80 Zeichen pro Zeile. Die CSS-Klasse .code-n ist dabei hilfreich:

Typografie

Wie bereits angesprochen, wurde viel in die Typografie investiert. Gut lesbar war das Motto. Worauf ich auch geachtet habe, ist, dass die typografischen Besonderheiten der deutschen Sprache berücksichtigt wurden. Als Beispiel, der q-Tag für das kleine zitieren: Das also war des Pudels Kern! Aber auch für das größere Zitat, den blockquote, ist gesorgt:

Daher denn auch der Mathematiker seine Formelsprache so hoch steigert, uns, insofern es möglich, in der meßbaren und zählbaren Welt die unmeßbare mitzubegreifen. Nun erscheint ihm alles greifbar, faßlich und mechanisch, und er kommt in den Verdacht eines heimlichen Atheismus, indem er ja das Unmeßbarste, welches wir Gott nennen, zugleich mitzuerfassen glaubt und daher dessen besonderes oder vorzügliches Dasein aufzugeben scheint.

Ja, Goethe hat schon was …

Verschiedenes

Nun gut, dies kann man auch noch fast der Typografie zuordnen, aber egal: Die Smileys. Diese hingen so hässlich irgendwo im Text umher, hier ordnen sie sich nun wie Kleinbuchstaben ein. Das freut den Textfluss.

Und dann gibt es noch eine kleine E-Mail-Schutz-Anti-Spam-CSS-Klasse, hier span.email, anbei ein Dankeschön an Marc, von dem dieser gewiefte Trick stammt. Die E-Mail-Adresse wird im Impressum geändert und ich hoffe diese erhält kein Spam mehr!
Momentar noch etwas rudimentär, aber in Zukunft noch besser: Tastenkombinationen. Oftmals wird in Artikeln beschrieben, dass man doch eine bestimmte Tastenkombination drücken solle, dies wird in Zukunft besser hervorgehoben. Die CSS-Klasse .key realisiert eine Tastenkombination wie ⌘ T.

Was noch muss

Die Grundfunktionen stehen, aber ich möchte noch einige weiteren Funktionen hinzufügen.

Roadmap

• JavaScript-Diagramme mit Flot
• TweetMeme Button
• CSS-Klasse um
• Ordnerpfade darzustellen
• Navigationspfade zu veranschaulichen
• diese CSS-Klassen mit z.B. Bildern stärker hervorheben
• Konsequentere Artikel-Struktur
• Was mir im Betrieb einfällt

Ich hoffe ein schnelles, leichtes und modernes Template gebaut zu haben. Für Kritik bin ich natürlich offen!

Will ich auch

Da mein Template OpenSource ist, kannst du es gerne kopieren und studieren!

Der Artikel „Das neue Design ist da!“ wurde von Sven verfasst und am 18.02.2010 um 18:50 Uhr unter der Kategorie Allgemein veröffentlicht. Dieser RSS 2.0 Feed informiert über die neusten Kommentare. Über einen Kommentar, oder Trackback würde ich mich freuen.