Barrierefreies Webdesign ein zugängliches und nutzbares Internet gestalten

Lass' mich erst fertig machen! veröffentlicht in 2013

Tastatureingabe und Kontextänderung

Die Bedienung von Steuerelementen (Formularen oder Widgets) kann für Tastaturnutzer problematisch werden, wenn Event-Handler mit belibigen Tastenbefehlen ausgelöst werden. Insbesondere wenn durch die bloße Bedienung der Steuerelemente Inhalte ausgetauscht werden oder sonstige Änderungen des Kontextes ausgelöst werden, ohne dass der Nutzer die Dynamik steuern kann, stehen diese Nutzer vor einem unlösbaren Problem. Obwohl nicht jede Kontextänderung eine Barriere bedeutet, so muss dennoch bei dynamischen Inhalten sorgfältig geprüft werden, ob Tastaturnutzer und insbesondere Screenreader-Nutzer die Steuerelemente bedienen können.

Änderungen des Kontextes betreffen zunächst den Fokus: Wenn auf eine neue Seite weitergeleitet wird oder neue Fenster oder Anwendungen geöffnet werden, wird der Fokus neu gesetzt. Auch das Entfernen des Fokus ist eine Änderung des Kontextes, denn dann steht der Tastaturnutzer unweigerlich wieder am Anfang der Seite. Kontextänderungen können aber auch unvorhersehbare Änderungen im Inhalt sein. Obwohl diese dynamischen Änderungen grundsätzlich keine Barriere bedeuten, so stellen sie Nutzern dann vor Probleme, wenn sie bei der Bedienung von Steuerelementen oder beim Navigieren innerhalb einer Webseite ausgelöst werden.

Es gibt etliche Beispiele im Web, die mit kleinem Aufwand für die Tastaturbedienung besser nutzbar gemacht werden können. Für einige dynamische Situationen muss eine Schaltfläche zusätzlich berücksichtigt werden, damit das Formular tastaturbedienbar wird. Natürlich kann die Tastatursteuerung in vielen Fällen auch mit JavaScript kontrolliert werden. Des Weiteren gibt es Situationen, die dem Grunde nach auch mit der Tastatur gut bedient werden können, aber wegen der Kontextänderung lediglich einen Texthinweis auf die Dynamik bedürfen.

Änderung von Einstellungen

Wenn eine Schaltfläche durch einen Klick oder Drücken der Eingabetaste ausgelöst wird, so dürfen Webentwickler davon ausgehen, dass der Nutzer Formulardaten abschicken will - der Nutzer wird eine Aktion erwarten. Wenn hingegen in Steuerelementen eine Auswahl getroffen oder eine Eingabe vorgenommen wird, können Webentwickler nicht wissen, wann ein Nutzer mit der Eingabe fertig ist. Entsprechend sind dynamische Aktionen mit Vorsicht einzusetzen:

Es geht im Übrigen bei der Vermeidung von Kontextänderungen nicht darum, Dynamik auf Seiten aus Gründen der Barrierefreiheit zu vermeiden. Vielmehr geht es darum, die Tastatur als Eingabegerät in Scripts besonders zu behandeln. Viele Anwendungen funktionieren gut für den Mauszeiger; der Mausklick löst technisch gesehen aber andere Events aus als ein Tastenschlag auf einer Tastatur. Es ist beim Auslösen von Aktionen daher wichtig, die verschiedenen Eingabegeräte (Mauszeiger, Tastatur, Touch-Screen) und die entsprechenden Events gesondert zu behandeln bzw. aufeinander abzustimmen.

Beispiel: Schaltfläche erforderlich

Tastaturnutzer müssen oft eine Seite mit der Tabulatortaste "durchwandern", um ein bestimmtes Ziel zu erreichen. Wenn Formulare dynamisch abgeschickt werden:

<p>
  <label for="kundennummer">Geben Sie Ihre achtstellige Kundennummer ein, um fortzufahren:</label>
  <input type="text" size="8" maxlength="8" name="kdnr" id="kundennummer" onchange="document.forms[0].submit();" />
</p>

dann haben Tastaturnutzer möglicherweise ein Extern, englischsprachig: großes Problem bei der Bedienung der Seite.

Dass ein Formular gesendet werden kann, wenn ein Nutzer das Feld mit der Tabulatortaste oder einem Mausklick verlässt, setzt zum einen voraus, dass das Formular vollständig ausgefüllt wurde, und zum anderen, dass der Nutzer keine Änderungen vornehmen möchte. Möglicherweise will ein Tastaturnutzer aber dieses Steuerelement — selbst wenn schon ein Text eingegeben wurde — verlassen, um etwas anderes auf der Seite zu tun (z.B. ein anderes Formularelement bedienen).

Das Abschicken des Formulars muss vom Tastaturnutzer explizit ausgelöst werden, was durch die Eingabetaste erfolgt. In diesem Beispiel ist es ratsam, das Abschicken des Formulars durch eine Schaltfläche (Button) zu ermöglichen. Die Verwendung von Event-Handlern hingegen kann für die Validierung der Eingabe genutzt werden.

Entscheidend für die Barrierefreiheit ist, ob ein Tastaturnutzer die Kontrolle über den Fokus und den Inhalt hat. Vor allem wenn neue Seiten aufgerufen werden, ohne dass der Nutzer dies durch Drücken der Eingabetaste befehligt hat, findet eine ungewollte Änderung des Kontextes statt.