Siirry sisältöön
SilktideOhje

Puuttuva pakollinen ARIA-attribuutti

Silktide tarkistaa elementit, joille on määritetty ARIA-rooli, ja varmistaa, että niillä on myös roolin edellyttämät attribuutit. Jotkin roolit ovat käyttökelvottomia ilman attribuuttejaan, kuten liukusäädin, joka ei koskaan ilmoita, mihin arvoon se on asetettu.

<!-- Ongelma: liukusäätimen on ilmoitettava nykyinen arvonsa -->
<div role="slider" tabindex="0"></div>

<!-- Korjaus: määritä pakollinen tila -->
<div role="slider" tabindex="0"
     aria-valuemin="0" aria-valuemax="100" aria-valuenow="50"></div>

Miksi tämä on tärkeää

Elementille annetulla -roolilla annetaan lupaus: "tämä on liukusäädin", "tämä on valintaruutu". Tällaiset roolit edellyttävät tila-attribuutteja, koska ilman niitä lupaus on tyhjä – käyttäjä siirtyy valintaruutuun eikä voi tietää, onko se valittu, tai liukusäätimeen eikä voi tietää sen arvoa tai aluetta. Ohjaus ilmoitetaan, siihen voi kohdistaa kohdistuksen, mutta sitä on mahdotonta käyttää.

Näin korjaat sen

  1. Lisää roolin edellyttämät attribuutit ja pidä ne ajan tasalla komentosarjalla, kun ohjauksen tila muuttuu – toimivassa valintaruudussa oleva staattinen aria-checked="false" on yhtä harhaanjohtava kuin attribuutin puuttuminen kokonaan.
  2. Käytä ensisijaisesti natiiveja -elementtejä silloin, kun niitä on saatavilla: <input type="checkbox"> ja <input type="range"> ilmoittavat tilansa automaattisesti ilman ylläpidettävää ARIAa.

Näin Silktide testaa tämän

  1. Etsi jokainen sivun elementti, jolle on määritetty role-attribuutti.
  2. Selvitä attribuutit, joita ARIA 1.2 edellyttää kyseiseltä roolilta – esimerkiksi role="checkbox" edellyttää aria-checked-attribuuttia ja role="slider" aria-valuenow-attribuuttia. Kun role-attribuutissa luetellaan useita rooleja, elementin rooli on ensimmäinen ARIA 1.2:ssa määritetty rooli, kuten selaimissakin.
  3. Ohita tapaukset, joissa elementti ilmoittaa tilansa natiivisti: oikea valintaruutu tai valintanappi sisältää jo valitun tilansa, natiivi <option> valitun tilansa, natiivi <input type="range"> tai <meter> arvonsa, ja liukusäädin, jolla on aria-valuetext, voi jättää aria-valuenow-attribuutin pois.
  4. Vaadi aria-valuenow-attribuutti role="separator"-elementiltä vain silloin, kun siihen voi kohdistaa kohdistuksen näppäimistöllä, kuten kahden paneelin väliseen vedettävään jakajaan voi. Vain sisältöä jakava erotin ei tarvitse attribuutteja.
  5. Ilmoita jokainen elementti, jolta puuttuu pakollinen attribuutti. Tyhjäksi jätetty attribuutti, kuten aria-checked="", katsotaan puuttuvaksi, koska selaimet jättävät tyhjän arvon huomiotta.

Vianmääritys

Komentosarja asettaa attribuutin sivun latauduttua

Silktide testaa sivun sen latautuessa. Jos pienoisohjelmasi lisää tila-attribuutit vasta ensimmäisen vuorovaikutuksen yhteydessä, käyttäjät kuulevat siihen asti tilattoman ohjauksen – hahmonna sen sijaan alkutila sivulle.

Lue lisää

Viimeksi päivitetty

Oliko tästä sivusta apua?