UX Tipps zur Verbesserung der Nutzererfahrung Ihrer Website

Wir alle haben bereits eine Website wieder verlassen, weil sie fürchterlich zu bedienen war: Vielleicht tauchten überall Anzeigen auf oder die richtige Seite konnte nicht gefunden werden.

Was diese beiden Beispiele gemeinsam haben, ist eine schlechte Benutzererfahrung beim Besuch einer Website. Aber auch bei kleineren Fehlern lohnt es diese anzupassen. Dies ist ein oft übersehener, aber sehr wichtiger Aspekt des Webdesigns.

Setzen Sie Pop-Ups gezielt ein

Wenn Sie heutzutage eine Website öffnen, werden Sie meistens sofort mit einem allgemeinen Cookie-Hinweisbanner begrüßt. Sie klicken Sie daher schnell auf die, meist hervorgehobene, Schaltfläche “Auswahl speichern” oder “Akzeptieren” und beginnen mit der eigentlichen Interaktion.

Plötzlich erscheint ein Pop-up, das den aktuellen Newsletter oder das aktuelle Angebot auf der von Ihnen besuchten Website ankündigt. Und wieder wird der Lesefluss unterbrochen, man muss den Banner schliessen und weiß nicht mehr, welchen Abschnitt man gerade liest. Lästig.

Pop-ups sind sehr aufdringlich und verärgern Website-Besucher schnell. Gerade auf Mobilgeräten sind sie ein sicheres Mittel, um Nutzer zu verärgern und im schlimmsten Fall zu verlieren.

Daher wird für die beste Benutzererfahrung empfohlen, keine ganzseitigen Popups zu verwenden. Wenn sie verwendet werden, sollten sie so diskret wie möglich sein: zum Beispiel, wenn ein Website-Besucher die Website verlassen möchte, oder nur, wenn ein bestimmter Prozentsatz der Website besucht wurde.

Außerdem sind Popups weniger aufdringlich, wenn sie mit dem Inhalt der besuchten Website übereinstimmen. Wenn ein Benutzer beispielsweise eine Seite über Damenschuhe besucht, ist ein Popup mit der Meldung, dass Herrenhemden im Angebot sind, keine gute Idee.

Unaufdringliche Werbebanner

Ähnlich verhält es sich mit aufdringlichen Werbebannern. Sogar die Websites vieler großer Zeitschriften sind voll von animierten, blinkenden, ominösen Anzeigen. Dadurch tritt der eigentliche Inhalt der Seite in den Hintergrund.

Seitenbetreiber versuchen natürlich, die Performance dieser Werbebanner zu optimieren, zum Beispiel mit dem klassischen „Lazy Loading“. Bei dieser Methode werden Bilder und andere Elemente erst geladen, nachdem der Benutzer an die gewünschte Position auf der Seite gescrollt hat. Und schon endet man mit einer Website, bei der die Inhalte beim Scrollen immer wieder springen, da die Banner erst nachträglich geladen werden.

Ähnlich wie bei Pop-ups sollten Sie auch hier darauf achten, dass diese möglichst diskret eingesetzt werden. Solange die Anzeige jedoch das Nutzererlebnis nicht beeinträchtigt, für das Thema relevant ist und nicht von den Inhalten ablenkt, für die die Website besucht wird, steht ihrer Verwendung natürlich nichts entgegen.

Der Raum um den Inhalt herum kann für versteckte Werbung genutzt werden. Ein Banner, das neben dem Text platziert wird, ist für den Benutzer weniger aufdringlich, ebenso wie eine Anzeige, die über oder unter dem Seiteninhalt platziert wird.

Texte verständlich strukturieren

Das Konsumieren von Text auf dem Bildschirm ist viel einfacher, wenn er sauber und locker formatiert, gut strukturiert ist und verschiedenen Faktoren entspricht.

Deshalb sollten Webseiten und vor allem deren Artikel nicht nur inhaltlich gut geschrieben sein, sondern auch gut aussehen.

Hier sind die besten Möglichkeiten, um Text besser lesbar zu machen.

Bringen Sie die Einleitung auf den Punkt

Mit einer durchschnittlichen Aufmerksamkeitsspanne von acht Sekunden sollte eine Website-Einführung perfekt sein. Website-Besucher müssen emotional und sinnvoll erfasst werden, damit klar wird, worum es geht und was der Zweck ist.

Daher empfiehlt es sich, dem Seitenbesucher gleich zu bestätigen, dass es sich tatsächlich um die gesuchte Lösung, den erwarteten Inhalt oder die gestellte Frage handelt und das alles in einem möglichst kurzen Einführungstext.

Kurze Sätze und Absätze

Offensichtlich sind lange Texte viel besser lesbar, wenn sie in kurzen Sätzen und Absätzen geschrieben sind. Allerdings gibt es oft Klartextwüsten mit verwirrenden Wortkombinationen und mehrzeiligen Sätzen.

Wenn der Text mit viel freiem Platz formatiert ist, hilft dies auch etwa den 71 % der Benutzer, die den Text nur überfliegen.

Bilder, Grafiken und Videos

Eine weitere visuelle Hilfe für eine komfortablere Präsentation von Inhalten für Website-Besucher sind Grafiken und Videos.

Es wurde festgestellt, dass mehr Bilder pro Seite zu einer größeren Reichweite durch mehr Social-Media-Shares und längere Verweildauer der Website-Besucher führten. Insbesondere bei längeren Texten ist es notwendig, eine ausreichende Anzahl von Grafiken, am besten mehr als 10, zu erstellen und einzubinden.

