ARIA: aria-current Attribut

Ein nicht-null aria-current Zustand auf einem Element zeigt an, dass dieses Element das aktuelle Element innerhalb eines Containers oder einer Gruppe verwandter Elemente darstellt.

Beschreibung

Wenn Sie eine Gruppe verwandter Elemente haben, wie zum Beispiel mehrere Links in einem "Breadcrumb" oder Schritte in einem mehrstufigen Ablauf, bei denen ein Element in der Gruppe anders als die anderen gestaltet ist, um dem sehenden Benutzer anzuzeigen, dass dies das aktuelle Element in seiner Gruppe ist, sollte aria-current verwendet werden, um dem Nutzer von unterstützender Technologie mitzuteilen, was durch das Styling angezeigt wurde.

In einer Breadcrumb-Liste, wenn ein Link innerhalb einer Gruppe von Paginierungs-Links so gestaltet ist, dass angezeigt wird, dass der Benutzer sich aktuell auf dieser Seite befindet, sollte aria-current="page" auf diesem Link gesetzt werden. In einem mehrstufigen Prozess mit einem Schritt-Indikator wie einem mehrseitigen Fragebogen oder einem mehrstufigen Checkout- oder Registrierungsprozess, wenn das aktuelle Schritt-Symbol visuell anders ist, um zu zeigen, dass es der aktuelle Schritt ist, sollte der Container dieses Symbols aria-current="step" für Benutzer von unterstützender Technologie haben, die möglicherweise den visuellen Unterschied nicht "sehen" können.

Das aria-current Attribut zeigt an, dass das Element, auf dem es gesetzt ist, auf einen Wert ungleich false, das aktuelle Element innerhalb eines Containers oder einer Gruppe verwandter Elemente darstellt. Markieren Sie nur ein Element in einer Gruppe von Elementen als aktuell mit aria-current.

Das aria-current Attribut akzeptiert eine begrenzte Liste von Werten wie page, step, location, date, time, true und false. Jeder nicht-null Zeichenkettenwert, der nicht in dieser Liste von enumerierten Werten enthalten ist, wird behandelt, als wäre aria-current="true" gesetzt, nicht der Standardwert false. Wenn das Attribut nicht vorhanden ist, ein leerer String ist, ohne Wert vorhanden ist oder auf aria-current="false" gesetzt ist, wird es dem Benutzer nicht angezeigt.

Wenn etwas ausgewählt statt aktuell ist, wie ein tab in einer tablist, verwenden Sie aria-selected, um das aktuell angezeigte tabpanel anzuzeigen.

Hinweis: Verwenden Sie aria-current nicht als Ersatz für aria-selected in gridcell, option, row oder tab.

Beispiel

Das Breadcrumb für die "aktuelle Seite" sollte aria-current="page" darauf gesetzt haben.

html

<nav aria-label="Breadcrumb" class="breadcrumb">
  <ol>
    <li>
      <a href="../../../../../">Web technology for developers</a>
    </li>
    <li>
      <a href="../../../../">Accessibility</a>
    </li>
    <li>
      <a href="../../../">ARIA</a>
    </li>
    <li>
      <a href="../../">ARIA States and Properties</a>
    </li>
    <li>
      <a href="./" aria-current="page">ARIA: `aria-current` attribute</a>
    </li>
  </ol>
</nav>

Wenn das Element, das die aktuelle Seite im Breadcrumb darstellt, kein Link war, ist aria-current optional.

Werte

page: Repräsentiert die aktuelle Seite innerhalb eines Satzes von Seiten, wie den Link zum aktuellen Dokument in einem Breadcrumb.
step: Repräsentiert den aktuellen Schritt innerhalb eines Prozesses, wie den aktuellen Schritt in einem enumerierten mehrstufigen Checkout-Ablauf.
location: Repräsentiert den aktuellen Standort innerhalb einer Umgebung oder eines Kontexts, wie das Bild, das visuell hervorgehoben als aktuelles Element eines Flussdiagramms ist.
date: Repräsentiert das aktuelle Datum innerhalb einer Sammlung von Daten, wie das aktuelle Datum in einem Kalender.
time: Repräsentiert die aktuelle Uhrzeit innerhalb eines Satzes von Zeiten, wie die aktuelle Zeit innerhalb eines Zeitplans.
true: Repräsentiert das aktuelle Element innerhalb eines Satzes.
false (Standard): Repräsentiert nicht das aktuelle Element innerhalb eines Satzes.

Zugehörige Schnittstellen

Element.ariaCurrent: Die ariaCurrent Eigenschaft, Teil der Element Schnittstelle, spiegelt den Wert des aria-current Attributs wider.
ElementInternals.ariaCurrent: Die ariaCurrent Eigenschaft der ElementInternals Schnittstelle spiegelt den Wert des aria-current Attributs wider.

Zugehörige Rollen

Anwendbar in allen Rollen; außer für Elemente mit der Rolle gridcell, option, row und tab, wo aria-selected verwendet werden sollte.

Spezifikationen

Specification
Accessible Rich Internet Applications (WAI-ARIA) # aria-current

Siehe auch

Help improve MDN

Learn how to contribute Diese Seite wurde automatisch aus dem Englischen übersetzt.

Übersetzung auf GitHub anzeigen • Fehler mit dieser Übersetzung melden