renvert.com Logo Druckversion


Accesskeys Schlüssel zur Barrierefreiheit?

Was sind Accesskeys, und wie werden sie definiert? Ist ihr Einsatz überhaupt sinnvoll?

[zum Inhalt]
Hintergrundbild

Inhaltsübersicht

  1. Einleitung: Accesskeys sind wichtige Shortcuts
  2. Accesskeys definieren
  3. Tabelle: Die Tastenkombinationen der Browser im Überblick
  4. Es gibt keinen Standard. Oder etwa doch?
  5. Vorsicht beim Einsatz von Accesskeys
  6. Hast Du welche — dann zeige sie!
  7. Tabelle: Accesskeys auf renvert.com
  8. Diskussion: Deine Meinung ist gefragt. 

Accesskeys sind wichtige Shortcuts

Nicht jeder Internetnutzer ist in der Lage, eine Maus zu bedienen. Sei es durch körperliche Einschränkungen oder aber einfach durch eine zeitweise Einschränkung. Das kann z. B. ganz banal die Tasse Tee sein, die man im Moment nirgens abstellen kann. Oder aber der Nachwuchs, der gerade mal wieder auf den Schoß genommen werden möchte. Generell geht es einfach darum, Webinhalte nicht bloß von einem Eingabegerät wie der Computermaus, abhängig zu machen.

Accessibility – also eine uneingeschränkte Erreichbar- und somit Benutzbarkeit des Internetangebots – sollte weitgehend gewährleistet sein. Daher heißen die wichtigsten Grundsätze für Links:

  1. Verwende semantisches Markup, z. B. <nav> Elemente und das rel="" Attribut.
  2. Fasse Navigationsstrukturen in ungeordneten Listen <ul></ul> zusammen.

Zusätzlich zu einer logischen Navigationsstruktur und der Möglichkeit, Links durch das "Durchtabben", also mit Hilfe der Tabulator-Taste, erreichbar zu machen, können wir uns sogenannter "Accesskeys" bedienen. Das sind vordefinierte Kurzbefehle für die wichtigsten Links auf unserer Website. Laut den Bedingungen für die Barrierefreiheit einer Website stellen auch Accesskeys eine Vorgabe dar – wenn auch mit geringer Priorität.

Accesskeys definieren

Einen Accesskey zu definieren ist ganz einfach. Hierzu versieht man den entsprechenden Link bloß mit dem Attribut accesskey und dem gewünschten Wert, also der gewünschten Taste:

<a href="/" title="zur Startseite" accesskey="1">Startseite</a>

In diesem Beispiel wäre nun die Startseite mit der Taste 1 erreichbar. Aha.. So. Und nun? Wenn ich die 1 drücke, passiert nichts. Das stimmt. Accesskeys werden durch eine Kombination aus Befehlstasten plus des gesetzten Keys angesprochen. Diese Tastenkombination ist nicht immer gleich, sondern vom Betriebssystem und vom verwendeten Browser abhängig.

Die Tastaturkombinationen der Browser im Überblick:

Web-Browser Tasten-Kombination (plus Accesskey) Bemerkungen
Chrome

Alt unter Windows, FreeBSD, und Linux (Hinweis: Alt+⇧ Shift kann unter gewissen Umständen erforderlich sein);

Ctrl + ⌥ Opt unter MacOS

Wird ab Version >2.x unterstützt.
Firefox

Alt+⇧ Shift unter Windows, FreeBSD and Linux

Ctrl unter MacOS (bis v14.0);

Ctrl+⌥ Opt unter MacOS (v14.0.1 and höher)

Unter Version 2 benutzte der Firefox nur Alt;Diese Einstellung ist unter about:config konfigurierbar
Internet Explorer Alt Vor dem IE Version 8 fokussierte die Kombination Alt + Access Key das jeweilige Element; es war aber das anschl. Drücken der ↵ Enter Taste erforderlich, um den Link auszulösen. Dies ist immer noch der Fall für Hyperlinks im IE 9. Alt+D darf als Accesskey nicht verwendet werden (ab IE Version 7).
Safari 3

Ctrl unter MacOS;

Alt unter Windows

 
Safari 4 und höher

Ctrl+⌥ Opt unter MacOS;

Alt für Windows-User

 
Opera 12 ⇧ Shift+esc Mit dem Drücken dieser Kombination zeigt dieser Browser die komplette Liste aller verfügbarer Accesskeys inkl. ihrer Aktionen. Dann kann der Benutzer den gewünschten Accesskey drücken.
Opera 15 und höher

Alt unter Windows, FreeBSD, and Linux (Hinweis: Alt+⇧ Shift kann unter gewissen Umständen erforderlich sein);

Ctrl + ⌥ Opt on Mac

 

Tabelle – Quelle: Wikipedia (übersetzt aus dem Englischen)

Es gibt keinen Standard.
Oder etwa doch?

Zu Beginn meiner Recherchen war der Tenor eindeutig. Es gibt keinen Standard bis auf eine Empfehlung von der Britischen Regierung. Kein Standard hieße jedoch auch: keine Sicherheit auf fehlerfreie Funktionalität und Erreichbarkeit und somit ein generelles Infragestellen des Einsatzes von Accesskeys.

Wie gesagt – das war bevor ich diesen Artikel schrieb. Dann stieß ich heute, am 14. Januar,  auf einen Link, der Hoffnung gab. Angeblich gibt es seit dem 31. Oktober. 2014, also erst seit Kurzem, einen neuen Standard für die Tastenbelegung fest definierter Ziffern- sowie Buchstaben-Tasten. Inwieweit und von wem dieser Standard ratifiziert wurde, sei einmal dahingestellt. Solange dieser nicht von der W3C genehmigt ist, wird es wohl auch hier zunächst bei einer Empfehlung bleiben.

