ARIA `progressbar`-Elemente haben zugängliche Namen
Die Bedeutung von ARIA progressbar
-Elementen mit zugänglichen Namen
In unserer heutigen Zeit werden Technologien immer häufiger in Benutzerinterfaces und Anwendungen verwendet. Eine solche Technologie ist ARIA, die dazu bestimmt ist, die Barrierefreiheit von Websites und Anwendungen für Menschen mit Behinderungen zu verbessern.
Eines der Elemente, die mit ARIA verwendet werden können, ist das progressbar
-Element. Dieses Element wird verwendet, um den Fortschritt einer Aufgabe oder eines Prozesses anzuzeigen, z.B. den Download einer Datei oder die Ausführung einer Operation.
Damit dieses Element jedoch wirklich für Menschen mit Behinderungen nützlich ist, muss es einen zugänglichen Namen haben. Ein zugänglicher Name ist eine Beschreibung des Elements, die von Benutzern mit verschiedenen Einschränkungen, einschließlich Seh-, Hör- oder Motorikeinschränkungen, verstanden werden kann.
Ein zugänglicher Name kann mithilfe der Attribute aria-label
oder aria-labelledby
angegeben werden. Das erste Attribut ermöglicht die Angabe einer textuellen Beschreibung des Elements, während das zweite Attribut auf ein anderes Element verweist, das die erforderliche Beschreibung enthält.
Zum Beispiel, wenn wir ein progressbar
-Element haben, das den Fortschritt beim Herunterladen einer Datei anzeigt, könnten wir einen zugänglichen Namen wie folgt angeben:
<div role="progressbar" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100" aria-label="Datei herunterladen: 75% abgeschlossen">
</div>
Oder so:
<div role="progressbar" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100" aria-labelledby="download-label">
</div>
<span id="download-label">Datei herunterladen: 75% abgeschlossen</span>
Beide Beispiele stellen einen zugänglichen Namen für das progressbar
-Element bereit, der von Benutzern mit verschiedenen Einschränkungen verstanden werden kann. Dies ist sehr wichtig, da das progressbar
-Element ohne zugänglichen Namen für einige Benutzer möglicherweise unverständlich ist und seine Funktion nicht erfüllt.
Darüber hinaus ist es wichtig zu beachten, dass nicht nur progressbar
-Elemente zugängliche Namen benötigen, sondern alle anderen Elemente im Interface auch. Dies hilft dabei, die Barrierefreiheit der Website oder Anwendung für alle Benutzer, einschließlich solcher mit Einschränkungen, zu verbessern.
Abschließend möchte ich darauf hinweisen, dass die Verwendung von ARIA-Elementen wie progressbar
mit zugänglichen Namen ein wichtiger Schritt in Richtung Verbesserung der Barrierefreiheit von Websites und Anwendungen für alle Benutzer ist. Dies hilft dabei, das Internet zu einem zugänglicheren Ort für alle zu machen.
Ähnliche Artikel:
Für `<th>`-Elemente und Elemente mit `[role="columnheader"/"rowheader"]` sind Datenzellen vorhanden, die sie beschreiben. ARIA `tooltip`-Elemente haben zugängliche Namen User focus is not accidentally trapped in a region Formularelemente sind mit Labels verknüpft Listenelemente (`<li>`) befinden sich in übergeordneten `<ul>`- oder `<ol>`-Elementen Custom controls have ARIA roles `<html>`-Element hat ein `[lang]`-Attribut Die Elemente mit einer ARIA-`[role]`, deren untergeordnete Elemente eine bestimmte `[role]` enthalten müssen, haben alle erforderlichen untergeordneten Elemente. The user's focus is directed to new content added to the page ARIA-Ein-/Aus-Schaltflächen haben zugängliche Namen