Die Usability einer Webseite hat maßgeblichen Anteil am Erfolg oder Misserfolg von Unternehmen. Doch was genau bedeutet Usability? In der Praxis hat sich der Begriff „Benutzerfreundlichkeit“ durchgesetzt. Streng genommen steht Usability für „Gebrauchstauglichkeit“. So lautet zumindest die deutsche Übersetzung des Begriffs, der in den Richtlinien der „Mensch-Computer-Interaktion“ (EN ISO-Norm 9241) beschrieben wird. Je gebrauchstauglicher eine Homepage gestaltet ist, desto besser kann der Nutzer sie handhaben.

Dies hat wiederum positive Effekte für den Anbieter der Webseite. Die Folgen sind eine Steigerung der Konversionsrate, erhöhter Abverkauf von Produkten, mehr Registrierungen und Downloads sowie ein Imagegewinn. Daher ist es umso wichtiger, das 1x1 der Webseitengestaltung zu beherrschen. Wir haben 11 Tipps zusammengestellt, mit denen Sie die Usability Ihrer Webseite verbessern.

In diesem Artikel erfahren Sie:

• wie Sie die Usability Ihrer Webseite checken können,
• welche typischen Fehler Sie bei der Webseitengestaltung vermeiden sollten und
• mit welchen Maßnahmen Sie die Benutzerfreundlichkeit verbessern.

1. Usability-Test

Oft sind es Kleinigkeiten, die den Unterschied zwischen einer guten und schlechten Webseite ausmachen. Die Kunst ist es nun, die möglichen Störfelder und Mängel zu lokalisieren. Das Problem: Die meisten Makel fallen den Unternehmen und Webseitenbetreibern selbst nicht auf. Wer sich täglich auf derselben Seite bewegt, gewöhnt sich unter Umständen an benutzerunfreundliche Web-Elemente – ein klassischer Fall von „Betriebsblindheit“. Primär entscheidend ist nicht die Meinung der Mitarbeiter, sondern der Seiten-Besucher.

Für Unternehmen bietet sich daher ein Usability-Test an. Dabei werden Testpersonen eingeladen und dazu aufgefordert, gewisse Aufgaben auf der Webseite auszuführen. Bereits ab sieben Testpersonen liefern solche Vor-Ort-Umfragen üblicherweise verwertbare Ergebnisse. Usability-Tests können auch online durchgeführt werden, was in der Regel preiswerter und schneller ist. Vor allem für Betreiber, die mit ihrer Webseite Umsatz generieren – wie beispielsweise im Fall von eCommerce-Shops –, sind Usability-Tests zu empfehlen.

2. Technische Voraussetzungen: Ladezeit entscheidend

Die Ladezeit von Webseiten ist ein entscheidender Faktor für den Erfolg. Studien belegen, dass fast jeder zweite User eine Ladezeit von weniger als 2 Sekunden erwartet. Beträgt die Zeit mindestens 3 Sekunden, verlässt die Mehrheit der Nutzer den Online-Auftritt wieder. Schlimmer noch: Etwa 80 Prozent der Besucher kehren aufgrund ihrer Erfahrung mit der schlechten Performance nicht mehr zurück. Als goldener Wert gilt heute eine Ladezeit von maximal einer Sekunde. Ab dieser Ladezeit sind keine negativen Einflüsse auf Absprungraten und Konversionsraten zu erwarten.

3. Die richtige Farbwahl

Mit Farben können beim Webseiten-Besucher bestimmte Stimmungen erzeugt werden, die die Außenwirkung des Unternehmens maßgeblich beeinflussen. Zudem grenzen sich Anbieter durch eine durchdachte Farbwahl von der Konkurrenz ab. Studien zeigen, dass die Farbgebung der Internetpräsenz die Kaufentscheidung der Besucher zu 60 bis 80 Prozent beeinflusst. Daher sollten Unternehmen diese im Idealfall passend zu ihrer Geschäftstätigkeit abstimmen. Die Farben einzelner Elemente auf der Webseite, wie beispielsweise des Kauf- oder Anmelde-Buttons, sollten sorgsam gewählt sein. Jede Farbe löst beim Nutzer unterschiedliche Emotionen aus. Während Rot und Orange zum Kaufen animieren, steht Gelb für den Fun-Faktor.

4. Die richtige Typografie

Stellen Sie sicher, dass Ihre Inhalte eine optimale Lesbarkeit bieten. Dazu ist eine ausreichende Schriftgröße genauso wichtig wie ein passender Zeilenabstand. Faustregel: Je mehr Zeichen eine Zeile enthält, desto größer sollte auch der Zeilenabstand ausfallen. Ansonsten sind beim Lesen nicht selten Ermüdungserscheinungen die Folge. Eine gute Lesbarkeit zeichnet sich auch durch einen idealen Kontrast zwischen Schriftfarbe und Hintergrund aus.

