Usability Tipps – Mit einer benutzerfreundlichen Website zum Erfolg

Usability - Mit einer benutzerfreundlichen Website zum ErfolgStändig hört man dieses Wort – Usability. Doch was verbirgt dahinter eigentlich? Und welche Vorteile hat eine Optimierung der Usability?

Usability heißt übersetzt Benutzerfreundlichkeit. Es geht bei der Usability darum, seine eigene Website für den Besucher benutzerfreundlicher zu gestalten, so dass dieser nicht gleich wieder abspringt und das Interesse verliert.

Wir wollen Dir einige Tipps geben, wie Du durch eine bessere Benutzerfreundlichkeit mehr Besucher auf Deine Website bekommst und diese auch auf deiner Seite bleiben.

Warum ist Usability wichtig?

Du hast an Deiner Webseite eine gelungene Suchmaschinenoptimierung durchgeführt? Aber leider bleibt der Erfolg aus? Eigentlich hast Du alles richtig gemacht?

Die richtigen Keywords wurden verwendet und die Seite platziert sich in den Top-Positionen bei Google? Du hast bereits viele Besucher auf Deiner Seite? Doch trotzdem steigen die Verkaufszahlen Deines Produkts oder Deiner Dienstleitung seit Monaten nicht mehr an?

Viele Selbständige und Website-Betreiber verzweifeln an diesem Punkt und versuchen mit illegalen SEO-Methoden zum erwünschten Erfolg zu kommen. Aber liegt der Fehler wirklich in der Suchmaschinenoptimierung an sich? Dein Problem ist vielmehr die fehlende Usability. Doch warum brauchst du diese eigentlich?

  • Heutzutage gehört das Surfen im Internet zum Alltag vieler Menschen. Das Suchen bei Google läuft eigentlich automatisch ab. Innerhalb von Sekunden entscheidet der Suchende ob die Seite relevant für seine Bedürfnisse ist.
  • Du hast nur wenig Zeit den Benutzer von Deinem Angebot zu überzeugen. Aus diesem Grund sollte Deine Seite eine hohe Usability (Benutzerfreundlichkeit) aufweisen.
  • Der Suchende muss sich sofort auf der Webseite zurechtfinden und animiert werden, eine Interaktion durchzuführen. Ohne eine benutzerfreundliche Website springt dieser sofort wieder ab.
  • Der Inhalt muss auf eine bestimmte Zielgruppe zugeschnitten werden und themenrelevant sein.

Usability ist spätestens nach dem Panda-Update von Google ein wesentlicher Bestandteil der Suchmaschinenoptimierung. Wenn Deine Webseite eine hohe Benutzerfreundlichkeit aufweist, dann sind Deine Verkaufsraten auch wieder wesentlich höher.

Usability durch Kohärenz und Konsistenz

Die wichtigsten Elemente einer guten Usability sind der passende Aufbau der Seite (Kohärenz) und die Geschlossenheit der einzelnen Elemente (Konsistenz). Einerseits werden die separaten Seiten auf die Usability optimiert und zusätzlich die Navigation zwischen den verschiedenen Seiten der Webpräsenz. Dies beinhaltet, dass der Besucher durch unstrukturierte Menüs und Navigationen verunsichert wird.

Die Inhalte der Seitenstruktur müssen immer identisch sein, so dass der Nutzer schnell zu seinem Ziel kommt. Dazu zählen auch Abstände zwischen den Texten oder auch die verwendeten Spalten pro Seite.

In den letzten Jahren haben sich gewisse Standards entwickelt, wie eine Webseite gestaltet werden muss, damit der Besucher diese für benutzerfreundlich einstuft. Gewisse Elemente wie das Logo, die Hauptnavigation und Icons müssen strukturiert platziert werden. Aber auch die fachgerechte Kennzeichnung von Links oder das Anbieten einer Sitemap sind effektive Werkzeuge zur Verbesserung der Usability.

Gliederung der Überschriften

Deine Besucher kommen meist über eine Suchmaschine auf Deine Seite. Zuvor haben diese im Suchfeld ein bestimmtes Schlüsselwort oder eine Kombination aus Wörtern eingegeben. Du solltest dieses Wort oder diese Kombination nun auch auf Deiner Seite anbieten, damit der Besucher auch weiß, dass er auf der richtigen Seite gelandet ist. Es dient auch der Orientierung auf Deiner Website.

Zur Erschließung des Inhalts und des Themas sind für den Besucher die Überschriften (<h1> bis <h6>) sehr wichtig. Das Haupt-Keyword, auf das die jeweilige Seite optimiert worden ist, sollte besonders in der Hauptüberschrift <h1> und in den beiden Unterüberschriften <h2> und <h3> eingefügt werden.

Eine Kombination der Nennung in den Überschriften und im eigentlichen Text wird höher bewertet und bietet dem Nutzer der Webseite eine bessere Übersicht. Denn der Leser überfliegt in den meisten Fällen die Webseite erst mal, bevor er die einzelnen Abschnitte explizit liest. Dies passiert vor allem dann, wenn sich der Nutzer erst mal einen Überblick darüber verschaffen will, ob die gewählte Seite auch seinen Wünschen entspricht.

