UX und Website Design

Ein nutzerfreundliches Design: Nimm Dir ein Beispiel an diesen 5 Blogs

Martin Trauzold
Martin Trauzold
Zuletzt aktualisiert August 6, 2018 6 Min. Lesezeit
Ein nutzerfreundliches Design: Nimm Dir ein Beispiel an diesen 5 Blogs

© Blue Bird / Pexels

Gehen wir 12 Jahre zurück in das Jahr 2006. Damals war das Thema User Experience bzw. die Nutzererfahrung die ein Besucher Deines Blogs oder Deiner Webseite macht, definitiv noch weitestgehend ein Fremdwort.

Überladene Webseiten mit unübersichtlichen Abschnitten, zu langen Absätzen und schrecklichen mobilen Ansichten waren bei vielen Blogs leider Realität und wurden von Seiten der Nutzer akzeptiert. An mobile first bzw. an ein responsive design dachten die wenigsten Betreiber einer Webseite.

Eine bessere Nutzererfahrung – Optimiere Deinen Fashion Blog

12 Jahre später – im Jahr 2018, also im hier und jetzt, ist kein Besucher Deiner Webseite mehr bereit, eine unübersichtliche Webseite zu akzeptieren und wird innerhalb weniger Augenblicke Deinen Blog verlassen.

Das kann sich wiederum negativ auf die Sichtbarkeit Deiner Webseite in den Suchergebnissen der Suchmaschine und folglich auf Dein Business auswirken.

Einige Faktoren sollten daher berücksichtigt werden: Zunächst sollte Dein Blog niemals länger als wenige Augenblicke für den Seitenaufbau innerhalb eines Browsers benötigen.

Die Art und Weise wie Deine Leser innerhalb Deiner Webseite navigieren, sollte darüber hinaus bei allen Design- und generellen Optimierungen für eine bessere Nutzererfahrung stets im Vordergrund stehen und ständig überwacht werden.

Versetze Dich also so oft es geht in die Rolle Deiner Follower bzw. Leser: Was fällt Dir auf, wenn Du Deine Webseite per Desktop, Handy oder Tablet aufrufst? Wie ist die Nutzererfahrung auf den verschiedenen Endgeräten?

Eine gut konzipierte Plattform erhöht die Verweildauer, d.h die Zeit die ein Nutzer auf Deiner Webseite verbringt und erhöht die Wahrscheinlichkeit, dass er zurückkehren wird.

Beispiele für eine bessere Usability

Im weiteren Textverlauf findest Du weitere Beispiele, die eine bessere Nutzererfahrung Deiner Webseite fördern. Nimm Dir im Anschluss ein Beispiel an 5 Webseiten bzw. Blogs, welche sich mit dem Thema einer positiven Nutzererfahrung auseinander gesetzt haben:

Denke wie eine Marke

Obwohl Du möchtest, dass potentielle Leser Deinen Blog durchstöbern, gibt es auf der anderen Seite auch Presse-Agenturen und Journalisten die im besten Fall auf Deinen Blog aufmerksam werden. Diese sollten einen leichten Zugang zu der Kernbotschaft Deiner Marke erhalten und schnell herausfiltern können, was diese einzigartig macht.

Nutze ein responsive Design

Wusstest Du, dass bereits 69% aller User eine Webseite nicht mehr über den Desktop, sondern ausschließlich über ein Mobilgerät aufrufen? Wie macht sich Dein Blog auf einem kleineren Bildschirm? Bei einem responsive Design passt sich der Inhalt Deiner Webseite automatisch an unterschiedliche Bildschirmgrößen an.

Verknüpfe Deine Webseite mit Google Analytics

Finde heraus, wie sich die Sitzungsdauer zwischen einem Desktop und einem mobilen Endgerät unterscheidet. Ergibt sich hier eine größere Differenz, wird es Zeit dies zu ändern.

Probiere auch verschiedene Templates aus

Finde heraus wie sich die Navigation unterscheidet. Nervige, innerhalb weniger Sekunden nach einem Aufruf Deiner Webseite aufploppende Pop-ups solltest Du darüber hinaus deaktivieren, da Webseiten welche diese Arten von Pop-ups verwenden durchaus von Google abgestraft werden können.

Apropo Google: Je besser die Nutzererfahrung Deiner Webseite ist, desto eher steigt auch die Wahrscheinlichkeit, dass Du bessere Platzierungen in den SERPs, also in den Suchergebnissen der Suchmaschine erzielst.

blogs-we-love-ux-design

Nutzt Du WordPress als CMS für Deinen Webauftritt? Dann installiere Dir das Heatmap-Plug-in, um zu sehen, wie Benutzer innerhalb Deines Blogs interagieren.

Durch den Einsatz des Plug-ins kannst Du herausfinden, an welchen Stellen innerhalb Deiner Webseite Du Design-Optimierungen vornehmen solltest, damit Deine Leser z.B schneller Dein Impressum oder Kontakt-Formular finden, um mit Dir in Interaktion treten zu können.

Die meisten Benutzer erwarten, dass ein Link zu diesen Informationen sich im Header oder Footer Deiner Webseite befindet.

5 Beispiele für ein gutes Blog-Design

Obwohl kein Blog perfekt ist, soviel ist sicher, lohnt es sich dennoch, etwas zu recherchieren und Funktionen in Betracht zu ziehen, welche zu einer positiven Nutzererfahrung beitragen.

A Pair & A Spare

5-examples-great-blog-design-collectivegen-de

Das Surfen auf Genevas Webseite macht Spaß, vor allem auf mobilen Endgeräten wie einem Handy. Das Layout nutzt den Platz sinnvoll aus und platziert automatisch den Posttitel über jedes Bild, sodass der Inhalt hervorgehoben wird.

Die Sticky-Navigationsleiste macht darüber hinaus die Suche nach Inhalten zu einem Kinderspiel und auch die Logos der verschiedenen sozialen Netzwerke sind leicht zu finden und das unabhängig davon, wo man sich gerade auf Genevas Webseite befindet.

The Elgin Avenue

5-examples-great-blog-design-theelginavenue-de

Wenn Dein Blog mehrere Themen bzw. Kategorien behandelt, sollten diese so einfach wie möglich zu finden sein. Monicas Navigationsleiste ist bis ins Detail durchdacht und Du erhältst darüber hinaus eine Beitragsvorschau, sobald Du mit dem Mauszeiger über die entsprechende Kategorie auf der Navigationsleiste fährst.

What Olivia Did

5-examples-great-blog-design-whatoliviadid-de

Ein cleanes und dazu etwas skurriles Design zeichnet diese Webseite aus. Neue Beiträge fallen direkt in das Auge des Betrachters und ältere Posts werden clever und übersichtlich im Archiv dargestellt. Auch lässt sich mit nur einem Klick die Ansicht der Posts für die Desktop-Version ändern.

The Chriselle Factor

5-examples-great-blog-design-thechrisellefactor-de

Chriselles Website im Stil eines Magazins gehalten, kombiniert Videos mit wichtigen Kategorien und einer vereinfachten Version für Mobilgeräte.

Refinery 29

5-examples-great-blog-design-refinery29-de

Dieses Beispiel ist kein reiner Blog im klassischen Sinne, sondern soll als Beispiel für eine gelungene Nutzererfahrung dienen. Lass Dich von dieser Webseite inspirieren, vor allem wenn Dein Blog über viele Kategorien verfügt.

Auf der mobilen Ansicht gibt es drei verschiedene Content-Streams, und jede Sammlung von Beiträgen besitzt ein anderes Layout.

Inhalt