summary-name-present

Summary-Elemente haben einen zugänglichen Namen

automaticWCAG 4.1.2 (A)Konfidenz: highSchweregrad: seriousrobust

Prüft, dass <summary>-Elemente einen nicht leeren zugänglichen Namen bereitstellen.

Anwendbarkeit. Gilt für <summary>-Elemente, die im Accessibility Tree enthalten sind und als Zusammenfassungs-Schaltfläche ihres übergeordneten <details> dienen: das erste <summary>-Kind eines <details>. Jedes andere <summary> (außerhalb eines <details>, tiefer verschachtelt oder ein zweites) ist überhaupt kein Steuerelement – es erhält weder den Fokus noch klappt es etwas auf oder zu –, hat also nichts zu benennen (so sieht es ACT 2t702h).

Erwartung. Das Element hat einen nicht leeren zugänglichen Namen aus aria-label, aus einem aria-labelledby, das zu nicht leerem Text aufgelöst wird, aus title oder aus dem Text seines eigenen Teilbaums. Dabei zählt der eigene Name eines Nachfahren (ein <img alt>, aria-label oder title) als dessen Beitrag.

Beispiele

pass
<details>
<summary>More details</summary>
<p>Body</p>
</details>

Sichtbarer Textinhalt benennt das <summary>.

fail
<details>
<summary></summary>
<p>Body</p>
</details>

Kein Textinhalt und kein zugänglicher Name.

So prüfen Sie es

Wenn diese Regel nicht entscheiden kann, meldet sie cantTell und überlässt die Frage einer Person. Jede Frage, die sie stellen kann, steht hier unter ihrem Reason-Code, mit den Schritten, um sie zu beantworten. Ein Befund enthält dieselben Schritte in howToCheck, in der Sprache des Scans. Siehe Ausgabeschema.

name_closedContent

  1. Suchen Sie das im Bericht genannte summary-Element und notieren Sie den Text oder das Symbol, das auf dem Bildschirm angezeigt wird.
  2. Öffnen Sie den Bereich „Barrierefreiheit“ in den Entwicklertools des Browsers und lesen Sie den zugänglichen Namen des Elements, den der Browser aus Inhalt ermittelt, den kein Skript lesen kann.
  3. Navigieren Sie mit einem Screenreader zum Element und hören Sie sich den angesagten Namen an.

Bestanden. Der Barrierefreiheitsbaum zeigt einen Namen für das summary-Element, aus dem Inhalt gewonnen, und der Screenreader sagt ihn an.

Nicht bestanden. Das summary-Element hat keinen Namen im Barrierefreiheitsbaum, da der Inhalt keinen ergibt; das verstößt gegen WCAG 4.1.2.

name_contentTooDeep

  1. Suchen Sie das im Bericht genannte summary-Element und notieren Sie den auf dem Bildschirm angezeigten Text.
  2. Öffnen Sie den Bereich „Barrierefreiheit“ in den Entwicklertools des Browsers und lesen Sie den zugänglichen Namen des Elements, den der Browser aus seinem gesamten verschachtelten Inhalt ermittelt.
  3. Navigieren Sie mit einem Screenreader zum Element und hören Sie sich den angesagten Namen an.

Bestanden. Der Barrierefreiheitsbaum zeigt einen Namen für das summary-Element, aus dem verschachtelten Inhalt gewonnen, und der Screenreader sagt ihn an.

Nicht bestanden. Das summary-Element hat keinen Namen im Barrierefreiheitsbaum, da der Inhalt keinen ergibt; das verstößt gegen WCAG 4.1.2.

Quellcode ansehen