HTML- und XHTML-Steuerelemente, die externe Beschriftungen benutzen
Die Technik bezieht sich auf:
Die HTML und XHTML-Spezifikationen erlauben sowohl implizite als auch explizite Beschriftungen. Allerdings verarbeiten einige assistierende Techniken implizite Beschriftungen nicht korrekt (zum Beispiel <label>First name <input type="text" name="firstname"></label>
).
JAWS 7.10 wurde unter Windows XP mit Internet Explorer 6.0 und Firefox 1.5 getestet. Es liest die Beschriftung für explizite und implizite Beschriftungen von Textfeldern sowohl im Virtuellen-Cursor-Modus als auch im Formularmodus. Im Formularmodus liest es keine Beschriftungen für implizite Beschriftungen bei Kontrollkästchen und Radio-Feldern.
Window-Eyes 5.5 wurde unter Windows XP mit Internet Explorer 6.0 und Firefox 1.5 getestet. Es spricht immer die Beschriftung von einem explizit beschrifteten Formularfeld. Es spricht keine Beschriftung für implizit beschriftete Formular-Steuerelemente im browse-on-Modus aber es spricht die implizite Beschriftung, wenn man im browse-off-Modus von Steuerelement zu Steuerelement navigiert.
Benutzeragenten zeigen einen Tooltip an, wenn die Maus über einem input
-Element, das ein title
Attribut hat, schwebt. Title-Attribute werden assistierenden Techniken gezeigt und als Tooltips in vielen grafischen Browsern angezeigt. Tooltips können nicht per Tastatur geöffnet werden, also kann es sein, dass diese Information sehenden Tastatur-Benutzern nicht zur Verfügung steht.
Wenn keine Beschriftung (label
) zur Verfügung steht, sprechen JAWS und Window-Eyes das title
-Attribut, wenn das Formular-Steuerlement des Fokus erhält
JAWS 6.0 und höher kann so eingestellt werden, dass sowohl label
als auch title
gesprochen werden, wenn die zwei Elemente unterschiedlich sind; allerdings haben nur sehr wenige Benutzer von dieses Einstellung Kenntnis.
WindowEyes 5.5 hat einen Kurzbefehl, ins-E, der that will display additional information, including the title attribute, for the item with focus.
Einige Benutzeragenten (besonders der Window-Eyes Screenreader) sprechen standardmäßig nicht das Asterisk-Zeichen in Formular-Beschriftungen. Es gibt eine Einstellung, die Window-Eyes-Benutzer verändern können, um dieses Verhalten anzupassen, aber es sollte erwartet werden, dass viele Benutzer diese Änderungen nicht gemacht haben.
Das Ziel dieser Technik ist es, eine klare Angabe dazu zur Verfügung zu stellen, dass ein bestimmtes Formular-Steuerelement in einer Webanwendung oder in einem Formular zum erfolgreichen Absenden von Daten erforderlich ist. Ein Symbol oder Text, der darauf hinweist, dass das Steuerelement erforderlich ist, wird durch Software mit dem Feld verbunden, indem das label
-Element oder bei Gruppen von Steuerelementen das legend
-Element per fieldset
verbunden wird. Wenn ein Symbol benutzt wird, dann wird der Benutzer vor der ersten Benutzung über dessen Bedeutung informiert.
Das Textfeld in dem unten stehenden Beispiel hat die explizite Beschriftung „First name (required)“ - „Vorname (Pflichtfeld)“: Das for
-Attribut des label
-Elements entspricht dem id
-Attribut des input
-Elements und der label
-Text weist darauf hin, dass das Steuerelement ein Pflichtfeld ist.
Code-Beispiel:
<label for="firstname">First name (required):</label>
<input type="text" name="firstname" id="firstname" />
Anmerkung: Einige Autoren kürzen „required“ mit „req.“ ab, aber es gibt anekdotische Evidenz, die darauf hindeutet, dass diese Abkürzung verwirrend ist.
Das Textfeld in dem unten stehenden Beispiel hat eine explizite Beschriftung, die einen Asterisken enthält, um darauf hinzuweisen, dass das Steuerelement ein Pflichtfeld ist. Es ist wichtig, dass die Bedeutung des Asterisken am Beginn des Formulars definiert wird. In diesem Beispiel ist der Asterisk innerhalb eines span-Elements enthalten, damit das Asterisk-Zeichen formatiert werden kann, damit es größer als das Standard-Asterisk-Zeichen ist, da es für diejenigen mit eingeschränktem Sehvermögen schwierig sein kann, das Asterisk-Zeichen zu sehen.
Code-Beispiel:
CSS:
.req {font-size: 150%}
HTML:
<p> Required fields are marked with an asterisk (<abbr class="req" title="required">*</abbr>).</p>
<form action="http://www.test.com" method="post">
<label for="firstname">First name <abbr class="req" title="required">*</abbr>:</label>
<input type="text" name="firstname" id="firstname" />
Das Textfeld im unten stehenden Beispiel hat eine explizite Beschriftung, die ein Bild enthält, um darauf hinzuweisen, dass das Steuerelement ein Pflichtfeld ist. Es ist wichtig, dass die Bedeutung des Bildes am Beginn des Formulars definiert wird.
Code-Beispiel:
<p><img src="req_img.gif" alt="Required Control" /> indicates that the form control is required</p>
<form action="http://www.test.com" method="post">
<label for="firstname">First name <img src="req_img.gif" alt="Required Control" />:</label>
<input type="text" name="firstname" id="firstname" />
...
Radiobuttons und Kontrollkästchen werden anders als andere interaktive Steuerelemente behandelt, da einzelne Radiobuttons und Kontrollkästchen keine Pflichtfelder sind, aber darauf hingewiesen wird, dass eine Anwort für die Gruppe Pflicht ist. Die in den Beispielen 1-3 benutzen Methoden gelten für Radiobuttons und Kontrollkästchen, aber der Hinweis auf den Pflichtfeld-Status sollte im legend
-Element statt im label
-Element platziert werden.
Code-Beispiel:
<fieldset>
<legend>I am interested in the following (Required):</legend>
<input type="checkbox" id="photo" name="interests" value="ph">
<label for="photo">Photography</label></br>
<input type="checkbox" id="watercol" name="interests" checked="checked" value="wa">
<label for="watercol">Watercolor</label></br>
<input type="checkbox" id="acrylic" name="interests" checked="checked" value="ac">
<label for="acrylic">Acrylic</label>
…
</fieldset>
Ressourcen sind nur zu Informationszwecken und keine offizielle Empfehlung.
Prüfen Sie für jedes Formular-Steuerelement, bei dem es sich um ein Pflichfeld handelt, ob auf den Pflichtfeld-Status im label
oder legend
des Formular-Steuerelements hingewiesen wird.
Prüfen Sie für jeden Hinweis zum Pflichtfeld-Status, der nicht im Text bereitgestellt wird, ob die Bedeutung des Indikators vor dem Formular-Steuerelement, das diesen benutzt, erklärt wird.
Alle oben genannten Tests sind wahr.
Wenn dies eine ausreichende Technik für ein Erfolgskriterium ist, dann bedeutet das Scheitern an diesem Testverfahren nicht zwangsläufig, dass das Erfolgskriterium nicht auf irgendeine andere Art und Weise erfüllt wurde, sondern nur, diese Technik nicht erfolgreich implementiert wurde und nicht benutzt werden kann, um die Konformität zu erklären.