Prüfpunkt 2.5.3Stufe AZeiger, Gesten und Zielgrößen
Warum muss die sichtbare Beschriftung im hinterlegten Namen vorkommen?
Die sichtbare Beschriftung eines Bedienelements muss in seinem hinterlegten, maschinenlesbaren Namen vorkommen, weil Sprachsteuerungs-Nutzer sprechen, was sie sehen: Wer „Klicke auf Senden“ sagt, erreicht die Schaltfläche nur, wenn deren hinterlegter Name das Wort „Senden“ enthält. Weicht der unsichtbare Name ab, läuft der Sprachbefehl ins Leere. Das WCAG-Kriterium 2.5.3 „Beschriftung im Namen“ verhindert genau dieses Auseinanderfallen.
Sichtbarer Text und hinterlegter Name können auseinanderfallen
Jedes Bedienelement trägt neben dem sichtbaren Text einen maschinenlesbaren Namen, den Vorleseprogramme und Sprachsteuerung verwenden. Normalerweise sind beide identisch. Auseinander fallen sie, wenn Entwickler den Namen im Quelltext gezielt überschreiben — oft in guter Absicht, um Vorleseprogrammen mehr Zusammenhang zu geben. Ein Beispiel: Die Schaltfläche zeigt „Angebot anfordern“, der hinterlegte Name lautet „Kontaktformular öffnen“. Ein Sprachsteuerungs-Nutzer sagt „Klicke auf Angebot anfordern“ — und nichts geschieht, denn ein Element dieses Namens existiert für die Software nicht. Die Regel ist einfach: Der hinterlegte Name darf ergänzen, muss aber den sichtbaren Wortlaut enthalten, am besten an erster Stelle.
So prüft der Prüfservice die Beschriftung im Namen
Die Messung sucht alle Links und Schaltflächen, deren Name im Quelltext überschrieben wurde, und vergleicht den sichtbaren Text mit dem hinterlegten Namen. Fehlt der sichtbare Wortlaut im Namen vollständig, gilt das Kriterium als verstoßen — der Bericht benennt das Element und beide Texte. Grenzfälle behandelt die Messung vorsichtig: Sind die ersten Wörter der Beschriftung im Namen enthalten, nur der weitere Wortlaut weicht ab, vermerkt der Bericht einen manuellen Prüffall statt eines Verstoßes. Sehr kurze sichtbare Texte, die als Symbol wirken — etwa ein „X“ zum Schließen —, sind laut Kriterium ausgenommen und werden nicht angelastet.
Beispiele
Hinterlegter Name ohne die sichtbare Beschriftung
<button aria-label="Absenden">Anfrage schicken</button><button>Anfrage schicken</button>
<!-- oder: aria-label="Anfrage schicken an den Vertrieb" -->Sprachsteuerung sagt „Klicke Anfrage schicken“. Der zugängliche Name muss den sichtbaren Text enthalten, am besten am Anfang.
So gehen Sie es an
- Bitten Sie Ihre Agentur, alle überschriebenen Namen im Quelltext aufzulisten und mit den sichtbaren Beschriftungen abzugleichen.
- Stellen Sie den sichtbaren Wortlaut an den Anfang des hinterlegten Namens; Ergänzungen folgen dahinter.
- Verzichten Sie auf überschriebene Namen, wo der sichtbare Text bereits alles sagt — kein Name ist besser als ein abweichender.
- Testen Sie stichprobenartig mit der Sprachsteuerung Ihres Telefons: Sagen Sie den sichtbaren Text einer Schaltfläche und prüfen Sie, ob sie reagiert.
Weiter im Prüfbereich Barrierefreiheit
- Warum brauchen Schüttel- und Neigefunktionen eine Alternative?Funktionen per Schütteln oder Kippen des Geräts brauchen normale Bedienelemente als Alternative und eine Abschaltung. Das verlangt WCAG 2.5.4.
- Warum braucht Drag-and-drop eine einfache Klick-Alternative?Ziehen und Ablegen kann nicht jeder: Wer den Finger nicht gedrückt halten und bewegen kann, braucht Klick-Alternativen. Das verlangt WCAG 2.5.7.
- Wie groß muss eine Schaltfläche auf einer Website mindestens sein?Mindestens 24 mal 24 Bildpunkte: Das verlangt WCAG 2.2 für Bedienflächen. Kleinere Ziele verfehlen Menschen mit zitternden Händen regelmäßig.
- Warum muss eine Website ihre Sprache angeben?Jede Website muss ihre Sprache im Quelltext angeben, damit Vorleseprogramme richtig aussprechen. So prüfen wir WCAG-Kriterium 3.1.1 automatisch.
Dieser Prüfpunkt gehört zum Prüfbereich Barrierefreiheit; dort stehen alle Prüfpunkte im Überblick. Was die Prüfung insgesamt leistet, zeigt die Leistungsseite; wie ein Ergebnis zustande kommt, erklärt das Prüfverfahren. Alle Prüfbereiche im Überblick: Wissensbasis.
Foto: Gilles Lambert, CC0
.jpg){kind=link}