Vorsicht beim Einsatz von Accesskeys

Ich habe bewusst die Überschrift dieses Artikels als Frage formuliert, da der Einsatz von Accesskeys Vor- und auch Nachteile mit sich bringen kann. Von manchen wird diese Methode generell in Frage gestellt und empfehlen die beiden in meiner Einleitung erwähnten Methoden. Sollte die Webseite in vielen Ländern aktiv sein, empfiehlt es sich allemal, vollständig auf Buchstaben in den Accesskeys zu verzichten und nur die Ziffern 1–0 zu verwenden. In dieser Definition zur Barrierefreiheit werden Accesskeys ebenfalls als kontrovers eingestuft.

Hast Du welche  dann zeige sie!

Solltest Du die Verwendung von Accesskeys berücksichtigen, ist es höchst ratsam, den Besuchern Deiner Seite auf diese Belegung aufmerksam zu machen. Wie schon gesagt – auch hier gibt keinen Standard.
Mir fallen derzeit 4 Möglichkeiten ein:

  1. Unterstreiche den verwendeten Buchstaben im Namen des Navigationspunktes.
  2. (oder) schreibe die Accesskey-Taste hinter den Navigationspunkt.
  3. Schreibe den Accesskey in das title-Tag des Links. So erscheint dieser Hinweis beim MouseOver und kann von Screenreadern vorgelesen werden.
    Bsp.: <a href="/" title="zur Startseite [accesskey: 1]" accesskey="1">Startseite</a>
  4. (und) stelle eine Übersicht der Accesskeys zur Verfügung.

Ich habe mich auf renvert.com für die Varianten 3 und 4 entschieden. Die Hauptnavigation lässt sich mit den Tasten 1–5 durchgehen; die Accesskey-Übersicht ist mit Taste K erreichbar.
Somit erfülle ich — wenn auch in Ansätzen — die Empfehlung laut SAK2014: Standard Access Keys 2014.

Probiere es aus!
Du verwendest den Browser (nicht erkannt) unter (nicht erkannt). Drücke die entsprechende Tastenkombination Deines Browsers plus einer Taste aus der nachfolgenden Übersicht:

Accesskeys auf renvert.com

 Taste Aktion Beschreibung Link ist sichtbar Url
1 Seite: Startseite Verlinkung zur Startseite ja /
2 Seite: Leistungen Verlinkung zur Seite "Leistungen" ja /leistungen
3 Seite: Portfolio Verlinkung zum Portfolio (Übersicht) ja /portfolio
4 Seite: Blog Verlinkung zum Blog (Übersicht) ja /blog
5 Seite: Kontakt Verlinkung zur Kontaktseite ja /kontakt
6 Seite: Impressum Verlinkung zum Impressum ja /impressum
k K Seite: Accesskeys Verlinkung zur Übersicht aller Accesskeys (Diese Tabelle auf einer separaten Seite.) nein /accesskeys
s S Aktion: zum Inhalt Überspringt die Hauptnavigation und setzt den Focus auf das erste Element nein #main-content
a A Anker: zum Artikel Überspringt alle Headlines / Teaser und scrollt direkt zum Artikel. ja* #article-content
p P Seite: Vorherige Beitrag Öffnet den Beitrag in Portfolio oder Blog, der chronologisch vor dem aktuellen Beitrag liegt. ja*  (wechselt)
n N Seite: Nächster Beitrag Öffnet den Beitrag in Portfolio oder Blog, der chronologisch nach dem aktuellen Beitrag liegt. ja*  (wechselt)
t T Aktion: Nach oben scrollen Scrollt von jeder Stelle der Seite an den Anfang zurück. ja* #top
m M Anker: Hauptnavigation Springt und setzt den Focus zur Hauptnavigation nein #main-navigation
w W Anker: Werkzeugleiste Setzt den Focus auf die Werkzeugleiste nein #toolbar
l L Aktion: Seite teilen Öffnet den Teilen-Dialog, um die aktuelle Seite in den sozialen Netzwerken zu teilen. ja* Javascript Funktion / noscript: öffnet Facebook Teilen-Dialog
i I Aktion: Profil / Login Öffnet das Login-Formular bzw. das eigene Profil wenn eingeloggt. ja* Javascript Funktion / noscript: öffnet den Login bzw das Profil in einem neuen Fenster.
o O Aktion: Logout Wenn eingeloggt, wird der Nutzer direkt ausgeloggt. ja** Logout

Tabelle – Übersicht aller Accesskeys auf renvert.com.
* Verlinkung befindet sich auf Desktops in der linken Werkzeugleiste
** Verlinkung befindet sich im eingeblendeten Profilfenster

Sollte sich im Laufe der Zeit herausstellen, dass die Verwendung einzelner Accesskeys keinen Sinn macht oder sich doch ein offizieller Standard herauskristallisiert, so werden die Keys angepasst.

Deine Meinung ist gefragt.

Wie stehst Du zu Accesskeys? Setzt Du sie in Deinen Projekten ein? Hältst Du den neuen Ansatz für einen allgemeinen Standard für durchdacht? Oder sind Accesskeys generell überflüssig?
Über Kommentare oder Feedback zum Thema würde ich mich freuen.

Folge mir auf twitter

Hinweis: Momentan ist die Geschwindigkeit meiner Website aufgrund eines Serverproblems bei meinem Hosting-Anbieter stark beeinträchtigt.
Ich bitte, diese Unannehmlichkeit zu entschuldigen.


Fenster schließen

Danke fürs Teilen.

Fenster schließen