A11ying with Sanna - Toki, jos voisin opas saavutettavuuteen

4.1.2 Nimi, rooli, arvo

Tässä esimerkissä on myös <optgroup> elementti, joka mainitaan kriteerissä 1.3.1. Käy tämä sivu läpi esimerkiksi HTML_CodeSniffer-työkalulla nähdäksesi varoitukset ja virheet näistä <select> elementeistä.

Vertaa näitä elementtejä myös ruudunlukijalla. Nimitiedolla on suuri merkitys.

Haasteellinen esimerkki

Parempi esimerkki

Loppukommentit

4.1.2 virhe puuttuvasta nimestä on korjattavissa lisäämällä komponentille nimitieto. Tämä voidaan lisätä näkyvällä <label> elementillä, otsikolla tai aria-attribuuteilla aria-label tai aria-labelledby. Helpoin tämä on korjata kaikille käyttäjille selkeäksi lisäämällä näkyvä nimitieto.

4.1.2 varoitus <select> elementin puuttuvasta saavutettavasta arvosta on korjattavissa laittamalla ensimmäinen valikko oletuksena valituksi.

1.3.1 varoitus toisiinsa liittyvien valintavaihtoehtojen listasta on poistettavissa käyttämällä <optgroup> elementtiä. Monessa tapauksessa tätä ei ole tarpeen käyttää, vaan tämän varoituksen tulkinta vaatii aina arvion. Mikäli olen oikein ymmärtänyt, tämä varoitus tulee aina, kun työkalu havaitsee <select> elementin.