< Smashing Book: Erster Eindruck | Mehr zum Smashing Book >

15 Dez 2009 Unique article design mit s9y (Teil 1)

Klaus fragte mich neulich™ per IM, ob und wie „Unique article design“ (vgl. Showcase-Blog bei coldheat.de) mit s9y umzusetzen sei.

Grundsätzlich und etwas oberflächlich lässt sich diese Frage mit „Aber klar. Sogar ziemlich simpel und (mit Einschränkungen) mit Bordmitteln.“ beantworten.

Praktisch ist das nicht ganz so leicht und man muss oder sollte Einiges dabei bedenken. Daher zunächst einmal ein paar Grundlagen zum Thema.

Was ist „unique article design“ überhaupt?

Ich bin darüber zum ersten Mal bei Jason Santa Maria gestolpert: Es bedeutet, einzelnen Artikeln eines Blogs jeweils ein individuelles Design zu verpassen.

Der Einfachheit halber wird man also ein „Basisdesign“ erstellen und dieses dann für einzelne Artikel abwandeln und ergänzen, um nicht für jeden Artikel „das Rad neu erfinden“ zu müssen.

Idealerweise (Jason macht das beispiel- und meisterhaft) passt das individuelle Design in irgendeiner Form zum Thema des Artikels.

Ist das nicht ziemlich viel Arbeit?

Allerdings, zumal das Basistemplate, welches ggf. ein Templategestalter gut auf den Einsatzzweck vorbereitet hat, nur die Spitze des Eisberges ist.

Die individuelle Gestaltung eines Artikels (auch wenn man das nicht mit jedem Artikel machen muss – im Gegenteil, es dürfte eines dieser Dinge sein, bei denen weniger mehr ist) muss der Betreiber des Blogs vornehmen, und dazu muss er sein Blogtemplate sehr genau kennen. Solides Wissen über (X)HTML und CSS sind natürlich ebenfalls unabdinglich, ansonsten dürfte einem so ein Design rasend schnell auseinander fallen oder schlicht unansehnlich werden.

(Es dürfte eher kein Zufall sein, dass die meisten – und schönsten – Blogs, die so etwas machen, irgendeinen (Web-)Design-Bezug haben.)

Kurz gesagt: „Mal eben schnell“ ist hier nicht drin. Idealerweise bereitet man alle Änderungen in einer Testumgebung gründlich vor und probiert die individuellen Designs am konkreten Artikeltext aus.

Und wie funktioniert das nun?

Technisch gesehen – ohne jetzt auf die konkrete Umsetzung innerhalb von s9y einzugehen, die spare ich mir für einen weiteren Artikel auf – bindet man „nur“ ein individuelles Stylesheet für den Artikel ein, in dem bei Bedarf individuelle Grafiken referenziert werden (Stolperfallen: Pfadangaben, Platzverbrauch auf dem Server). In speziellen Fällen kann zudem individuelles Javascript notwendig sein, z.B. wenn man in einzelnen Artikeln individuelle Schriftarten über Image Replacement wie etwa sIFR oder externe Dienste wie TypeKit nutzen möchte.

Darüber hinaus muss man natürlich speziell die CSS-Kaskade und -Spezifizät beachten, damit man überhaupt in der Lage ist, Styles aus dem Basis-Stylesheet im individuellen Stylesheet bei Bedarf zu überschreiben. Beim Einsatz eines Blogsystems oder CMS kommen zudem evtl. vom System und seinen Plugins verwendete Inline-Styles mit ins Spiel.

Was sollte das verwendete Template können?

Idealerweise kann es locker mit diversen Layout- bzw. Positionierungsformen umgehen – es wäre sehr hilfreich, wenn man z.B. in einem individuellen Artikeldesign „mal eben“ etwas absolut oder relativ positionieren könnte, ohne dass einem gleich das Grundlayout um die Ohren fliegt.

Ein weiteres Problem sind die Startseite und Übersichtsseiten (Kategorien), in welchen normalerweise (in s9y zumindest) ebenfalls der komplette Artikel ausgegeben wird, wo aber ein individuelles Design pro Artikel evtl. störend wirkt.

Man sollte also diese Seiten in irgendeiner Form anders „lösen“ – denkbar wäre z.B., auf Start- und Übersichtsseiten nur den Titel des Artikels (evtl. noch einige Metadaten) oder einen kurzen „Teaser“ auszugeben, um die Besucher auf die individuell ausgestaltete Einzelansicht des Artikel zu locken.

Sonst noch was?

Man sollte meines Erachtens bedenken, dass diese Art, ein Design zu erweitern, von Inspiration und Ideen lebt. Wie ich schon schrieb: Meiner Einschätzung nach wirkt so etwas am besten, wenn man das individuelle Design zumindest entfernt an den Artikelinhalt anlehnen kann. Es sind durchaus Blogs denkbar, bei deren Themenspektrum und -vielfalt das schwierig wird bzw. bei denen die Anzahl der Inspirationsquellen arg limitiert ist.

Auch sollte man es in den individuellen Designs nicht übertreiben – oft sind die subtilen Details viel effektiver als das großformatige Foto im Hintergrund oder die coolen CSS- oder JS-Effekte.

Soweit also zu den Grundlagen – die technische Seite der Umsetzung in einem s9y-Blog folgt, wie gesagt, in einem weiteren Teil des Artikels. Und wie immer gilt: Bei Fragen fragen.

2 Trackbacks

Trackback-URL

  1. YellowLeds Weblog: Unique article design mit s9y (Teil 2) (18.12.09, 09:12)
  2. Nur ein Blog: Eigenes Design für einen Artikel im S9y Blog (20.12.09, 15:36)

0 Kommentare

RSS Feed (Kommentare) für diesen Eintrag

  1. Noch keine Kommentare

Kommentar schreiben

Bitte die Hinweise beachten.

Hinweise

Textile-Formatierung erlaubt
Die angegebene E-Mail-Adresse wird nicht dargestellt, sondern nur für eventuelle Benachrichtigungen verwendet.
Gravatar, Twitter, Identica, Favatar Autoren Bilder werden unterstützt.

Pflichtfelder sind mit * markiert.

Kommentare, die mindestens einen Link enthalten, werden moderiert. Kommentare, die mindestens 3 Links enthalten, werden abgewiesen. Sorry – Spamschutz.

Bei Emoticons, die mitten in Sätzen stehen, möglichst keine Nasen einsetzen [ :), ;) usw. ], da es ansonsten im Zusammenspiel mit Textile zu Merkwürdigkeiten kommen kann.