@@ebody
So funktioniert es
Nein, das tut es nicht. Von „funktionieren“ würde ich da nicht sprechen. Bei Tastaturnavigation kommt man nicht per Tab-Taste von einem Auswahl-Button(?) zum nächsten wie man das erwarten würde. Es geht mit Pfeiltaste, aber woher soll man das wissen?
Auch die Ansagen des Screenreaders erscheinen mir wirr. Kein Wunder bei <div … role="grid">
, <div … role="row">
und <span role="gridcell">
. Was soll der Quatsch?
Ich würde den 5 Regeln zur Verwendung von ARIA noch eine nullte voranstellen: Verwende nicht ARIA, wenn du davon keine blasse Ahnung hast!
<span role="checkbox" tabindex="0" aria-checked="false" …>
verstößt gegen die erste Regel: Verwende nicht ARIA, wenn es passende HTML-Elemente dafür gibt. Also warum ist das keine Checkbox mit Label? Die kann man ja auch anders stylen; das hatten wir letztens erst (ob Radiobutton oder Checkbox macht da keinen entscheiden Unterschied – außer rund und eckig).
Aber sind das bei dir überhaup Checkboxen, also Eingabelemente, wobei deren Werte gesammelt beim Abschicken des Formulars ausgewertet werden?
Oder sind es Aktionslemente, wo schon die Interaktion damit sofort etwas bewirkt? In dem Fall sollten es wohl Buttons sein: Toggle-Buttons.
Was ist dein Anwendungsfall?
😷 LLAP
“When I was 5 years old, my mother always told me that happiness was the key to life. When I went to school, they asked me what I wanted to be when I grew up. I wrote down ‘happy.’ They told me I didn’t understand the assignment, and I told them they didn’t understand life.” —John Lennon