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:
The page has a logical tab order Das `<html>`-Element hat einen gültigen Wert für sein `[lang]`-Attribut ARIA-Ein-/Aus-Schaltflächen haben zugängliche Namen `[accesskey]`-Werte sind eindeutig Links haben keinen leicht erkennbaren Namen Für `<th>`-Elemente und Elemente mit `[role="columnheader"/"rowheader"]` sind Datenzellen vorhanden, die sie beschreiben. Custom controls have ARIA roles `<dl>`-Elemente enthalten ausschließlich Gruppen aus `<dt>`- und `<dd>`-Elementen sowie `<script>`-, `<template>`- oder `<div>`-Elemente, die richtig angeordnet sind. Listen enthalten nur `<li>`-Elemente und Elemente zur Skriptunterstützung (`<script>` sowie `<template>`). Interactive elements indicate their purpose and state