Neues Layout auf Text & Blog: Journey

Helgoland Düne

Der 4.000. Beitrag in diesem Blog ist ein ganz besonderer, denn er zeigt das Blog in seinem neuen Gesicht. Nachdem ich seit Juli 2007, also seit ziemlich genau 7 Jahren, hier praktisch kaum was am Aussehen des Blogs geändert habe, war es an der Zeit, mal wieder was Neues zu machen. Die Beschränkung auf nur 500 Pixel Breite bei den Bildern und Videos in meinen Blogartikeln störte mich schon länger. Außerdem wollte ich auf ein responsives Design umsteigen (also eines, das die Website auf verschiedenen Bildschirmgrößen unterschiedlich darstellt, je nachdem, ob man sie auf einem großen Monitor am Desktop-PC, am Notebook, auf einem Tablet oder auf einem Smartphone aufruft). Das Ganze sollte insgesamt noch minimalistischer werden, mehr konzentriert auf den Inhalt. Ich glaube, die ganzen Seitenspalten in Blogs werden eh kaum gelesen. Banner-Blindness und so. Also dachte ich mir: weg damit.

Ich habe mich aus all diesen Gründen für das – wie ich finde – angenehm unspektakuläre und sehr reduzierte WordPress-Theme Journey von Tryand entschieden. Fabian bloggt über das Theme und beschreibt seine Gründe, warum er das Template (eigentlich gedacht für Reiseblogger), so wie es ist, angelegt hat. Ich habe das Theme seit vergangenem Wochenende an meine Bedürfnisse angepasst. Unglaublich, an welchen Ecken man überall schrauben muss, um Kleinigkeiten am Layout und am Seitenaufbau zu verändern. Wahrscheinlich habe ich noch nicht an alles gedacht; es kann also sein, dass die nächsten Tage noch hier und da am Template gebastelt wird. Aber im Großen und Ganzen bin ich jetzt erst mal zufrieden. Fahrt mal mit der Maus oben links über das Text & Blog-Logo (Update: Ok, der Transparenz-Effekt ist jetzt kaum noch zu sehen, das wird noch überarbeitet). Und schaut euch das Blog auf dem Smartphone oder, falls vorhanden, einem Tablet an. Was meint ihr? Freue mich auf ehrliche Kritik, Anregungen und Kommentare.

Wer noch mal schauen mag, wie das Blog vorher aussah, hier ein Screenshot vom letzten Outfit, aufgenommen, ehe der Hebel umgelegt wurde.

