Simple Tagebücher: Blogdesign auf neuen Wegen

Ursprünglich verstand man unter dem Begriff Blog ein simples Online-Tagebuch. Zurück zu den Wurzeln!

  • von Lennart Prange

In einem vergangenen Beitrag habe ich euch bereits Blogazines vorgestellt, einen vollkommen anderen Weg um an das Gestalten von Blogs heranzugehen.

Heute geht es nicht um eine so spektakuläre Möglichkeit, aber auch um Blogdesign. Wer ein kleines, persönliches Blog aufbauen will, braucht kein überladenes Design. Dieser Beitrag zeigt simple und schöne Blogdesigns, die zurück zu den Wurzeln gehen: dem Online-Tagebuch.

Immer mehr Leute springen auf diesen Zug auf und das ist für mich Grund genug, um euch das Ganze näher zu bringen. In diesem Beitrag gibt es wie immer viele Beispiele und Tipps zum Thema.

Was meine ich mit simpel?

Ich meine nicht unbedingt grafisch simpel. Viel mehr vom Aufbau und den Funktionen. Ein Bild kann das wohl am einfachsten erklären.

Christopher Calicott

Wie ihr seht hat das obige Blogdesign lediglich eine Spalte für den Inhalt. Es gibt keine Sidebar rechts oder links. Gleichzeitig ist die Seite natürlich sehr schmal, andernfalls würden die Zeilen auch zu lang werden.

Das obige Beispiel hat wenig mit dem zu tun, was Leser täglich mehrmals sehen: Schöne, aber volle Blogs, die sich eher Magazinen annähern, als bei ihrem Ursprung zu bleiben. Das passt zu einigen Blogs, wie dem Netsetter.

The Netsetter

Manchmal ist so ein Design aber vielleicht auch etwas übertrieben und meiner Ansicht nach sogar unpassend.

Übertrieben?

Der Begriff Blog war ursprünglich eine Bezeichnung für ein Online-Tagebuch, wenn ich mich recht erinnere. Eine eher persönliche und kleine Geschichte. Mittlerweile bezeichnen wir aber auch Webseiten, die sich nur auf bestimmte Themen konzentrieren, viele Autoren haben und hinter denen kommerzielle Absichten stehen, als Blogs. Diese Blogs brauchen vielleicht ein umfangreiches Design mit einer Sidebar, in der sie E-Books, weitere Artikel bewerben können usw. bewerben können.

Nach wie vor gibt es aber immer noch „klassische“ Blogs. Kleine, persönliche Seiten, auf denen jemand seine Gedanken veröffentlicht und vielleicht Fundstücke aus dem Web zeigt. Diese Blogs brauchen nicht unbedingt ein 3 spaltiges Design mit einem extra Bereich für Featured Posts und dem ganzen Schnick-Schnack.

Ganz im Gegenteil: Ich halte simplere Designs für diese online Tagebücher sogar für sehr sinnvoll.

Abgesehen davon, dass ein kleineres Blogdesign, wie das oben gezeigte, meist weniger Arbeit machen wird, als das des Netsetters, machen diese simplen Blogs auch einen ganz bestimmten Eindruck auf ihre Besucher.

Wenn ich auf Seiten wie Web Designer Notes komme, erwarte ich keine umfangreichen Beiträge. Ich sehe sofort, dass hier kleinere Brötchen gebacken werden (was keineswegs negativ sein muss), noch bevor ich den Untertitel “Daily Bookmarks For Web Designer” gelesen habe.

Web Designer Notes

Ein weiterer Vorteil ist, dass derart simple Blogs – jedenfalls auf mich – viel persönlicher wirken. Wie ein Tagebuch.

Ich habe es schon häufig erlebt, dass Blogdesigns einfach mal überhaupt gar nicht zum Inhalt passen. Wenn sich ein Vater, der hin und wieder Fotos von seiner Familie beim Grillen reinstellt und von dem letzten Golfausflug berichtet, und mit einem Magazine Theme arbeitet, geht das einfach nicht zusammen.

Diese Art von Blogdesigns ist dagegen perfekt dafür geeignet, eine stimmige Athmosphäre aufzubauen. Dem Autor geht es einfach nur darum, seine Gedanken und vielleicht Empfehlungen niederzuschreiben und anderen zugänglich zu machen. Das simple Design unterstützt hier den Inhalt.

Zwischenfazit

Wer persönliche Gedanken mit anderen teilen will, kann damit etwas anfangen. Wer aber etwas höher greifen möchte, Werbung in der Sidebar integrieren will und sehr viele Besucher anlocken möchte, wird den Stil wahrscheinlich nicht anwenden.

