Prüfstand: Das neue Yahoo! Mail

Dieser Artikel wurde am 21.09.2011 ursprünglich auf meinem englischen Blog veröffentlicht.

Yahoo! haben vor nicht allzu langer Zeit eine neue Version von Yahoo! Mail angekündigt. Im Zuge dieser Ankündigung wurde auf den einschlägigen Kanälen auch vermehrt auf eine deutlich verbesserte Zugänglichkeit dieser Webanwendung hingewiesen. Es ist nun an der Zeit, dieser verbesserten Zugänglichkeit auf den Zahn zu fühlen. Also los geht’s!

Zum Testen verwendete ich den aktuellen Firefox sowie die aktuelle Version 2011.2 des Screen Readers NVDA. Weiterhin fand ich es ratsam, mir in der englischsprachigen Hilfe zur Yahoo! Mail Accessibility, speziell hier auch die Übersicht der Tastaturkürzel, einen Überblick über die Funktionalität zu verschaffen. Die deutsche Hilfe bietet hier leider noch gar keine diesbezüglichen Inhalte, so dass ich auf die englischsprachige Version zurückgriff.

Erste Schritte

Mit diesen Informationen ausgestattet loggte ich mich in mein Yahoo! Mail-Konto ein. Ich wurde aufgefordert, auf das neue Yahoo! Mail umzustellen. Dies muss gemacht werden, um die neuen Funktionen nutzen zu können.

Es begrüßte mich der Reiter „Neuigkeiten“ des neuen Yahoo-Mail-Interfaces. Dies ist eine Sammlung aktueller Schlagzeilen. Am oberen Rand gibt es jedoch auch einen Link, der den Anwender direkt in den Posteingang führt. Hier wird einem auch mitgeteilt, wie viele ungelesene Nachrichten und wie viele Nachrichten insgesamt vorhanden sind.

Der Posteingang

Ich aktivierte nun den Link, der mich zum Posteingang führen sollte. Was nun folgte war ein Umschalten in den Fokus-Modus, weg vom standardmäßig aktiven Browse-Modus (virtueller Cursor). Der Grund wurde sehr schnell offensichtlich: Die Nachrichtenliste im Posteingang ist ein sehr funktionales Widget, in dem man mit den Pfeiltasten rauf und runter durch die Nachrichten navigieren kann. Die Rückmeldungen per Sprachausgabe sind einfach traumhaft! Man bekommt automatisch alle relevanten Informationen zur gewählten Nachricht angesagt, genauso als wäre man in einem Desktop-E-Mail-Programm wie Thunderbird oder Outlook.

Es stehen, wie man aus der oben verlinkten Liste von Tastaturkürzeln ersehen kann, eine ganze Reihe weiterer Tastaturkürzel, mit denen man Funktionen ausführen kann, zur Verfügung. Entfernen löscht eine Nachricht und sorgt für sehr gutes Feedback durch die Sprachausgabe, mit r leitet man eine Antwort ein, mit w leitet man eine Nachricht weiter. Ja, diese Tastenkürzel sind anders als in Thunderbird oder Outlook, aber wenn man von Outlook auf Thunderbird wechselt, muss man ja auch neue Tastaturkürzel lernen! 🙂

Lesen einer Nachricht

Mit einem Druck auf die Eingabetaste wird eine Nachricht zum Lesen geöffnet. Und hier zeigt sich eine der absolut gelungensten Implementierungen von WAI-ARIA: Die Rollen „Application“ und „Document“ werden hier sehr intelligent und vor allem korrekt eingesetzt und sorgen für einen reibungslosen Wechsel zwischen Fokus- und Browse-Modus des Screen Readers. Die Nachrichtenliste muss definitiv als Applikation behandelt werden, eine individuelle Nachricht ist hingegen ganz eindeutig ein Dokument. Und genau das passiert hier auch. Nachdem die Nachricht geöffnet wurde, schaltet NVDA automatisch zum Browse-Modus um und beginnt, die Nachricht zu lesen. Handelt es sich hier um eine einfache Nachricht, befindet sich am unteren Rand gleich eine Antwort-Box, so dass man sofort auf die Nachricht antworten kann. Es gibt hier allerdings keine Zitat-Funktion. Wenn man also eine vollständige Bearbeitung wünscht, sollte man die Nachricht schließen und mit r in der Nachrichtenliste ein großes Antwort-Fenster öffnen.

Mit escape wird eine Nachricht geschlossen, und man landet wieder in der Nachrichtenliste. Dabei wird die letzte Position beibehalten, man kann also mit dem Durchsehen der Nachrichten dort weitermachen, wo man die Nachricht geöffnet hatte.