23 Gedanken zu “Neues Layout auf Text & Blog: Journey

  1. Gefällt mir gut, aber Du hast doch eine Seitenleiste behalten? Oder was habe ich jetzt falsch verstanden?

    Die weisse Menüschrift unterm Logo ist etwas schwer zu lesen auf dem unruhigen Hintergrundbild, finde ich.

    Eine Seitenleiste ist nicht wirklich notwendig, stimmt schon. Man kann auch alles in den Footer packen, Suche, Social Gedöns etc. Ich find’ ganz schön, daß ich die neuesten Kommentare immer gleich oben rechts im Blickfeld habe, und die Nebensächlichkeiten wie Instagram feed, Hinweise auf mein Zweitblog etc. unterbringen kann. Aber brauchen? Nö.

    1. @Kiki: Danke für das rasche Feedback. Hab zwar in der Tat noch eine Seitenleiste behalten, aber diese ist enorm reduziert auf das Allerwesentlichste (für mich sind das v.a. die Kommentare, denn im Gegnsatz zu anderen, die Kommentare sogar abgeschaltet haben, gehören sie für mich zwingend zum Bloggen dazu). Vorher waren es zudem zwei Seitenleisten (siehe Link altes Layout am Ende des Artikels). Und diese eine bleibende Seitenleiste wird wirklich nur bei ausreichend großen Monitoren angezeigt, sonst (kleinere Browser-Fenster, Tablets etc.) rutscht alles in den Footer.

  2. Nett, aber der Untertitel und das Menü links sollten besser zusammen mit der Grafik schwarz auf weißen Untergrund gesetzt werden (Lesbarkeit). Der gekachelte Hintergrund sieht auf 27-Zöllern und bei 100 % nur suboptimal aus, hat was von 90er-Retrolook.

  3. @Torsten: Ist notiert. Ich sammle das (und was noch kommt) erstmal alles. Lesbarbeit lässt sich bestimmt noch durch leicht transparenten grauen Hintergrund verbessern (ähnlich, wie ich es beim Footer gemacht habe).

  4. Wow, da hast du dir ja eine Menge Arbeit gemacht. Mir gefällt gut, dass die Artikel jetzt optisch mehr “in die Breite” gehen. Das finde ich zum Lesen viel angenehmer als die “schmalen” Texte. Die Hintergrundfotos sind schön, bringen aber etwas Unruhe rein, da die einzelnen Artikel oben ja auch noch jeweils ein eigenes Foto beinhalten. Und ja, es stimmt: die Seitenspalten vermisst man als Leser nicht.

  5. @Elke: Danke für die Einschätzung (die dazu noch von einer Stammleserin kommt). Ich sehe schon: am Hintergrund muss ich wohl noch arbeiten. Vielleicht nehm’ ich noch etwas Kontrast raus und mache das Hintergrundbild heller.

  6. Hach! Jedesmal wenn ich ab jetzt diese Seite aufrufe, werden automatisch schöne Erinnerungen abgerufen, das gefällt.
    Allerdings passiert bei mir nichts wenn ich über das Logo fahre (mag aber auch an meinem Rechner liegen). Ich probiere es heute Abend mal auf dem Tablet.
    Auch sonst gefällt mir die Seite sehr gut, ich mag es wenn die Seiten nicht so mit Informationen überfrachtet sind.

  7. Hallo Markus,
    sieht schön aufgeräumt aus. Ein paar wertvolle Hinweise hast Du ja schon erhalten (Impressum in linker Spalte hinterlegen, gekachelten Hintergrund anschauen etc.). Ich ergänze mal, was mir auffällt.
    Versuche doch mal, auch dein Logo responsive zu machen. Wenn ich das Browserfenster verkleinere, kann ich das Logo nämlich nicht mehr erkennen.
    Die rechte Spalte verschwindet ja ab einer gewissen Breite nach unten. Sieht erstmal ein bisschen unaufgeräumt aus, bis die einzelen Punkte dann irgendwann untereinander stehen.
    Dass sich bei kleinen Bildschirmbreiten bzw. Browserfensterbreiten die linke Spalte über das Logo reinschieben lässt (Slide-in), darauf muss man erst kommen. Hier bietet sich eher ein Menüsymbol (drei Striche) an, ich weis aber nicht ob und wie sich das in WordPress einfach umsetzen lässt. Zudem versteckst Du so das Impressum, denn es steht ja nur dort, wenn ich es richtig sehe und ist nur mit einem Klick mehr zu erreichen. Muss es mir aber auch noch mal auf Tablet und Smartphone anschauen.
    Viele Grüße aus Hannover
    Michael

  8. @Gabi: Ja, das Bild ist auch nicht ganz zufällig als Hintergrund ausgewählt worden. 😉 Zum Logo: Da wurde zuvor eine Transparenz erzeugt, d.h. man sah das Hintergrundbild unter dem Logo durchscheinen. Dieser Effekt ist jetzt kaum noch sichtbar, weil ich den Kontrast aus dem Hintergrund rausgenommen und es ganz hell eingestellt habe.

  9. Wer sind Sie? Und was haben Sie mit Text&Blog gemacht? Wo sind meine römischen Banner? Hach, dieses Internet! Ständig muss man sich an neue Sachen gewöhnen.

    Herzlichen Glückwunsch auf jeden Fall und auf die nächsten 4000., mit viel Bibliothekszeug!

  10. @Michael: Also das Mini-Logo werde ich jetzt nicht mehr anpacken. Ich finde die Idee gut, dass das Logo fast schon faviconhaft, quasi als Minilogo, verkleinert als Platzhalter für das eingeklappte Menü da ist. Du hast schon recht, da muss man erst mal drauf kommen (und bei anderen Logos, die die volle Fläche von 220×220 Pixel ausnutzen, funktioniert das zugegeben sicher auch besser, doch ich denke, damit kann man/ich leben). Hoffe, Du auch.
    Den Rest, linkes Menü mit Impressum und Kontaktformular, hab ich jetzt schon mal umgesetzt.

    @CH: Für Nostalgiker befindet sich am Ende des Artikels ein Screenshot der alten Version. Und die Geschichte der Bilder von der römischen Ausgrabungsstätte Villa Borg kann jederzeit im Blog nachgelesen werden.
    Danke für die Glückwünsche. Und es wird nachwievor auch immer wieder Bibliothekarisches hier geben (der Artikel vor dem Layoutwechsel war ja wieder so ein Blick in meine Arbeitspraxis in die Stabi). Dort arbeiten wir auch gerade an einem längerfristig geplanten Relaunch. Natürlich spielt auch dort das Thema Responsives Design eine wichtige Rolle. Dazu aber ein anderes mal mehr.

  11. Wow, ein sehr hübsches Layout hast du da gebastelt. Ich finde es wesentlich aufgeräumter als das alte. 🙂

    Was mir auffällt: Der “About Me”-Teil fehlt jetzt, den Du vorher oben rechts hattest. Ich finde es durchaus wichtig, als neuer Besucher zu erfahren, wer denn da schreibt. Ins About gucke ich fast immer, wenn es da ist. Ich würde das daher entweder ins Menü links mit reinnehmen oder rechts in die Seitenleiste auch nach oben setzen.

    Und wenn Du die Aktion “Tweet der Woche” behalten willst, hat der Button sicher rechts in der Seitenleiste ganz unten (oder über “Meta” oder sogar über “Kategorien”) auch noch Platz. 🙂

    Zur Lesbarkeit wurde ja schon was gesagt: Ich finde das Menü mit Impressum und Kontaktformular noch zu unscheinbar. Eventuell #000000 als Schriftfarbe oder pro Menüpunkt einen nichttransparenten Button?
    Das Logo würde ich fast ohne weißen Hintergrund nach ganz oben links mit minimalem Abstand setzen. Bei diesem Hintergrund würde es sich dort meines Erachtens schön einfügen.

    1. @CarlKnutsen: Danke fürs Feedback. Um nicht den Fehler zu machen, doch wieder zu viel in die Seitenleiste zu packen, hatte ich mich entschieden auf ein direkt auf der Startseite lesbares About me zu verzichten. Aber im Impressum steht ja Einiges über mich. Deshalb hab ich die Seite jetzt umbenannt in “Impressum – Über mich”. Guter Hinweis, danke. Mal schauen, was mir da noch einfällt. Das Logo zu versetzen, wäre keine gute Idee, es trägt wesentlich zum Aufbau der Seite bei, es stark zu verändern, würde den durchdachten Aufbau des Layouts zerschießen. Ich lass das mal lieber so. An der Lesbarkeit des linken Menüs werd’ ich noch arbeiten. Hatte die Schrift zuerst auch in Schwarz, doch das ist sehr hart und passt nicht zur sonstigen Tonalität der Seite.

  12. Heute morgen habe ich mit dem iPad schon einen ersten Blick auf das neue Layout geworfen, jetzt nochmal vom PC aus. Mir gefällt der aufgeräumte Look sehr gut, bessere Lesbarkeit der Beiträge, etc.

    Was mir wirklich fehlt in der linken Spalte sind die letzten Kommentare. Das fand ich immer sehr hilfreich, weil man gleich sehen konnte, ob es Folgekommentare gab oder nicht, ohne dass man erst noch den Beitrag an sich öffnen und ganz nach unten scrollen musste, um zu gucken, ob neue Kommentare bzw. Antworten da sind oder nicht.

    Ansonsten herzlichen Glückwunsch zum 4000. Beitrag und zum neuen Layout!

  13. @Liisa: Danke auch Dir für Deine ersten Eindrücke. Die letzten Kommentare werden immer oben rechts angezeigt (s. Screenshot, den ich neulich schon getwittert habe). Nur auf kleinen Bildschirmen (oder, wenn man den Browser am PC nur in einem kleinen Fenster öffnet) rutschen die letzten Kommentare nach unten in den Footer.

  14. Also ich gucke mir jetzt das Layout am Browser (Firefox neueste Version) am PC im großen Fenster an und die Kommentare sind ganz unten. Rechts wird mir keine Spalte angezeigt.

  15. @Liisa: Das ist seltsam. Die anderen sehen die Kommentare ja auch. Kann jetzt erst mal nichts weiter dazu sagen. Außer, dass Du vielleicht mal die Fenstergröße des Browsers variierst. Oder Du hast nur eine sehr kleine Auflösung eingestellt? Vielleicht nur 1280×1024? Die rechte Spalte wird im responsiven Design erst ab 1400 Pixel dargestellt.

  16. Schön aufgeräumt ist es. Ich kann zu gut dich verstehen, nach all den Jahren mal etwas anders zu haben. Mir fehlen bisher eigentlich nur die Anzahl der Kommentare des jeweiligen Artikels, wenn man auf der Startseite oder auf Archivseiten ist. Und beim Bild links oben hätte ich ja eher damit gerechnet, dass dort dein jeweiliges Twitter-/Google+-/Facebook-Gesicht zu sehen ist 🙂

    Ach, und könntest du die Ausrichtung des Texts bei kleinen Größen von Flatter- auf Blocksatz ändern? Lasst sich bei wenigen Worten pro Zeile besser lesen, denke ich.

    1. @Michael: Das wird ja hier richtig zum Wünsch-Dir-Was, aber wenn man nach Feedback fragt, soll man auch froh sein, es zubekommen. Das sind alles gute Anregungen, ich werde sehen, was ich davon umsetzen kann. Mein Gesicht hab ich hier ganz bewusst nicht im Blog eingesetzt, das ist eh auf so vielen Känälen präsent ud bei jedem Kommentar sieht man es auch wieder .;)

      @Liisa: Ok, dann müssen wir, bzw. Du, wohl damit leben. Danke aber für’s Daumen hoch.

      @Dörte: Das freut mich ganz besonders. Ja, das Frickeln am Relaunch hat Spaß gemacht und es freut mich, dass das Layout jetzt eine fröhliche Atmosphäre ausstrahlt.

  17. Sehr schön. Da gibt es nix zu meckern 😉 – Ich hoffe, das Ausprobieren mit dem Design hat so viel Spaß gemacht, wie die fröhlichen Farben und die Strandatmosphäre des Hintergrundbildes in HH es vermuten lassen. Liebe Grüße

  18. Okay, Markus, es liegt dann wohl tatsächlich an meiner Auflösung.Ist nämlich tatsächlich1280×1024? Mehr geht bei mir offenbar auch gar nicht. Tja, da hab ich dann sozusagen “Pech”. Muss ich im Ernstfall halt scrollen.
    Insgesamt von mir jedenfalls auch ein Daumen hoch zum Relaunch.

  19. Wenn es mir gestattet ist: ich finde die gekachelten Bilder im Hintergrund etwas unruhig, ansonsten gefällt mir das schon sehr schön. Gruß an die Elbe…

  20. @Aquii: Danke für die ehrliche Einschätzung. Ich habe ja darum gebeten, deshalb ist es natürlich gestattet, hier entsprechend Kritik zu äußern. Im ersten Entwurf war das Hintergrundbild noch viel stärker zu sehen. Damit es hinter den Inhalten noch mehr zurücktritt, habe ich es schon stark aufgehellt und den Kontrast deutlich reduziert.

Schreibe einen Kommentar zu Liisa Antworten abbrechen

Deine E-Mail-Adresse wird nicht veröffentlicht.