Website-Konzeption Teil 5

Usability-Tests in der Praxis

22.04.2009 von Jens Jacobsen
Welche spannenden und überraschenden Resultate ein Usability-Test liefern kann, zeigen die Praxisbeispiele zweier realer Webseiten. TecChannel erläutert, wie Techcom.de und taz.de die Benutzerfreundlichkeit ihrer Site durch Ergonomie-Tests steigern konnten.

Im ersten Teil der Artikelserie zu Usability-Tests haben wir die Grundlagen für die Analyse der Benutzerführung einer Webseite behandelt. Teil zwei ist dann auf den konkreten Ablauf und die Auswertung eines Usability-Tests eingegangen. Mitunter bleiben dabei aber Fragen offen die mit den ergänzenden Maßnahmen aus Teil drei abgefangen werden können. Im vierten Teil wurden dann Normen und Vorschriften rund um das Thema Usability behandelt. Dieser letzte Teil mit Praxisbeispielen rund um die Entwicklung ergonomischer Webseiten schließt die Artikelserie ab.

Website-Konzeption – Erfolgreiche Websites planen und umsetzen.

Dieser Beitrag basiert auf Kapitel 7 des Buchs „Website-Konzeption – Erfolgreiche Websites planen und umsetzen“ von Jens Jacobsen. Dieses Standardwerk für Web-Entwickler können Sie hier in unserem Partnerbuchshop Informit.de für 39,95 Euro versandkostenfrei bestellen.

Artikelserie

Website-Konzeption Teil 1: Grundlagen von Usability-Tests

Website-Konzeption Teil 2: Usability-Tests durchführen

Website-Konzeption Teil 3 Ergänzende Maßnahmen

Website-Konzeption Teil 4: Ergonomie- und Usability-Normen

Website-Konzeption Teil 5: Praxisbeispiele

Projektbeispiel Techcom.de – Usability-Tests

Für die Site von Techcom wurden zwei Testrunden angesetzt. Die erste fand zu Beginn der Feinkonzept-Phase statt. Hierbei wurde überprüft, ob die Benutzer die gewählten Begriffe für die Kategorien und die einzelnen Seiten verstanden. Die zweite Testrunde fand während der Umsetzungsphase statt. Hier wurde untersucht, ob die Korrekturen nach dem ersten Test di1 Probleme behoben hatten und ob der Inhalt ausgesuchter Seiten verstanden wurde.

Die erste Runde war ein Papierprototyp-Test. Hierbei skizzierte ich noch keine einzige Seite, sondern arbeitete nur mit Sitemaps, da ich nur die Informations-Architektur und die Begriffe testen wollte. An dem Test nahmen drei Personen teil, die nicht aus der Branche von Techcom kommen, aber von ihren Berufen her der Zielgruppe der Site entsprechen (zwei Ingenieure, eine Personalberaterin). In einzelnen Sitzungen legte ich den Testpersonen zunächst eine Sitemap vor, auf der nur die Hauptbereiche der Site eingezeichnet waren (siehe Abbildung 1).

Abb. 1: Die Bereiche der Site, die den Testpersonen zunächst vorgestellt wurden.

Ich erklärte, dass diese Bereiche die Schaltflächen einer Startseite sind. Ich bat die jeweilige Testperson sich vorzustellen, sie käme im Internet auf diese Site. Nun sollte sie mir sagen, was sie hinter den einzelnen Buttons erwarten würde. Weitere Informationen zur Firma oder Branche gab ich nicht.

Testergebnisse

Probleme der Testpersonen

Es zeigte sich, dass zwei Testpersonen nicht genau wussten, was mit „Training“ gemeint war. Sie vermuteten, es könnten Schulungen sein oder auch persönliche Betreuung während der Arbeit (Coaching/Training on the job). Dieses Problem stellt sich auf der späteren Site wahrscheinlich nicht unbedingt, da die meisten Besucher kommen werden, um eine Schulung von Techcom zu buchen. Dennoch kann es sein, dass jemand auf der Suche nach einem Consultant auf die Site gelangt und noch nicht weiß, dass Techcom auch Schulungen anbietet.

Der Bereich „Raummiete“ irritierte alle drei Teilnehmer. „Muss ich den Raum selbst mieten, wenn ich einen Kurs mache?“, fragte ein Teilnehmer. Es war unklar, dass die Schulungsräume von Techcom vermietet werden, wenn sie nicht mit eigenen Kursen belegt sind.