So eine Seite kommuniziert einfach nicht, dass sie erfolgreich und groß ist und deswegen wird sie es auch schwer haben, groß und erfolgreich zu werden. Denkt euch mal beim Smashingmagazine die Sidebar weg und überlegt, welche Variante einen passenderen Eindruck macht.

Die Umsetzung

Anhand von Beispielen möchte ich euch typische Merkmale dieser Designs zeigen, die euch zweifellos bei der Planung eines eigenen Online Tagebuchs helfen werden.

Das Logo

Im Zentrum des Headers, und das Wort Zentrum kann man hier wörtlich nehmen, ist fast immer das Logo. Es ist das auffälligste Element und eigentlich immer zentriert.

Wichtig ist, dass man sich darüber ein paar Gedanken macht. Es eröffnet die Seite eigentlich immer und da der Blick durch die Größe und Zentrierung des Logos zu erst auf es fällt, sollte es den Leser neugierig machen und einigermaßen gut aussehen.
Man kann mit einem Logo bereits sehr viel erklären, beispielsweise worum es geht. Wenn das nicht gelingt, ist ein Untertitel wie bei fiyo immer sinnvoll. Achtung: Ist das Logo zentriert, muss auch der Untertitel zentriert werden.

Achtet darauf, dass ihr das Logo mit der Startseite verlinkt!

Um das Design etwas interessanter zu machen, kann man, sobald der Besucher mit der aus über das Logo fährt, auch ruhig eine kleine Überraschung einbauen.

fiyo

Die Navigation

Einige verzichten darauf, aber wer eine Navigation haben möchte, kann das natürlich ohne Probleme machen.

Es sind hier nur einige Dinge zu beachten. Da sie normalerweise nicht neben das Logo passt, muss sie entweder darunter oder, Wunder, darüber. Wichtig dabei ist, dass sie dem Logo nicht die Show stiehlt.

Außerdem muss sie, genauso wie der Untertitel, bei Zentrierung des Logos genauso zentriert werden. Andernfalls ist es einfach ein zu heftiger Bruch. Ihr könnt ja mal das Logo zentrieren und die Navigation rechts- oder linksbündig ausrichten. Das geht nicht 😀

Bobulate

Wenn man viele Navigationspunkte braucht, bekommt man Probleme mit dem begrenzten Platz. Es wirkt auch sehr komisch, wenn da plötzlich eine Navigation mit drei Ebenen in dem einfachen Design ist. Man kann vielleicht ein paar Punkte der Navigation in den Footer auslagern oder etwas mit Javascript basteln, wie das bei Broken Kode geschehen ist.

Broken Kode

Der Inhalt

Hier gibt es eigentlich alle Möglichkeiten, die es bei normalen Blogdesigns auch gibt und es gelten die gleichen Ratschläge. Achtet auch eine saubere Typographie. Vielleicht zentriert ihr die Überschriften dann auch noch, das muss aber nicht sein. Wie ganz normale Blogs, kann man hier eine Kommentarfunktion usw. einbauen.

Der Footer

Zwar verzichtet man auf die Sidebar, ein Footer ist aber trotzdem noch da. Und dort werden dann die Informationen abgelegt, die sonst neben anderen in der Sidebar zu finden sind. Da wäre der Link zum Twitter Profil, der RSS Button, die Suche und vielleicht auch noch der kurze Über mich Text.

Hier werden aus einer Spalte auch plötzlich mal 4 Spalten.

Dave Redfern

Da die Sidebar fehlt, muss der Footer mit mehr Infos fertig werden.

Eine Sidebar

Es gibt Möglichkeiten, die Atmosphäre und den Eindruck auf den User zu erhalten und trotzdem mit einer Sidebar zu arbeiten. Ich finde das durchaus sinnvoll. Das Archiv kann ruhig eine kleine Spalte bekommen.

Diese Spalte sollte dann meiner Meinung nach aber auch wirklich schmal sein und nicht viele Elemente enthalten.

Brian Hoff hat das perfekt gelöst:

Brian Hoff

Das Archiv ist unauffällig neben dem Inhalt platziert.

Die „Mini-Sidebar“ macht wirklich überhaupt nichts kaputt.

Detailverliebt

Es ist zwar weniger Platz da und der Fokus liegt absolut auf dem Inhalt, aber das heißt nicht, dass man als Designer nicht Spaß an der Gestaltung haben kann und sich nicht richtig austoben kann.

