Jokainen kaavio tarvitsee tekstivastineen
Tiivistäkää tärkein havainto sanoina, ei pikseleinä.
Jokainen kaavio tarvitsee tekstivastineen 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.
Kaavio on ruudunlukijalle vain pikseleitä
Ruudunlukijalle kaavio on usein mykkä kuva. Oivallus sisältyy kuvaan, joten sokeat käyttäjät eivät saa siitä tietoa, ellet kirjoita sitä auki tekstinä.
Kuvaile johtopäätös, älä ulkoasua
Kenenkään ei tarvitse kuulla ensimmäiseksi ruudukkolinjoista ja akseleista. Aloita pääasiasta: mitä tämä kaavio todella kertoo lukijalle?
img-kaavion alt-teksti
Jos kaaviosi on kuva, sen alt-määritteen pitäisi ilmaista johtopäätös, ei vain sanoa chart. 📊
<img src="sales.png" alt="Sales rose 40% from Q1 to Q4, peaking in December.">Lyhyt alt, pitkä kuvaus
Lyhyt alt kertoo pääasian. Kun aineisto on monipuolinen, liitä sen yhteyteen pidempi kuvaus koko sisällön avaamiseksi.
Sisäiset SVG-kaaviot on nimettävä
SVG-kaaviot eivät oletusarvoisesti ole kuvia. Lisää role="img" sekä nimi, jotta avustava teknologia käsittelee koko grafiikan yhtenä nimettynä kokonaisuutena.
<svg role="img" aria-label="Revenue doubled over five years."> ... </svg>title SVG:n sisällä
Myös SVG:n ensimmäisenä lapsena oleva title-elementti nimeää sen. Viittaa siihen aria-labelledby-määritteellä, jotta tuki toimii luotettavasti eri ruudunlukijoilla.
<svg role="img" aria-labelledby="t1"><title id="t1">Visitors per month</title></svg>Kerro trendi
Useimpien kaavioiden tarkoitus on näyttää trendi tai vertailu. Kirjoita se selkein sanoin: kasvava, laskeva, tasainen tai yksi palkki selvästi muita korkeampi.
Nimeä äärikohdat
Nimeä korkein ja matalin kohta sekä niiden arvot. Tämä yksi lause välittää usein kuulijalle koko kaavion merkityksen.
Käytä todellisia lukuja
Epämääräiset ilmaukset, kuten paljon, eivät auta ketään. Ilmoita todelliset luvut, jotta kuulija voi päätellä datasta samalla tavalla kuin näkevä lukija.
Näkyvä kuvateksti auttaa kaikkia
Sijoita lyhyt tekstiyhteenveto heti kaavion alle näkyväksi kuvatekstiksi. Myös näkevät käyttäjät silmäilevät sitä, joten vaiva ei mene koskaan hukkaan. ✨
<figure><svg>...</svg><figcaption>Sales climbed steadily all year.</figcaption></figure>Jätä koristeelliset sparkline-kaaviot pois
Pieni koristeellinen sparkline-luvun vieressä ei lisää merkitystä. Piilota se määritteellä aria-hidden, jotta se ei häiritse kuuntelukokemusta.
<span aria-hidden="true"><svg>...spark...</svg></span> 1,204 usersPikatarkistus
Mihin kaavion tekstivastineen pitäisi keskittyä ensisijaisesti?
Kertaus: sanat pikselien sijaan
Opitte, että jokainen kaavio tarvitsee tekstivastineen, joka kertoo oivalluksen, nimeää äärikohdat todellisine lukuineen ja piilottaa puhtaasti koristeelliset grafiikat. 🎯
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 ”Jokainen kaavio tarvitsee tekstivastineen” ilmainen?
Kyllä – oppitunnin ”Jokainen kaavio tarvitsee tekstivastineen” 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 ”Jokainen kaavio tarvitsee tekstivastineen”?
Tiivistäkää tärkein havainto sanoina, ei pikseleinä. 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 ”Jokainen kaavio tarvitsee tekstivastineen”-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
- Jokainen kaavio tarvitsee tekstivastineen
- Tietotaulukko varavaihtoehtona
- Väri, kuvio ja suorat selitteet
- Näppäimistöllä käytettävät vuorovaikutteiset kaaviot