Ein nicht zu vernachlässigender Punkt ist die Auswahl der richtigen Schriftart. Wie Untersuchungen zeigen, hängt das Urteil des Users ebenfalls von der Stimmigkeit des Layouts ab. Je gelungener das Layout, desto zufriedener der Besucher. In Maßen dekorative Schrift erfüllt etwa die Aufgabe, Web-Elemente hervorzuheben und zu verschönern. Dadurch kann die Verweildauer erhöht werden. Serifenlose Schrift hingegen ist für informative Texte geeignet.

5. Die ideale Navigation

Mithilfe der Navigation kann sich der Nutzer auf einer Webseite zurechtfinden. Sie gibt ihm Orientierung und führt ihn stets dahin, wohin er will. So präsentiert sich zumindest der Idealfall. Je mehr Inhalte sich auf einer Webseite befinden, desto unübersichtlicher wird sie. Daher ist eine gute Navigation entscheidend für die Usability einer Homepage. Ist eine Navigation nicht sinnvoll gegliedert, verliert die komplette Seite an Effizienz. Denn was nützen die besten Inhalte, wenn sie nicht gefunden werden? Folgende Kriterien sollten berücksichtigt werden, um eine ideale Navigation auf einer Webseite zu implementieren:

• Abheben der aktuellen von inaktiven Seiten: Wichtig ist, dass der Nutzer jederzeit weiß, in welchem Bereich der Seite er sich aktuell befindet. Das hilft ihm dabei, auch in einer komplexen Struktur zu navigieren. Dies kann beispielsweise durch eine farbliche Hervorhebung des aktuellen Menüpunkts erzielt werden.
• Aussagekräftige Punkte: Link-Texte sind die Türschilder und -öffner für neue Inhalte. Daher sollten diese eine möglichst hohe Aussagekraft bieten. Worthülsen wie „Mehr“ oder „Weitere Infos“ helfen nicht viel weiter.
• Skip-Links sind praktisch: Speziell bei langen, unübersichtlichen Seiten bieten sich sogenannte Skip-Links an, mittels derer der Nutzer sofort zum gewünschten Abschnitt wechseln kann. Ein langwieriges Drehen des Mausrades fällt damit weg.
• Brotkrümel helfen weiter: Mit sogenannten Breadcrumbs behält der Besucher immer und überall die Übersicht. Der Vorteil: Die Breadcrumb-Navigation liefert Informationen, wo sich der Nutzer im Verhältnis zu darüber liegenden Ebenen befindet. So kann er den Weg stets zurückfinden. Er muss nur den „Brotkrümeln“ folgen.
• Logo-Verlinkung: Der Nutzer hat mittlerweile gelernt, dass das Unternehmenslogo auf einer Website mit der Startseite verlinkt ist. Dies ist sozusagen eine Erwartungshaltung, die erfüllt werden muss. Passiert beim Klick auf das Logo nichts, ist das ein großer Nachteil im Hinblick auf die Gebrauchstauglichkeit.
• Suchfunktion ist ein Muss: Eine der wichtigsten Elemente auf einer Webseite ist die Suchfunktion. Speziell bei umfassenden Seiten ist sie für den Besucher ein nützliches Tool, um schnell zu den gewünschten Informationen zu gelangen. Eine manuelle Suche ist oft zu umständlich und schmälert die Usability.

6. Pagination vs. Infinite Scrolling

Üblicherweise gelangen Besucher auf Blogs und Co. zu neuen Inhalten, indem sie auf die angezeigten Seitennummern klicken. Im Fachjargon spricht man von „Pagination“. Bei einer Webseite mit einigen Hundert Beiträgen ist das durchaus sinnvoll. Bei Online-Magazinen mit mehreren Tausend Artikeln bieten die Seitenangaben aber kaum noch einen Mehrwert. Das Klicken wird dabei eher als lästig empfunden. Auf immer mehr informationsreichen Webseiten wird der Klick daher durch ein endloses Scrollen, das sogenannte „Infinite Scrolling“ ersetzt, das viele Nutzer bereits von Social Media-Kanälen wie Instagram oder Pinterest kennen.

Der Clou: Über Algorithmen kann die Reihenfolge der angezeigten Artikel gefiltert werden, sodass die relevantesten Beiträge zuerst angezeigt werden. Das kann die User Experience merklich verbessern. Allerdings geht Infinite Scrolling bei einigen Nutzern zulasten der Orientierung – und drückt damit auch die Konversionsrate. Prinzipiell gilt: Möchte man Benutzern zum Stöbern einladen, empfiehlt sich Infinite Scrolling. Wem in erster Linie Übersichtlichkeit und die schnelle Auffindbarkeit bestimmter Inhalte wichtig sind, sollte auf die klassische Pagination setzen.  

