Siirry sisältöön
SilktideOhje

Esitysrooli vuorovaikutteisessa elementissä

Silktide tarkistaa vuorovaikutteiset elementit, kuten painikkeet, linkit ja lomakekentät, jotka on merkitty pelkästään koristeellisiksi. Vuorovaikutteisen elementin merkitseminen tällä tavalla poistaa sen merkityksen avustavalta teknologialta, vaikka elementti pysyy näytöllä napsautettavana.

<!-- Ongelma: painike toimii edelleen, mutta ei ilmoita mitään -->
<button role="presentation">Poista</button>

<!-- Korjaus: poista rooli -->
<button>Poista</button>

Miksi tämä on tärkeää

-roolit presentation ja none kertovat , että elementillä ei ole merkitystä – ne on tarkoitettu semantiikan poistamiseen esimerkiksi taittotaulukoista. Vuorovaikutteisessa elementissä käytettyinä ne luovat pahimmanlaisen esteen: ohjausobjektin, jota näkevät hiiren käyttäjät napsauttavat päivittäin, mutta jonka esittää toimimattomana sisältönä tai ohittaa kokonaan. Käyttäjä ei voi tietää, että painike on edes olemassa.

Näin korjaat sen

  1. Poista vuorovaikutteisesta elementistä role="presentation" tai role="none". Natiivielementit välittävät jo oikean merkityksen ilman roolia.
  2. Jos elementin ei oikeasti pitäisi olla vuorovaikutteinen, tee siitä sellainen: korvaa se vuorovaikutuksettomalla elementillä, kuten <div>, ja poista kaikki tabindex-määritteet.
  3. Jos yritit poistaa kääre-elementin merkityksen (esimerkiksi ohjausobjektien ympärillä olevasta taittotaulukosta), aseta rooli kääre-elementtiin, älä sen sisällä oleviin ohjausobjekteihin.

Näin Silktide testaa tämän

  1. Etsi sivulta kaikki elementit, joilla on role="presentation" tai role="none".
  2. Selvitä, onko elementti vuorovaikutteinen: painike, linkki tai kuvakartan alue, jolla on href, lomakekenttä tai mikä tahansa elementti, joka on sijoitettu näppäimistön sarkainjärjestykseen, kun sen tabindex on vähintään 0.
  3. Raportoi jokainen vuorovaikutteinen elementti, jolla on esitysrooli.

Elementtejä, jotka on poistettu sarkainjärjestyksestä negatiivisella tabindex-arvolla, ei raportoida. Myöskään koristeellisia elementtejä, kuten kuvia tai SVG-grafiikkaa, ei raportoida.

Vianmääritys

Kehys tai kirjasto lisäsi roolin

Jotkin käyttöliittymäkirjastot käyttävät sisäisissä kääre-elementeissään role="presentation" -roolia, ja toisinaan rooli lisätään väärään elementtiin. Tarkista raportoitu elementti: jos sitä voi käyttää hiirellä, mutta se on hiljennetty avustavalta teknologialta, korjaus kuuluu kirjaston käyttötapaasi tai kirjaston ylläpitäjälle.

Lue lisää

Viimeksi päivitetty

Oliko tästä sivusta apua?