Ich wiederhole mich an der Stelle mal und nehme erneut die Seite von Brian Hoff als Beispiel. Achtet auf die sehr interessante Typographie, die sanfte Textur und den Rand um die Seite. Der Hintergrund verändert sich auch mehrmals, die Anzahl der Kommentare ist aus der Spalte ausgebrochen und das Logo ist super in Szene gesetzt.

Das Design hält wirklich einige Leckerbissen bereit und sieht klasse aus.

Eine andere interessante Idee findet man auf gondoba.com. Hier kann man die Farben ändern und seinen persönlichen Vorlieben anpassen. Bestimmt keine nötige, aber dafür ganz nette Funktion.

gondaba

Bei gondoba.com kann man die Farben seinen Vorlieben anpassen.

Auf der Seite Jake the Labkann man den Hintergrund dem Wetter anpassen und auch hier brechen einige Elemente aus der Spalte aus.

Jake the Lab

Jake the Lab: Für verschiedene Wetterlagen gibt es unterschiedliche Hintergründe.

Fazit

Wer ein kleines Blog aufbauen will, sollte in diesem Beitrag genug Anregungen für ein passendes Design finden. Bei dieser Art von Blogdesign steht der Inhalt wirklich im Mittelpunkt der Aufmerksamkeit.

Mir gefällt dieser minimalistische und einfache Ansatz seht gut und bestimmt wird sich hier in Zukunft noch mehr tun.

Wenn ihr mit dem Gedanken spielt, euch eine solche Seite zuzulegen, noch ein Tipp von mir: Lasst euch etwas einfallen. Die Möglichkeiten sind, was den Aufbau betrifft, eher gering. Man sollte sich aber trotzem irgendwie von der Masse abheben, vor allem als Designer. Werdet trotz des begrenzten Platzes kreativ und gewöhnt euch erst mal an das neue Format.

Ich bin gespannt auf eure Meinung zu dem Stil und freue mich über Ergänzungen, Lob oder auch Kritik.

14 Kommentare

  1. Lars Ebert
    10. August 2010 um 08:53 Uhr

    Toller Beitrag! Zuerst hatte ich die Befürchtung, dass es wieder eine Liste wird, aber zum Glück nicht. Mir gefällt, dass du, anders als bei einer Liste, detailliert auf die einzelnen vorgestellten Designs eingehst.
    Insgesamt ein lesenswerter Artikel zu einem Interessanten (und für mich neuen) Thema.

    • Lennart Prange
      10. August 2010 um 12:52 Uhr

      Danke für das Lob 🙂 Ich bin auch kein Fan von nackten Listen und deswegen versuche ich hier nicht zu viele davon zu veröffentlichen.

      • Bjorn
        10. August 2010 um 20:49 Uhr

        hallo lennart! deine ideen gefallen mir sehr gut – ich bin auch ein fan des simplizismus 🙂 aber ich denke, es liegt eben an der stark gestiegenen zahl der möglichkeiten, zum beispiel in wordpress (umsetzbar für jeden noob) und deswegen gibt es auch soviele komische und verwirrend designte blogs.

  2. Fimbim
    10. August 2010 um 12:45 Uhr

    Super! Dieser Trend zeichnet sich ja schon länger ab. Ganz ohne Sidebar kann ich allerding nicht so recht! Ich finde es eine gute Idee die Suche mal nach ganz unten zu verfrachten, man scannt ja sowieso einmal die Seite und wenn man nichts gefunden hat, dann ist man unten angekommen und kann gleich die Suchfunktion benutzten…

    • Lennart Prange
      11. August 2010 um 01:28 Uhr

      Danke 🙂 Gerade die Position der Suche ist mir ein Dorn im Auge. Es kommt vor, dass ich auf eine Seite gehe und gezielt nach einem alten Artikel Suche. Ich erwarte das Eingabefeld dann oben oder an der Seite, aber bestimmt nicht im Footer.

      Naja, das ist wohl ein Kompromiss, den man eingehen muss.

  3. nik
    10. August 2010 um 20:51 Uhr

    Guter Artikel. Ich denke, ich werde mir einiges davon zu Herzen nehmen. Reduziertes, funktionsgerichtetes Layout fetzt!

  4. nik
    11. August 2010 um 00:19 Uhr

    Erzeugt Calicot bei Euch auch irgendwelche Malware-Warnungen?

    • Lennart Prange
      11. August 2010 um 00:31 Uhr

      Nein, an keinem meiner Computer. Ich habe den Link vorsichtshalber entfernt.

  5. Dan
    11. August 2010 um 09:59 Uhr

    Toller Beitrag, Layouts mit Schlichtheit den/das Blog das richtige Layout zu verpassen. Danke für die Tipps.

Trackbacks/Pingbacks