Usability - Mit einer benutzerfreundlichen Website zum Erfolg

Deshalb sollten die Überschriften nach einer klaren Hierarchie gegliedert werden und interessante Schlüsselwörter beinhalten. Der Besucher muss klar erkennen, wie der Text sich anhand der Überschriften aufteilt. Jeder Absatz muss seinen Inhalt bereits in der Überschrift wiedergeben.

Beschreibende Anchor-Texte

Suchmaschinen erkennen nicht nur den Link, der auf eine Seite verweist, sei es nun ein externer oder interner, sondern diese beobachten vor allem den Text (Anchor-Text), mit dem verlinkt wurde.

Seit langem werten Suchmaschinen die verwendeten Schlüsselwörter schon als Ranking-Signale. Doch auch die Nutzer profitieren von gut ausgearbeiteten Anchor-Texten. Wie bereits beschrieben, werden viele Leser die Webseite erst einmal überfliegen. Ein gut sichtbarer Anchor-Text ist hilfreich, da dieser eine Markierung enthält. Damit muss der Nutzer nicht erst den gesamten Text lesen und kann den Link sofort verwenden.

Hierbei sollte man jedoch einfache Wörter wie “Mehr”, “Hier geht es weiter”, “Hier informieren” oder “Weiter lesen” vermeiden. Ein guter Anchor-Text sollte immer themenrelevante Schlüsselwörter beinhalten und den Lesern eine gute Navigationsmöglichkeit bieten.

Usability durch eine hohe Lesbarkeit

Eine hohe Lesbarkeit sollte eigentlich eine Selbstverständlichkeit einer benutzerfreundlichen Webseite sein. In der Praxis ist dies leider öfters nicht der Fall. Um eine gute Lesbarkeit zu gewährleisten musst Du einige Dinge beachten:

  • Der Kontrast zwischen der Schriftfarbe und dem Hintergrund sollte immer angemessen hoch sein (Grenzwert / Colour Difference = 500) -> Überprüfung durch Colour Contrast Check
  • Verwendung von monochromen Farbhintergründen für Fließtexte und Navigationsflächen, keine ausgefallene Muster oder Farbverläufe wählen
  • Unglückliche Farbwahl vermeiden (Neon-Farben, Grelle Farben, Unleserliche Schriftfarben)
  • Farbwahl bei der Linkgestaltung beachten, beim Überfahren darf der Link nicht verschwinden
  • Leserliche und einheitliche Schriftgröße verwenden (zwischen 10 pt und 14 pt)
  • Benutzerfreundliche Spaltenbreite einhalten, Textzeilen dürfen nicht zu lang sein, 50 bis 90 Anschläge als Richtwert (Zeichen inklusive Leerstellen)
  • Textwüste vermeiden
  • Optimalen Zeilenabstand einhalten (Doppelte Versalhöhe) -> im CSS mit dem Befehl „line-height“ verändern. Für den Fließtext empfiehlt sich ein Wert von 1.5, bei Überschriften solltest du den Wert 1.2 verwenden.
    Beispiel: line-height: 1.5 / line-height: 1.2

Etablierte Standards einhalten

Du solltest nicht allzu exotische Maßnahmen verwenden, um deine Webseite benutzerfreundlicher zu machen. Um eine starke Usability gewährleisten zu können, musst du dem Nutzer eine schnelle Erschließbarkeit deiner Inhalte bieten. Dazu haben sich in den letzten Jahren einige Standards etabliert:

Logo
Das Logo sollte immer gut ersichtlich links oder rechts oben gesetzt werden. Dieses dient besonders als Orientierungspunkt. Ein Klick auf das Logo sollte immer zu Startseite führen.

Hauptnavigation (Menüleiste)
In der Hauptnavigation werden Unterseiten, wie Leistungen, Vorstellung des Unternehmens, Blog oder Kontakt aufgeführt. Sie dient dem User als Orientierung und zur Vereinfachung der Navigation auf der Seite. Die Hauptnavigation sollte sich entweder horizontal unterhalb des Logos von links nach rechts, oder vertikal am linken Seitenrand befinden.

Usability - Mit einer benutzerfreundlichen Website zum Erfolg

Kennzeichnung von Links
Links sollten eigentlich immer, zur besseren Wahrnehmung, unterstrichen werden. Außerdem ist das Setzen eines Pfeils vor oder hinter dem Link-Text ein sinnvolles Instrument der Erschließbarkeit. Es bietet sich auch eine andere Kennzeichnung, wie eine außergewöhnliche Farbgebung oder Einrahmung an.