Alle drei Teilnehmer konnten sich nicht vorstellen, was die Site unter „E-Learning“ anbietet. Ein Teilnehmer erriet zwar die Bedeutung des Begriffs, er war aber allen dreien unbekannt. Das ist ein gutes Beispiel für Branchenblindheit. Ich war davon ausgegangen, dass inzwischen jeder dieses Wort kennt – doch weit gefehlt. Was sich hinter „Beratung“ verbirgt, war zwei Testpersonen unklar.

Hier vermuteten sie, dass sie beraten würden, welche Kurse für sie die richtigen sind. Einem Teilnehmer war der Begriff „Sitemap“ unbekannt. Das ist durchaus repräsentativ – nach einer Studie der Agentur Die Argonauten kennen 40 Prozent der Internet- Benutzer diesen Begriff nicht.

Anregungen der Testpersonen

Als nächsten Schritt der ersten Testrunde legte ich den Teilnehmern die gesamte Sitemap vor (siehe Abbildung 2). Ich bat sie nun, mir zu erzählen, was sie auf den Seiten mit diesen Titeln vermuten würden.

Abb. 2: Die komplette Sitemap, die den Testpersonen im zweiten Schritt vorgelegt wurde.

Ein Teilnehmer regte dabei an, im Bereich „Training“ eine Art Warenkorb oder Vormerkliste einzufügen. Auf diese sollte der Benutzer Kurse setzen können, um sie danach zusammen mit Titel, Termin, Preis und Kurzinhaltsangabe auszudrucken. Mit dieser Liste könnte man zu seinem Chef gehen und fragen, welchen Kurs man machen darf. Solche Ideen von Testpersonen sind viel wert, weil sie aus einem echten Benutzer-Bedürfnis entstanden sind. Benutzer, die selbst bestimmte Funktionen gerne hätten, zeigen Ihnen, wie Sie die Site noch nützlicher machen können.

Der Punkt „Ausstattung“ wurde von den drei Teilnehmern im Bereich „Training Ablauf“ als unpassend empfunden. Er gehöre eher zu „Raummiete“. Die Informationen zu den Räumen sowohl bei „Training – Ablauf“ als auch bei „Raummiete“ unterzubringen wurde als verwirrend bewertet. „Service“ wurde von allen Testpersonen als zu allgemein empfunden. Eine dachte, hier gehe es um den Service der Hotels. Auswertung & Konsequenzen.

Generell vermuteten die Testteilnehmer die richtigen Dinge hinter den Punkten, die ihnen präsentiert wurden. Ein paar Probleme waren aber so schwerwiegend, dass sie eine Überarbeitung erforderten.

Schwerwiegende Probleme

Die Einteilung in „Training – Themen“, „Training – Ablauf“ und „Raummiete“ wird von den Benutzern nicht nachvollzogen. Deshalb fasste ich die Inhalte zu den Trainings in einem Bereich zusammen. Die Informationen über die Räume bekamen einen eigenen Punkt „Schulungszentrum“. Hier ordnete ich auch die „Raummiete“ ein. Dadurch wird klar, dass die Vermietung ein zusätzliches Angebot ist. Um dennoch möglichst prominent darauf hinzuweisen, sah ich dafür einen kurzen Text auf der Startseite vor (Teaser).

Abb. 3: Die Sitemap nach der Überarbeitung

Der Begriff „Training“ scheint nicht aussagekräftig genug zu sein. Hier ist nicht sofort klar, dass es sich um Schulungen handelt. Ich ersetzte ihn durch „Schulungen“. Statt „Beratung“ wählte ich „Consulting“. Zwar ist dieser Begriff englisch, was von den meisten Benutzern nicht so gern gesehen wird. Aber er macht klar, worum es in diesem Bereich geht. Das Missverständnis, hier werde der Benutzer beraten, welche Kurse für ihn geeignet sind, wird so vermieten. Außerdem ist „Consulting“ Bestandteil des offiziellen Firmennamens (Techcom Consulting).

Für die Zukunft könnte auf der Site die von einem Teilnehmer angeregte Vormerkliste für verschiedene Kurse eingebaut werden. Diese ist ein Zusatznutzen, der das Buchen erleichtert. Es ist aber keine unbedingt notwendige Funktion und wird aufgrund des hohen technischen Aufwands auf eine spätere Überarbeitung verschoben.

In der zweiten Testrunde ließ ich die Testpersonen die Version der Site testen, wie sie zu diesem Zeitpunkt vorlag. Darin waren schon fast alle HTML-Seiten enthalten, und die meisten Funktionen waren benutzbar.

