Jede Technik, bei der eine Gruppierung von Nicht-Text-Inhalten benutzt wird, um Informationen oder Funktionalitäten zu präsentieren.
Die Technik bezieht sich auf:
Das Ziel dieser Technik ist es, eine unnötige Duplizierung zu vermeiden, die auftritt, wenn eine Gruppierung von nebeneinander liegenden Nicht-Text-Inhalten dazu benutzt wird, Informationen oder Funktionalitäten zu präsentieren.
In manchen Fällen bieten Seiten eine Gruppe von Bildern an, um Informationen zu vermitteln. Wenn diese Gruppierungen zusammen oder in einer bestimmten Kombination präsentiert werden, können Sie unterschiedliche Arten von Informationen vermitteln. Zum Beispiel: zwei Bilder eines Sterns, einer in schwarz-weiß und der andere farbig dargestellt, können in Kombination dazu benutzt werden, eine Benutzer-Bewertung darzustellen. Zum Beispiel können drei ausgefüllte Sterne gefolgt von zwei nicht ausgefüllten Sternen für eine Bewertung von drei von fünf Sternen stehen.
Um diese Technik zu benutzen stellt ein Autor eine Textalternative bereit, die dem identischen Zweck der gesamten Gruppe dient und verbindet dies mit einem Element der Gruppe. Die anderen Elemente in der Gruppe werden dann auf eine Art markiert, die von assistierenden Techniken ignoriert werden kann. Auf diese Weise ist der Benutzer in der Lage, den Zweck der Gruppe effektiver zu identifizieren und kann eine Duplizierung oder Verwirrung vermeiden, die sich hätte ergeben können, wenn für jedes Element der Gruppe eine Textalternative bereitgestellt worden wäre.
Im folgenden Beispiel wird eine Bewertung als drei gefüllte und zwei leere Sterne gezeigt. Während eine Textalternative für jedes der fünf Bilder hätte bereitgestellt werden können, hat der Autor stattdessen die Bewertung in Form von „3 von 5 Sternen“ für das erste Bild bereitgestellt und die anderen markiert, indem er keinen alt-Text benutzt hat.
Code-Beispiel:
<p>Rating:
<img src="star1" alt="3 out of 5 stars">
<img src="star1" alt="">
<img src="star1" alt="">
<img src="star2" alt="">
<img src="star2" alt="">
</p>In diesem Beispiel hat jede Schaltfläche einen Satz an Bildern, um auf die erklärte WCAG-Konformitätsstufe hinzuweisen. Diese Vorgehensweise macht es assistierenden Techniken möglich zu vermeiden, Dinge wie „Bild A, Bild A, Bild A“ usw. ankündigen zu müssen.
Code-Beispiel:
<p>Conformance Level:</p>
<button name="A"><img src="a.png" alt="A" /></button> <br />
<button name="AA"><img src="a.png" alt="AA" /><img src="a.png" alt="" /></button> <br />
<button name="AAA"><img src="a.png" alt="AAA" /><img src="a.png" alt="" /><img src="a.png" alt="" /></button>Prüfen Sie, ob ein Element der Gruppe eine Textalternative enthält, die dem identischen Zweck für die gesamte Gruppe dient.
Prüfen Sie, ob die anderen Elemente der Gruppe auf eine Art markiert sind, die von assistierenden Techniken ignoriert werden kann.
Prüfen Sie, ob die Elemente, die auf eine Art markiert sind, die von assistierenden Techniken ignoriert werden kann, neben dem Element sind, das die Textalternative für die Gruppe enthält.
Alle oben genannten Tests sind wahr.
Wenn dies eine ausreichende Technik für ein Erfolgskriterium ist, dann bedeutet das Scheitern an diesem Testverfahren nicht zwangsläufig, dass das Erfolgskriterium nicht auf irgendeine andere Art und Weise erfüllt wurde, sondern nur, diese Technik nicht erfolgreich implementiert wurde und nicht benutzt werden kann, um die Konformität zu erklären.