Da gibt’s aber noch mehr

Mit tab wandert man durch das Hauptfenster von Mail. Hierbei ist die Tastaturnavigation äußerst clever: Tab springt nur gruppierende Elemente wie Symbolleisten an. Möchte man die Elemente innerhalb einer Symbolleiste erkunden, nutzt man dazu die Pfeiltasten rechts und links. Enthält eine Symbolleiste also 10 Elemente, muss man diese nicht alle durchtabben, sondern springt mit tab gleich zum nächsten Gruppenelement oder anderen Widget weiter.

Kontakte

Der Reiter „Kontakte“ ist der Ort, an dem man seine Kontakte durchsehen, Kontakte aus anderen Konten importieren kann usw. Die Kontaktliste ist der Nachrichtenliste sehr ähnlich: Man wählt auch hier mit den Pfeiltasten einen Kontakt aus. Das Umschalten zwischen Applikations- und Browse-Modus funktioniert auch hier einwandfrei, und das Feedback durch die Sprachausgabe ist genauso durchdacht wie in Mails.

Apropos Reiter: Wann immer etwas nicht ganz so implementiert wurde, wie man es vom Desktop her gewohnt ist, gibt es automatisch gesprochene Hilfestellungen, die die Besonderheiten der Navigation und Interaktion erklären. Ist man z. B. auf der Liste der Reiter (Tabs) gelandet, wird man angewiesen, dass die Pfeiltasten links und rechts einen anderen Reiter auswählen, und dass erst ein Druck auf Eingabe diesen Reiter tatsächlich aktiv schaltet. In Windows-Anwendungen bewirkt allein das Umschalten mit den Pfeiltasten ein aktiv Schalten der entsprechenden Dialogseite. Dieser Unterschied in der Interaktion wird also sehr deutlich kommuniziert. Sehr gut gelungen!

Soziale Netzwerke

Der vierte der standardmäßig gezeigten Reiter heißt „Updates“. Hier verlinkt man sein Yahoo!-Profil mit denen, die man auf Facebook, Twitter usw. hat. Der Reiter selbst ist hauptsächlich dazu da, die Verbindungen zu konfigurieren und selbst Updates an seine sozialen Netzwerke zu schicken. Das eigentliche Lesen wird von einer separaten Webanwendung erledigt, die in einem eigenen Browsertab oder -fenster gestartet wird und eine ganz normale Webseite ist. Diese gibt einen schnellen und vor allem barrierefreien Überblick über die Timelines von Twitter und Facebook. Während beide sozialen Netzwerke immer noch Probleme bei der Zugänglichkeit ihrer Webanwendungen ausmerzen müssen, ist das Interface von Yahoo! vollständig zugänglich und lässt kaum etwas zu wünschen übrig.

Optionen setzen

Von der Hauptnavigation von Yahoo! Mail aus kann man Optionen konfigurieren, die auf Mail und andere Yahoo!-Anwendungen angewandt werden. In den Maileinstellungen kann man z. B. eine seitenweise Nachrichtenanzeige einstellen (Standardeinstellung), so dass kein Vorschaubereich oder andere Dinge angezeigt werden, die die Barrierefreiheit beeinträchtigen könnten. Hier kann man außerdem einstellen, dass der Posteingang standardmäßig nach der Anmeldung geöffnet wird. Ich habe dies so eingestellt, denn wenn ich Mail aufrufe, will ich auch Mails lesen!

Hier kann man auch weitere Konten hinzufügen, von denen Mail abgerufen werden soll. Hier ist einer der wenigen irritierenden Punkte aufgetaucht: Der Link zum Hinzufügen eines Kontos befindet sich am oberen Ende des virtuellen Dokuments, direkt oberhalb des Schalters „Änderungen speichern“. Ich hätte erwartet, den Link dort zu finden, wo auch die Erklärung für das Verwenden weiterer Konten steht.

Anwendungen von Drittanbietern

Man kann Anwendungen von Drittanbietern in Yahoo! Mail einbinden. Es gibt z. B. eine Anwendung namens „meine sozialen Netze“. Da diese Anwendungen von Drittanbietern hergestellt und ausgeliefert werden, ist nicht gewährleistet, dass sie dieselbe Zugänglichkeit bieten wie das eigentliche Yahoo! Mail. Manche können sogar vollständig unzugänglich sein. Sie können auch in Flash oder Silverlight entwickelt worden sein und nicht den Zugänglichkeitsstandards für diese Plattformen entsprechen. Yahoo! kann man dafür aber nicht die Schuld geben. Stattdessen sollte man sich an die Hersteller dieser Anwendungen wenden und sie auffordern, Zugänglichkeit in ihre Anwendungen einzubauen.