Um zu überprüfen, ob die Überarbeitung die Probleme gelöst hat, zeigte ich den Testpersonen (es waren andere als in der ersten Runde) die Startseite und bat sie wieder, mir zu sagen, was sie hinter den einzelnen Buttons vermuteten. Jetzt waren alle Begriffe klar, die grundsätzliche Informations-Architektur war also in Ordnung. Dann ließ ich die Testpersonen ausgewählte Seiten testen. Dabei kamen nur kleinere Probleme mit einzelnen Seiten zutage, die sich glücklicherweise mit wenig Aufwand beheben ließen.

Projektbeispiel taz.de

Ausgangslage

Die Tageszeitung (taz) war eine der ersten Publikationen und die erste deutsche Tageszeitung, die 1995 ins Internet ging.

Die Unabhängigkeit der Zeitung von großen Medienkonzernen und Anzeigenverkäufen wird entscheidend durch die taz-Genossenschaft gesichert. Deren Mitglieder stellen Kapital zur Verfügung, mit dem die taz wirtschaften kann. Um die Zeitung weiterzuentwickeln, werden laufend neue Genossen gesucht. Eine wichtige Anlaufstelle für die Interessenten ist die Website der taz.

Um herauszufinden, wie der Genossenschaftsbereich der Website verbessert werden kann, beauftragte mich die Genossenschaftsleitung mit einem Usability-Test. Der Rest der taz-Site wurde dabei nicht berücksichtigt.

Planung der Tests

Nach den Richtlinien für informelle Usability-Tests von Steve Krug genügt es, drei Personen eine Site testen zu lassen. Der bekannteste Usability-Experte Jakob Nielsen empfiehlt dagegen fünf Personen pro Testrunde. Um diese Aussagen an diesem Beispiel zu prüfen, testeten fünf Personen die Site.

Ablauf der Tests

Da der Hauptzweck des Genossenschaftsbereichs darin besteht, neue Mitglieder zu werben, wählte ich Testpersonen aus, die noch kein Mitglied der Genossenschaft sind. Ich bat sie, sich auf der Website www.taz.de über die Bedingungen der Mitgliedschaft in der taz-Genossenschaft zu informieren. Weitere Vorgaben gab es nicht. Im Folgenden finden Sie eine Zusammenfassung der Ergebnisse.

Zusammenfassung der Testergebnisse

Insgesamt hinterließ die Website keinen schlechten Eindruck, obwohl die Testpersonen einzelne Seiten relativ scharf kritisierten. Der prinzipiell gute Eindruck wird überdeckt von den Problemen, die bei der Informationsbeschaffung auftreten. Alle Testpersonen gaben nach der Sitzung an, einen Großteil der Informationen, die sie vor dem Beitritt zur Genossenschaft interessiert hätten, nicht gefunden zu haben. Nachdem aber genau dies ihre Aufgabe beim Test war, gaben sie teilweise recht schlechte Bewertungen ab. („Was ich rausfinden wollte, habe ich konkret nicht rausgefunden.“) Insbesondere Folgendes wurde vermisst:

Gelobt wurden die schnellen Ladezeiten, der sparsame Einsatz von Werbung und die persönlichen Fotos.

Abb. 5: Die erste Seite nach der Überarbeitung. Die Navigation links ist recht breit, das nahmen wir in Kauf, um die Antworten auf die wichtigsten Fragen so schnell wie möglich zu bieten.

Schlussfolgerung und Änderungsvorschläge

Ich empfahl neben kleineren Änderungen auf einzelnen Seiten, die Struktur des Genossenschaftsbereichs etwas umzubauen, die Seitentitel anzugleichen und ihre Darstellung so zu ändern, dass ersichtlich wird, auf welcher Seite man sich gerade befindet. Die Reihenfolge der Seiten in der Navigation links sollte so sein, wie ein Interessent die Informationen erwartet. Nach einer kurzen Einführung auf der Startseite möchte er je nach Hintergrundwissen Informationen zur Geschichte der taz oder zur Genossenschaft selbst. Nachdem der Großteil der Interessenten vermutlich die taz recht gut kennt, empfahl ich, als zweiten Punkt die Seite über die Genossenschaft zu platzieren. Als Drittes könnte dann „So einfach werden Sie GenossIn“ stehen, gefolgt von der Prämienseite und der Bestellseite für die Broschüre.