7. Content Chunking

Webseitenbetreiber neigen dazu, ihre Inhalte überdimensioniert zu präsentieren. Die Absicht dahinter ist gut gemeint. Schließlich sollen dem Nutzer relevante Information nicht vorenthalten werden. Allerdings fühlen sich Besucher von der Fülle der Inhalte häufig geradezu überfordert. Weniger ist auch hier mehr. Schließlich geht das Lesen am Bildschirm rund 25 Prozent langsamer als auf dem Papier vonstatten. Die Augen ermüden am Screen schneller. Daher ist es zu empfehlen, Texte, Listen oder sonstige Inhalte aufzuteilen. Im Fachjargon heißt das „Content Chunking“. Der Besucher erhält dadurch eine höhere Motivation, sich auf der Seite zu bewegen und die Inhalte portionsweise zu konsumieren.

8. Multimedia-Elemente kontrollierbar machen

Multimedia-Elemente wie Videos sind interaktiv, wirken modern und werten eine Webseite auf. Wenn multimediale Inhalte allerdings von alleine starten, ohne dass der Nutzer Einfluss darauf hat, sind sie kontraproduktiv. Oberstes Gebot ist, dass der User die Kontrolle über die Seite behält. Er soll sich schließlich wohlfühlen und aktiv Entscheidungen treffen. Zum Entscheidungsprozess ist auch Transparenz notwendig. Der Besucher soll nicht nur erfahren, welche Informationen oder Daten ihn beim jeweiligen Multimedia-Inhalt erwarten, sondern auch wie viel. Im Beispiel der Videos kann dies die Abspieldauer, bei Downloads die Datenmenge sein. Transparenz steigert die Usability spürbar.

9. Struktur ist das A und O

Ordnung ist das halbe Leben, und so verhält es sich auch bei der Webseitengestaltung. Eine logisch nachvollziehbare Struktur erleichtert das Finden von Inhalten. Benutzer haben im Laufe der Jahre gelernt, in welchem Teil der Seite einzelne Web-Elemente zu finden sind. Die Erwartungshaltung der meisten Besucher sieht vor, dass das Firmenlogo links oben, die Suchfunktion rechts oben und das Impressum ganz unten zu finden ist. Entscheidend ist aber nach wie vor, dass die Inhalte übersichtlich platziert werden. Daher sollten vor allem werbefinanzierte Webseitenbetreiber die Quantität und Präsenz von Werbe-Elementen nicht übertreiben. Wenn der Benutzer bei all den Werbeteasern und -bannern Mühe hat, den eigentlichen Content zu finden, läuft etwas falsch.

10. Responsive Web-Design

Responsive Web-Design, also „reagierende Webseitengestaltung“ sorgt unmittelbar für eine bessere Usability. Es stellt sicher, dass die Inhalte von Webseiten dynamisch an das jeweilige Anzeigegerät angepasst werden. Dabei spielt es keine Rolle, ob die Homepage auf einem Smartphone, Tablet oder Computer besucht wird. Es ist also umso wichtiger, die Webseite mit der nötigen Technologie auszustatten. Webstandards wie CSS3 und HTML5 ermöglichen dieses flexible Design, das dem Besucher ein optimiertes Browsererlebnis bietet.

11. Formulare

Webseitenbetreiber, die Formulare anbieten, können viel falsch machen – ohne es überhaupt zu bemerken. Wer hat es noch nicht erlebt? Beim Ausfüllen eines Online-Formulars kommt es hin und wieder zu Fehlern. Man denkt, alles korrekt ausgefüllt zu haben, dennoch stimmt eine der Angaben nicht. Egal, ob Sie ein Pflichtfeld vergessen oder eine E-Mail-Adresse ohne @ eingetippt haben: Wichtig ist, dass man Sie auf den Fehler aufmerksam macht. Ein freundlicher Hinweis als Rückmeldung hilft jedem Nutzer weiter. Im Idealfall macht das Formular den Nutzer in Echtzeit auf seine fehlerhafte Eingabe aufmerksam.

Ein weiterer Tipp: Die einzelnen Felder sollten sowohl mit der Maus als auch mit der Tabulator-Taste angesteuert werden können. So muss der User im günstigsten Fall seine Hände nicht von der Tastatur wegbewegen, sondern kann seine Daten schnell und unkompliziert eingeben. Eine AutoFill-Funktion beschleunigt den Eingabeprozess zusätzlich und ist ohne Zweifel „gebrauchstauglich“.