Fazit

Was Yahoo! hier abliefert ist ein sehr gutes Beispiel dafür, wie WAI-ARIA und andere Techniken zur Barrierefreiheit von HTML-Anwendungen richtig genutzt werden. WAI-ARIA wurde bisher hauptsächlich in größeren Firmen und/oder Intranet-Anwendungen, oder auf einigen spezialisierten öffentlichen Webangeboten eingesetzt und erlangte so nur eingeschränkte Verbreitung. Yahoo! Mail ist jedoch eine „Anwendung von der Stange“, die an Millionen von Nutzern ausgeliefert wird und gibt so der Technologie einen sehr breit gefächerten Einsatz.

Dies ist auch der erste webbasierte E-Mail-Client, auf den umzustellen ich mir persönlich vorstellen kann. Er ist der erste, der mir das Gefühl gibt, ihn genauso effektiv nutzen zu können wie meinen geliebten Desktop-Client. Die Angebote anderer Firmen wie die mit dem großen G sind viel zu ineffizient. An meinem Arbeitsplatz wird der Zimbra Webmail-Client eingesetzt, welcher völlig unzugänglich ist, so dass ich hier gar keine Wahl habe als einen zugänglichen Desktop-Client einzusetzen.

Yahoo! liefert hier zusammen mit der ebenfalls sehr zugänglichen Suche eine zugängliche, inkludierende Webanwendung aus, der gegenüber sich andere Anbieter in Grund und Boden schämen müssen, wenn sie ihren blinden Anwendern raten, vom Standard- zu einem Basis-Angebot zu wechseln, das natürlich drastisch im Funktionsumfang eingeschränkt ist. Dieselbe Firma, die ihren Screen-Reader-Nutzern empfiehlt, ihr Instant-Feature abzuschalten, weil sonst selbst Suchergebnisse nicht mehr garantiert barrierefrei sind. Yahoo! verfolgen hier eine Inklusions-Strategie, die unter den durch Aktionäre getragenen Webfirmen einmalig ist.

Es gibt natürlich hier und da noch unrunde Ecken zum Glätten. So ist in der deutschen Version von Yahoo! Mail das Tastaturkürzel zum Schließen eines Tabs nicht das englische Ctrl+, sondern etwas anderes. Dies habe ich jedoch bisher nicht herausgefunden, und wie oben bereits erwähnt gibt es noch keine deutschsprachige Liste von Tastaturkürzeln. Auch der Rest der Hilfe für die Zugänglichkeit ist noch nicht übersetzt. Eine Suche innerhalb der Hilfe nach Barrierefreiheit förderte keine, eine Suche nach Zugänglichkeit nur eine allgemein gehaltene Seite zur Zugänglichkeit von Mein Yahoo! zu Tage. Aber man kann sicher sein, dass diese Dinge innerhalb kurzer Zeit bereinigt werden, so dass auch Anwender, deren Muttersprache nicht englisch ist, in den vollen Genuss des neuen Yahoo! Mail kommen.

Einen großen Applaus für Yahoo!’s Inclusive-Design-Prinzip in Mail und ihre gute Zugänglichkeit!

Yahoo!’s veröffentlicht Menüsteuerelement mit wai-aria-Unterstützung

Yahoo!’s Accessibility-Guru Victor Tsaran hat in diesem Blogeintrag erläutert, wie Yahoo! in seinen angereicherten Steuerelementen jetzt ARIA (Accessible Rich Internet Applications) verwendet, um so komplexe und in HTML normalerweise nicht abbildbare Strukturen wie ein komplettes Menüsystem zugänglich zu machen.

Um das Beispiel ausprobieren zu können, braucht man Firefox 3 Beta 2 und entweder JAWS 8 oder Window-Eyes 6.x. Um zum Beispiel zu gelangen:

  1. Öffne aus dem oben genannten Blogeintrag den Link „New YUI example“.
  2. Wähle in dem Artikel den Link „View example in new window“.
  3. Navigiere mit den Pfeiltasten auf die erste Zeile, die mit „text/html“ beginnt und drücke EINGABE für den Formularmodus bzw. das Äquivalent in Deinem Screen-Reader.
  4. Navigiere Links und Rechts durch die Menüleiste und öffne ein Pulldown-Menü mit Pfeil Runter, wie in einer normalen Anwendung.

Ich habe es gerade selbst ausprobiert, und es hat richtig gut funktioniert. Gute Arbeit!