Bei komplexen Themen sollten auch Videos eingesetzt werden, um Sachverhalte mit visuellen Hilfsmitteln zu erklären. Dies hilft den Besuchern, das Thema besser und vollständiger zu verstehen. Auch Videos sind bei den Verbrauchern sehr beliebt: 62 % der Teilnehmer einer Content-Trends-Umfrage gaben an, dass sie sich Videos sehr aktiv ansehen und daher länger auf der Website bleiben.

Details

Natürlich spielt die Übersicht eine wichtige Rolle für das Benutzererlebnis, wie zum Beispiel ein gut abgestimmtes Design, gleiche Farben für gleiche Elemente und andere Faktoren, die die Seite durchziehen.

Die Details werden jedoch trotzdem oft übersehen. Das ist genau der Punkt, an dem Sie sich von der Konkurrenz abheben können.

Drei Details, die oft übersehen werden, sind die 404-Seite, gezielte Fehlermeldungen und die optimierte Suche.

Barrierefreiheit, die alle Seitenbesucher freut

Eine barrierefreie Website sollte für alle zugänglich und benutzerfreundlich sein. Dabei spielt es keine Rolle, ob der Besucher eine körperlich oder technisch begrenzte Möglichkeiten hat.

Zu oft wird vergessen, die Website so vielen Menschen wie möglich zugänglich zu machen. Einige der leicht verfügbaren Maßnahmen sind nicht allzu schwierig umzusetzen und werden von allen Website-Besuchern (und Suchmaschinen) gemocht.

Alternative Tags für Bilder

Jedes Bild muss mit einem sogenannten „Alt-Tag“ versehen werden. Das bedeutet, dass der Inhalt des Bildes mit möglichst wenigen Worten beschrieben wird.

Dies hilft insbesondere Personen, die einen Screenreader verwenden, sich Bilder vorzustellen oder eine Bildersuche zu verwenden und zu wissen, ob sie ein passendes Bild gefunden haben.

Scharfe Kontraste

Nicht nur Menschen mit Seheinschränkung schätzen starke Kontraste. Gute Kontraste machen Schriften besser lesbar, Elemente sind besser erkennbar und das grafische Gesamtbild der Website wirkt harmonischer.

Kontrast ist der Unterschied zwischen hellen und dunklen Bereichen der Website. Ein hellgrauer Button mit weißer Schrift hat einen sehr geringen und damit schlechten Kontrast. Andererseits hat ein schwarzer Button mit weißer Beschriftung ein sehr hohes und damit gutes Kontrastverhältnis.

Bei Schaltflächen, Bildern mit Text darüber und anderen Elementen mit einer bestimmten Hintergrund- und Vordergrundfarbe wird empfohlen, den höchstmöglichen Kontrast zu verwenden.

Logische Header-Strukturen

Alle Texte und Inhalte haben unterschiedliche Überschriften oder Überschriften – und folgen oft der gleichen Struktur. Im HTML-Markup werden sie in absteigender Reihenfolge mit h1 bis h6 bezeichnet.

Das Erstellen einer logischen Überschriftenstruktur ist nicht nur für die Lesbarkeit nützlich, sondern auch für die Suchmaschinenoptimierung. So können Sie wichtige Keywords entsprechend ihrer Relevanz in Ihre Texte integrieren.

Die erste Überschrift sollte h1 als Überschrift der obersten Ebene und auch die einzige h1 für diese Seite sein. Andere Überschriften sollten mit h2 gekennzeichnet werden, und wenn ein anderes Unterthema in einem Abschnitt mit h2 beginnt, wird es mit h3 gekennzeichnet.

Die Header-Struktur könnte beispielsweise so aussehen:

h1
 h2
 h2
  h3
   h4
 h2
  h3
 h2

Links aussagekräftig benennen

Externe und interne Links sind wesentliche Bestandteile von Websites, die Benutzer führen und nützliche Inhalte anzeigen.

Aber wie oben erwähnt, können viele Screenreader-Benutzer nicht herausfinden, wohin ein Link von „hier mehr“ oder „hier klicken“ führt.

Deshalb ist es wichtig, Links so zu benennen, dass man schon am Linktext erkennen kann, wohin sie führen. Ein aussagekräftiger Link wäre zum Beispiel „Weitere Informationen zu Thema XY“ oder „Klicken, um PDF herunterzuladen“.

Fazit: Nutzerfreundlichkeit ist ein Muss

In einer Welt voller Websites, Texte und Inhalte ist es für Unternehmen schwierig, sich von der Masse abzuheben.

Ein wichtiger Bestandteil dafür ist eine fehlerfreie und vor allem gute User Experience auf der Website. Website-Besucher sollen sich wohlfühlen, schnell finden, wonach sie suchen, und die Website erst nach einer zufriedenstellenden Interaktion mit ihr verlassen.

Dazu können Sie mit einfachen Tricks das Nutzererlebnis auf Ihrer Website verbessern. Die in diesem Artikel vorgestellten Maßnahmen und Ansätze sind natürlich nur ein Teil dessen, was für eine gute User Experience getan werden kann. Sie sind jedoch ein guter Ausgangspunkt, um zumindest die Grundlagen für die Bereitstellung der besten Benutzererfahrung für Ihre Website abzudecken.

Demo anfordernErhalten Sie eine Demonstration von WebRain, direkt an Ihre Unternehmensbedürfnisse angepasst.


Wir benötigen einige Eckdaten.Wir setzen uns spätestens am nächsten Werktag mit Ihnen in Kontakt.