Aufmerksamkeits-Fokussierung und Usability beim Blog-Layout, speziell auf Mobilgeräten

  • Eigentlich wollte ich schon viel weiter mit dem Relaunch meiner neuen Website sein, aber gerade über das Thema Aufmerksamkeitsfokussierung und Usability (auch im Sinne von Orientierung der aktuellen Position innerhalb der Website) mache ich mir am meisten Gedanken. Da inzwischen meine Website von über 2/3 der Besucher mit Mobilgeräten besucht wird, habe ich mich dazu entschlossen, grundsätzlich die Navigation nur noch per Mobile-Menü anzubieten, zumal diese Menü-Art inzwischen für die meisten Besucher vertraut sein dürfte.

    Aus gleichem Grund (überwiegend Mobil-Besucher) bevorzuge ich auf Mobilgeräten ein Layout, bei dem sich der Content fast immer wie ein langes vertikales Band darstellt. Ein Blog-Layout würde also bei z.B. 15 Beiträgen diese nicht auf drei Blogseiten zu je 5 Beiträgen aufteilen, da dann der User auch "horizontal" denken muss. Zudem könnten so auch die Buttons wegfallen, mit denen zwischen den Beiträgen einer Kategorie direkt hin und her navigiert werden kann. Denn dabei kann der Besucher die hierarchische Übersicht über die Gruppierung und Kategorisierung des Content leicht verlieren. – Andererseits würde der Besucher nach Schließen eines Beitrags bei dieser Gestaltung immer an den Anfang des BlogLayout gelangen und nicht zu der Beitrags-Vorschau, von der er gerade ausgegangen ist. Er muss also suchen, was er schon aus der Kategorie gelesen hat und was er als nächstes lesen möchte.


    Hier drei Möglichkeiten der Gestaltung gemäß der vorigen Überlegungen, die ich zurzeit in Erwägung ziehe:


    a) Die bestmögliche Aufmerksamkeitsfokussierung erreiche ich offensichtlich durch die Verwendung von Modalboxen. Da wird alles überlagert und somit alle Ablenkungsmöglichkeiten vom Content vermieden. Zugleich wird der Platz auf dem Display maximal genutzt, da nicht mal mehr das Signet / Logo und die Breadcrumb-Zeile Platz weg nehmen. Auch wenn man den Content-Bereich der Modalbox auf z.B. 80% Höhe beschränkt, damit noch viel Platz für den "Schließen-Button" oder das Hineintippen in den Freiraum bleibt, ergibt sich ein platzmäßiger Vorteil gegenüber allen anderen Lösungen.

    Allerdings entsprichtdas Öffnen einer Modalbox, um einen Beitrag anzuzeigen, nicht der allgemeinen Erfahrung der User mit ihren Surfgewohnheiten und könnte daher auf Ablehnung stoßen.

    Geprüft habe ich allerdings schon verschiedene Ansichten, ob sich eine schon grundsätzliche Darstellung von Content in Modalboxen SEO-ungünstig auswirken könnte: Nein, tut es nicht! Die Links zum Content der Modalboxen müssen aber von Suchmaschinen wie üblich verfolgbar sein.

    Ein weiterer Vorteil von Modalboxen (und der Lösung b = Readmore): Der dahinter liegende Content bleibt stabil und erleichtert nach Schließen der Modalbox die Rückkehr zum Ausgangspunkt und somit die Orientierung innerhalb der gesamten Website, besonders, wenn es so viele Beiträge zu einem Menüpunkt bzw. zu einer Kategorie gibt, dass sie auf mehreren Seiten zu je 5 oder 10 Beitrags-Intros dargestellt werden. Noch ein Vorteil von Modalboxen: Über den Schließen-Button oder Klick / Tippen außerhalb der Box schließt sich diese. Man muss also nicht nach einer Rückspungmöglichkeit suchen (zurück-Button des Browsers oder Maustaste) sondern hat diese immer unbewusst präsent, falls man den evtl. längeren Beitrag nicht zu Ende lesen will.



    Dann habe ich noch zwei weitere Möglichkeiten, wie aus dem Blog-Layout heraus ein Beitrag (von vielen) geöffnet werden kann, nämlich:


    b) die übliche readmore-Methode, die in Joomla eingebaut ist. Hier besteht der Nachteil, dass die evtl. weiterhin eingeblendete Seitenspalte unnötig Ablenkung erzeugen kann und zudem Platz weg nimmt, vor allem, wenn der Beitrag länger ist und mit weiterem Scrollen die Spalte nur noch Leerfläche zeigt.

    Weiterer Nachteil: Ein Rücksprung zur Blogansicht kann nur über das (Mobile)Menü oder die Zurück-Taste des Browsers / Maustaste oder einen zusätzlich in den Beitrag am Ende eingefügten "Zurück-Button" erfolgen.

    Oder man lässt den "Zurück-Button" an einer fixen Position irgendwo am Rand über dem Content schweben. Und das wirkt nicht nur ablenkend, sondern evtl. wie eine Einladung, das Lesen abzubrechen.

    Dieser "Zurück-Button hätte aber den Vorteil, dass der Link in der Blog-Ansicht genau zu dem Beitrags-Intro führen könnte, den der Besucher gerade gelesen hat. (Wie dies technisch umsetzbar ist, weiß ich allerdings zurzeit nicht. Innerhalb eines Beitrags wäre das eine Sprungmarke und ob man solch eine auch in einem BlogLayout setzen kann, weiß ich nicht.)

    Dass ein User die Breadcrumb-Zeile zur "Zurück-Navigation" benutzt, habe ich durch Befragung im Bekanntenkreis noch nicht gehört.


    c) eine Variante davon, bei der z.B. bei einem Template mit Randspalte beim Öffnen des ganzen Beitrags die Randspalte wegfällt und der Beitrag unterhalb von Signet / Logo und Breadcrumb-Zeile in voller Seiten-Breite angezeigt wird. Damit werden Nachteile der "Readmore"-Lösung vermieden. Zudem wird der Vorteil der Aufmerksamkeitsfokussierung größtenteils erreicht – wenn man vom noch vorhandenen Logo / Signet und der Breadcrumb-Zeile mal absieht.. Die Problematik, das Lesen des Beitrags abzubrechen, um dann in die BlogLayout-Ansicht zurück zu springen, ist aber mit der bei "Readmore" identisch.

    Und die Breadcrumb-Zeile zur "Zurück-Navigation" zu benutzen, ist offensichtlich unpopulär / meist unbekannt.


    Aufgrund meiner detaillierten Beschreibung ist das Layout und dessen Funktionalität sicher auch ohne einen aktuellen Link zur Entwicklungs-Website vorstellbar. Denn dort habe ich teilweise Content drin, der noch nicht für die Öffentlichkeit bestimmt ist.


    Nun bin ich sehr gespannt auf Eure Meinungen und evtl. Anregungen dazu!

  • Betreffend der Rücksprungproblematik / Orientierung möchte ich noch ergänzen:


    Alle drei von mir beschriebenen Methoden führen letztlich zu einem Rücksprung an den Anfang eines Blog-Layout. Deshalb könnte die Orientierung des Users durch folgende Maßnahme erleichtert werden:

    Auf meiner derzeit noch betriebenen Website habe ich im BlogLayout die Kategoriebeschreibung dazu genutzt, wie bei einem Inhaltsverzeichnis für jeden Beitrag einen längeren Text-Link einzufügen, der zugleich auch wie eine Kurzbeschreibung des Beitrags wirkt.


    Da diese Links ja direkt in den Beitrag springen und somit die URL für den kompletten Beitrag enthalten, müsste darauf auch eine Suchmaschine positiv reagieren.


    Wenn ich aber die Google-Tools bemühe, sind zwar alle meine Seiten korrekt gelistet und zugänglich, sind aber dennoch mit den gewünschten Suchbegriffen in Verbindung mit der Ortsangabe in den Suchergebnissen nicht berücksichtigt, auch nicht in den ersten 100 Ergebnissen.

    Aber lieber setze ich diese Textlinks, damit der Besucher was davon hat, als dass ich den Wert der Suchmaschinen-Ergebnisse über Alles setze.