Title-attribuutin käyttö tunnisteena

Silktide tarkistaa sivujesi painikkeet ja linkit sellaisten säätimien varalta, jotka käyttävät title-attribuuttia toimintonsa selittämiseen. Selaimet näyttävät title-attribuutin vain viiveellä avautuvana työkaluvihjeenä, kun hiiren osoitin viedään elementin päälle, joten useimmat ihmiset eivät koskaan näe sitä.

<!-- Ongelma: työkaluvihje on ainoa tunniste -->
<button title="Sulje"><svg>…</svg></button>

<!-- Korjaus: anna säätimelle oikea saavutettava nimi -->
<button aria-label="Sulje"><svg>…</svg></button>

Miksi tämä on tärkeää

title-työkaluvihje näkyy vain hiirtä käyttäville käyttäjille ja vasta viiveen jälkeen. Näppäimistön käyttäjät, kosketusnäyttöjen ja mobiililaitteiden käyttäjät sekä useimmat käyttäjät eivät koskaan saa sitä, joten pelkästään title-attribuutilla tunnistettu säädin on suurelle osalle kävijöistäsi arvoituksellinen painike. Ruudunlukijat käsittelevät myös title-attribuuttia epäjohdonmukaisesti – jotkut lukevat sen, jotkut jättävät sen huomiotta – mikä tekee siitä epäluotettavan myös niille käyttäjille, joita sen oletetaan palvelevan.

Kun säätimellä on sekä title että siitä poikkeava , ongelmana on johdonmukaisuus: hiirtä käyttävä käyttäjä näkee hetkellisesti yhden kuvauksen, kun taas avustavaa teknologiaa käyttävä kuulee toisen. Kuvaukset erkanevat toisistaan entisestään sivua ylläpidettäessä.

Näin korjaat ongelman

Anna säätimelle asianmukainen tunniste: näkyvä teksti aina kun mahdollista tai vain kuvaketta sisältäville säätimille aria-label (tai olemassa olevaan tekstiin viittaava aria-labelledby).
Jos säätimellä on sekä title että aria-label, jotka ovat ristiriidassa keskenään, valitse hyödyllisempi muotoilu ja käytä sitä kaikkialla. Yleensä selkein korjaus on poistaa title ja antaa aria-label-attribuutin sisältää kuvaus.
Säilytä title vain aidosti täydentäviä tietoja varten. Se ei saa koskaan olla ainoa tapa selvittää, mitä säädin tekee.

Näin Silktide testaa tämän

Etsi jokaiselta sivulta näkyvät painikkeet, linkit ja avattavat säätimet, mukaan lukien elementit, joiden role="button" tai role="link".
Tarkista jokaiselta säätimeltä, jolla on merkityksellinen title-attribuutti, onko sillä jokin muu tunniste: näkyvä teksti, kuvan , aria-label tai aria-labelledby.
Raportoi säätimet, joiden ainoa tunniste on title-attribuutti.
Jos säätimellä on sekä title että eksplisiittinen aria-label tai aria-labelledby, vertaa näitä kahta ja raportoi ne, kun ne tarkoittavat olennaisesti eri asioita. Jos toinen vain laajentaa toista (title on "Hae" ja nimi on "Hae nyt"), sitä ei raportoida.

Tämä tarkistus ei testaa lomakekenttiä, kuten <input> ja <select>; niiden tunnisteet käsitellään kohdassa lomakesäätimien tunnisteet.

Vianmääritys

Title-attribuutti vaaditaan iframe-elementeissä

Oikein – <iframe>-elementin title on vakiotapa nimetä se, eikä tämä tarkistus testaa iframe-elementtejä. Se testaa vain vuorovaikutteisia säätimiä, kuten painikkeita ja linkkejä.

Työkaluvihjeeni lisää hyödyllisiä lisätietoja

Tämä on hyväksyttävä käyttötapa, kunhan säätimellä on myös oikea tunniste. Tämä tarkistus raportoi vain säätimet, joissa title on ainoa tunniste tai joissa se on ristiriidassa saavutettavan nimen kanssa.