Sitemap und Suchfeld
Navigationshilfen sind bei der Optimierung der Usability nicht mehr weg zu denken. Die besten zusätzlichen Orientierungshilfen bieten Sitemaps und Suchfelder. Eine Sitemap dient sozusagen als Inhaltsverzeichnis der Webseite. Hierbei werden alle wichtigen Haupt- und Unterseiten aufgelistet und verlinkt. Sie dient vor allem zur Übersicht über die Struktur der Webseite. Die Visualisierung kann verschiedene Formen annehmen, es sollte sich dabei aber um ein lesbares Format handeln und auf keinen Fall um eine Flash-Animation. Die Sitemap sollte gut leserlich auf der Webseite seinen Platz finden. Auch ein Suchfeld sollte in jedem Fall auf der Webseite eingebaut werden. Dies ermöglicht dem Nutzer eine zielgerichtete Suche nach seinen gewünschten Inhalten.

Usability durch effektive und einfache Navigation

Die Navigation ist sozusagen das Herzstück einer guten Usability. Diese muss gut strukturiert, gut lesbar und schnell erschließbar sein. Eine effektive Navigation muss zwei wichtige Aufgaben erfüllen:

  1. Der User muss die Möglichkeit haben, sich frei im Angebot der Webseite bewegen zu können.

    Die volle Kontrolle über die Navigation ist ein Grundpfeiler einer effektiven Usability. Dies betrifft besonders multimediale Elemente wie Flash-Introseiten und Werbebanner, die nicht übersprungen werden können, oder Musik, die nicht stumm geschaltet werden kann. Auch laute und störende Werbe-Einblendungen sind weitere Störfaktoren.

  2. Die Navigation muss dem Leser jederzeit deutlich zeigen, wo er sich gerade befindet. Wie er zu diesem Punkt kam und welche Optionen ihm gerade offen stehen, weiter zu gehen.

    Wohin ein Link führt, muss klar formuliert werden. In der Fachsprache nennt man diese Optimierung “Wording”. Leere Worthülsen, wie “Mehr” oder “Hier weiter lesen” sollten in jedem Fall vermieden werden. Man sollte bei der Formulierung der Navigationstexte immer die Sicht des Nutzers einnehmen. Was sucht dieser? Welches Bedürfnis hat dieser? Wie kommt der User an sein Ziel? Der Leser will schnellstmöglich sein Ziel erreichen, dies muss in der Navigation gewährleistet werden. Darüber hinaus muss der Nutzer immer wissen, in welchem Bereich der Webseite er sich gerade befindet. Die sogenannte Brotkrumen-Navigation (Breadcrumb-Navigation) ist ein bewährtes Mittel, um diese Orientierung gewährleisten zu können. Diese gibt dem User die Möglichkeit zu wissen, auf welchem Navigationspfad er sich gerade befindet und wie er zur nächsthöheren Hierarchie-Ebene wieder zurückkehren kann. Auch für die Suchmaschinen sind Brotkrum-Navigationen sehr effektive Ranking-Signale. Aber auch das Anbieten einer Wiedereinstiegsmöglichkeit, sei es durch eine Sitemap, eine Suchfunktion oder ein A-Z-Index solltest du deinen Besuchern anbieten.

Usability für mobile Geräte (Responsives Design)

Usability - Mit einer benutzerfreundlichen Website zum ErfolgHeutzutage kommen sehr viele Nutzer über ihr Handy oder über ihr iPad auf eine Webseite.

Um diese dann auch in vollem Umfang nutzen zu können, benötigen moderne Webseiten ein responsives Design. Dieses verändert die Seite dynamisch und passt die Maße an das Display des mobilen Gerätes an. So werden keine Ecken oder Spalten vom Bildschirm abgeschnitten.

In der Praxis sieht man jedoch immer wieder veraltete Webseiten, die noch kein responsives Design haben. Ohne ein responsives Design kann keine zufriedenstellende Usability für mobile Geräte gewährleistet werden.

Wenn deine Webseite also mehr Leser anziehen soll, muss diese auch ein responsives Design erhalten.

Jeder geschulte Webdesigner kann die Webseite so umbauen, dass sie responsiv wird.

Überdies ist ein responsives Design auch ein wichtiger Rankingfaktor bei den Suchmaschinen und es gelten natürlich alle Tipps zur Usability auch für mobile Geräte.

Informationen zum Autor

Mein Name ist Christian Mantovan. Seit zwei Jahren bin ich Geschäftsführer der SEO-Agentur Digital-Ascent in Regensburg. Mehrere Jahre arbeite ich schon im Bereich SEO, SEA, Content-Marketing und Social-Media-Marketing.

Peer Wandiger

3 Gedanken zu „Usability Tipps – Mit einer benutzerfreundlichen Website zum Erfolg“

  1. Die Schriftgröße würde ich deutlich größer machen. 10 bis 14 pt finde ich ehrlich gesagt viel zu klein. Ich bin aktuell bei 18pt angekommen. Das erhöht die Lesbarkeit ungemein.

    Antworten
  2. Hallo Christian,

    danke für diesen hilfreichen Artikel. In der Tat habe ich wohl noch Probleme mit der Onpage SEO. Ich werde diese Tipps beherzigen und umsetzen.

    Viele Grüße
    Daniel

    Antworten

Schreibe einen Kommentar