Web Accessibility Academy · Oppitunti

Saavutettavan nimen laskenta selkokielellä

Miten selain päättää, millä nimellä elementtiä kutsutaan.

Oppitunti 1/413 vaihetta

Saavutettavan nimen laskenta selkokielellä on ilmainen Web Accessibility Academy-oppitunti CoddyKitissä. Tämä on oppitunti 1/4. Voit lukea koko oppitunnin alta ilmaiseksi ja harjoitella sen jälkeen käytännössä selaimessa sisäänrakennetulla koodieditorilla ja ympäri vuorokauden käytettävissä olevan tekoälytuutorin avulla. Oppitunti kuuluu Web Accessibility Academy-oppimispolkuun, ja edistymisesi synkronoituu verkon ja CoddyKit-sovelluksen välillä. Web Accessibility Academy-kurssilla on yhteensä 4 oppituntia.

Mikä on saavutettava nimi

Saavutettava nimi on lyhyt selite, jonka ruudunlukija lausuu elementistä, kuten Lähetä-painikkeesta tai Haku-kentästä.

Miksi sillä on merkitystä

Jos elementillä ei ole saavutettavaa nimeä, ruudunlukija ilmoittaa vain sen roolin, esimerkiksi painike, jolloin käyttäjälle ei selviä, mitä se tekee.

Selain laskee sen

Nimeä tarvitsee harvoin määrittää suoraan. Selain suorittaa merkinnällenne nimen laskennan algoritmin päättääkseen, miksi kutakin elementtiä kutsutaan.

Laskenta noudattaa järjestystä

Algoritmi tarkistaa lähteet kiinteässä tärkeysjärjestyksessä ja käyttää ensimmäistä löytämäänsä lähdettä. Kun tunnette järjestyksen, voitte ennustaa tuloksen.

aria-labelledby käsitellään ensin

Korkein tärkeys on aria-labelledby-määritteellä. Jos se on käytössä, se ohittaa kaikki muut lähteet ja kokoaa tekstin viittaamistaan elementeistä.

<button aria-labelledby="t">x</button>
<span id="t">Close menu</span>

aria-label käsitellään seuraavaksi

Jos labelledby-määritettä ei ole, selain käyttää aria-label-määritettä, jonka merkkijono kirjoitetaan suoraan elementtiin sen lausuttavaksi nimeksi.

<button aria-label="Close">x</button>

Sitten natiivi nimeäminen

Seuraavaksi käytetään natiiveja lähteitä, kuten label-elementtiä, joka on yhdistetty input-kenttään, tai kuvan alt-tekstiä. Käyttäkää näitä aina, kun mahdollista.

<label for="email">Email</label>
<input id="email">

Sitten itse sisältö

Monien elementtien nimi muodostetaan lopulta niiden tekstisisällöstä. Save-tekstin sisältävä painike saa nimekseen Save ilman ylimääräisiä määritteitä.

<button>Save</button>

title on viimeinen keino

Alimman tärkeysjärjestyksen lähde on title-määrite. Se nimeää elementin vain, kun mitään parempaa lähdettä ei ole, ja se jää helposti huomaamatta.

Nimet tiivistetään

Laskettu nimi litistetään yhdeksi merkkijonoksi ja ylimääräiset välilyönnit yhdistetään, joten rivinvaihdot ja sisennykset eivät välity käyttäjälle.

Nimi ja kuvaus

Nimi kertoo, miksi elementtiä kutsutaan; kuvaus on sen jälkeen luettava lisätieto. Keskitymme nyt nimen määrittämiseen oikein.

Pikatarkistus

Elementillä on sekä aria-label että sisäinen teksti. Kummasta tulee sen nimi?

Kertaus: miten nimet muodostetaan

Opitte nimen laskennan järjestyksen: labelledby, sitten aria-label, sen jälkeen natiivien lähteiden nimet ja sisältö, ja viimeisenä title. 🧩

Aloita maksutta

Opi HTML tekoälytuutorin avulla — ilmaiseksi

Kirjoita ja suorita oikeaa koodia selaimessa, saa välitöntä apua tekoälytuutorilta ympäri vuorokauden ja jatka siitä, mihin jäit, verkossa tai sovelluksessa.

Kurssit
30
Oppitunnit
120

Usein kysytyt kysymykset

Onko oppitunti ”Saavutettavan nimen laskenta selkokielellä” ilmainen?

Kyllä – oppitunnin ”Saavutettavan nimen laskenta selkokielellä” koko tekstin voi lukea täällä verkossa ilmaiseksi. Jos haluat harjoitella interaktiivisesti sisäänrakennetulla koodieditorilla ja ympäri vuorokauden käytettävissä olevan tekoälytuutorin avulla sekä avata koko Web Accessibility Academy-kurssin, päivitä CoddyKit PROhon. Web Accessibility Academy-kurssilla on yhteensä 4 oppituntia.

Mitä opin oppitunnilla ”Saavutettavan nimen laskenta selkokielellä”?

Miten selain päättää, millä nimellä elementtiä kutsutaan. Harjoittelet Web Accessibility Academy-aihetta koodilla, jonka suoritat suoraan selaimessa. Ympäri vuorokauden käytettävissä oleva tekoälytuutori vastaa kysymyksiisi oppitunnin aikana.

Tarvitsenko kokemusta aloittaakseni Web Accessibility Academy-opiskelun?

Aiempi kokemus ei ole tarpeen. CoddyKitin Web Accessibility Academy-oppimispolku sopii vasta-alkajista edistyneisiin, joten voit aloittaa tästä tai alusta ja edetä omaan tahtiisi. Tämä on oppitunti 1/4.

Kuinka kauan ”Saavutettavan nimen laskenta selkokielellä”-oppitunnin suorittaminen kestää?

Useimmat CoddyKitin oppitunnit kestävät noin 5–10 minuuttia. Jokainen oppitunti on lyhyt ja interaktiivinen, joten edistyt tasaisesti ja voit jatkaa siitä, mihin jäit – sekä verkossa että sovelluksessa.

Voinko kirjoittaa ja suorittaa koodia tällä Web Accessibility Academy-oppitunnilla?

Kyllä. Jokainen Web Accessibility Academy-oppitunti sisältää sisäänrakennetun koodieditorin, joten voit kirjoittaa ja suorittaa oikeaa koodia suoraan selaimessa ja saada välitöntä palautetta tekoälyltä – paikallista asennusta ei tarvita.

Kaikki tämän kurssin oppitunnit

  1. Saavutettavan nimen laskenta selkokielellä
  2. aria-label vai aria-labelledby
  3. aria-describedby lisäkontekstia varten
  4. Yleiset nimeämisvirheet, jotka hiljentävät ohjausobjektit
← Takaisin: Web Accessibility Academy