Alle weiteren Informationen könnten in einen Hintergrund- oder Zusatzinformationsteil verlegt werden. Diesen könnte man beispielsweise mit einer einfachen Zwischenüberschrift „Hintergrund“ in der Navigationsleiste von den anderen Links abteilen. Davon wiederum abgesetzt wäre dann der letzte Punkt, “email“. Die Begriffe für die thematisch zusammengehörigen Seiten empfahl ich einheitlich zu formulieren. Vorschlag:

Der Link “email“ könnte eindeutiger beschriftet werden, da in der waagrechten Navigation oben rechts, direkt neben „taz-Genossenschaft“, ein Link gleichen Namens steht, der jedoch ein Formular aufruft. Um den Besuchern Orientierung zu geben, wo sie sich gerade auf der Site befinden, empfahl ich dringend, die Startseite auch in der Navigation an die erste Stelle zu setzen (dort steht bisher das „Editorial“). Außerdem ist es nicht nur unnötig, in der Navigation die aktuelle Seite zu verlinken, sondern es irritiert auch, da man so nicht sieht, wo man gerade ist. Es sollte die Verlinkung der jeweils aktuellen Seite entfernt werden (dann verschwindet auch die Unterstreichung).

Um die Orientierung weiter zu erleichtern, wäre es hilfreich, wenn alle Seiten als Überschrift auf der Seite denselben Titel tragen, der auch als Navigationseintrag verwendet wird. Das Gleiche gilt für das TITLE-Tag, das den Namen bestimmt, der in der Kopfzeile des Browserfensters erscheint.

Vergleich der Ergebnisse mit drei vs. Fünf Testpersonen

Nach meiner Einschätzung sind die in den letzten zwei der fünf Tests gefundenen Probleme zwar nicht unwichtig, dennoch kamen keine gravierenden Dinge zutage, die sonst unentdeckt geblieben wären. Mit fast jedem weiteren Test findet man ein paar Kleinigkeiten, die zuvor noch nicht aufgefallen waren. Doch war es auch in diesem Fall so, dass die Ergebnisse mit drei Testpersonen fast genauso gut ausgefallen wären wie mit fünf – was Steve Krugs Meinung, drei Testpersonen seien genug, in diesem Fall bekräftigt.

Überarbeitung der Site

Einige Zeit später wurde ich beauftragt, konkrete Vorschläge zur Überarbeitung des Genossenschaftsbereichs von taz.de auszuarbeiten, um die gefundenen Probleme zu beseitigen. Ich änderte vor allem die Struktur der Navigation links, benannte die Links um und schrieb einige Seiten mit den Basisinformationen so um, dass die Interessenten diese schneller finden. Die Vorschläge wurden mit dem taz-Team diskutiert und angepasst und schließlich von diesem umgesetzt.

Abb. 6: Die wichtigste Seite vor Test und Überarbeitung – hier entscheidet sich, ob die Interessenten den nächsten Schritt tun.
Abb. 7: Die gleiche Seite nach der Überarbeitung. Entsprechend den Ergebnissen nur leicht umgebaut, aber vor allem um den ersten, wichtigsten Absatz ergänzt.

Fazit

Im ersten Teil der Artikelserie zu Usability-Tests haben wir die Grundlagen für die Analyse der Benutzerführung einer Webseite behandelt. Teil zwei ist dann auf den konkreten Ablauf und die Auswertung eines Usability-Tests eingegangen. Mitunter bleiben dabei aber Fragen offen die mit den ergänzenden Maßnahmen aus Teil drei abgefangen werden können. Im vierten Teil wurden dann Normen und Vorschriften rund um das Thema Usability behandelt. Dieser letzte Teil mit Praxisbeispielen rund um die Entwicklung ergonomischer Webseiten schließt die Artikelserie nun ab. (ala)

Website-Konzeption – Erfolgreiche Websites planen und umsetzen

Dieser Beitrag basiert auf Kapitel 7 des Buchs „Website-Konzeption – Erfolgreiche Websites planen und umsetzen“ von Jens Jacobsen. Dieses Standardwerk für Web-Entwickler können Sie hier in unserem Partnerbuchshop Informit.de für 39,95 Euro versandkostenfrei bestellen.

Artikelserie

Website-Konzeption Teil 1: Grundlagen von Usability-Tests

Website-Konzeption Teil 2: Usability-Tests durchführen

Website-Konzeption Teil 3 Ergänzende Maßnahmen

Website-Konzeption Teil 4: Ergonomie- und Usability-Normen

Website-Konzeption Teil 5: Praxisbeispiele