Aksesueshmëri
Teksti alternativ i imazheve (alt)
Atributi alt përshkruan imazhin për ata që nuk e shohin; mjeti numëron imazhet pa të, por e trajton alt bosh si gabim.
Çfarë është
Atributi alt i jep imazhit një ekuivalent tekstual. Ai lexohet nga lexuesit e ekranit, shfaqet kur imazhi nuk ngarkohet dhe përdoret nga motorët për të kuptuar përmbajtjen e figurës.
Ka dy raste të ndryshme dhe të dyja janë të sakta. Një imazh që mbart informacion merr një përshkrim: alt="Grafik: shitjet u rritën 40% nga janari në qershor". Një imazh dekorativ — një vijë ndarëse, një formë sfondi — merr alt="", bosh dhe i shkruar me qëllim. Ajo zbrazëti i thotë lexuesit të ekranit ta kapërcejë imazhin në heshtje.
Gabimi nuk është alt="". Gabimi është mungesa e alt-it fare, sepse atëherë lexuesi i ekranit nuk di ç'të bëjë dhe shpesh lexon emrin e skedarit.
Pse ka rëndësi
Për një përdorues të verbër, një imazh pa alt shfaqet si "image" ose si IMG_20240311_0032.jpg lexuar shkronjë për shkronjë. Kur ai imazh është një buton, faqja bëhet e papërdorshme.
Në shqip kjo prek veçanërisht faqet e dyqaneve, ku fotoja e produktit është vetë informacioni. Pa alt, lista e produkteve është një listë e zbrazët.
Ka edhe fitim për kërkimin: kërkimi me imazhe mbështetet fort te alt-i, dhe për shumë tema — receta, produkte, vende — ai kanal sjell trafik real.
Dhe ka një pasojë praktike që prek këdo: kur imazhi nuk ngarkohet, alt-i është e vetmja gjë që mbetet.
Si rregullohet
<!-- imazh që mbart informacion -->
<img src="/grafiku.png" alt="Shitjet u rritën nga 120 në 168 njësi midis janarit dhe qershorit">
<!-- imazh dekorativ — alt bosh, me qëllim -->
<img src="/vija.svg" alt="">
<!-- imazh si lidhje: alt përshkruan destinacionin, jo figurën -->
<a href="/kontakt"><img src="/zarf.svg" alt="Na shkruani"></a>Hapat:
- Përshkruaj funksionin, jo pamjen. Për një ikonë butoni,
altështë veprimi. - Mos shkruaj "foto e" ose "imazh i". Lexuesi i ekranit e njofton vetë se është imazh.
- Për imazhe dekorative përdor `alt=""`, jo mungesë atributi dhe jo
alt=" ". - Mos e mbush me fjalë kyçe. Kjo e dëmton përdoruesin dhe njihet lehtë si manipulim.
- Imazhet me tekst brenda duhet ta përsërisin atë tekst te
alt.
Si e mat ky mjet
Dy analizues e kontrollojnë veçmas. ContentAnalyzer::analyzeImages() (services/ContentAnalyzer.php:252) numëron //img pa atribut alt ose me alt bosh dhe raporton sa nga sa (:293). AccessibilityAnalyzer::checkImagesAlt() (services/AccessibilityAnalyzer.php:35) bën të njëjtën gjë, por e pranon alt-in bosh vetëm nëse imazhi ka edhe role="presentation" ose role="none" (:49).
Çfarë NUK e mat
Të dy analizuesit e numërojnë `alt=""` si gabim, ndonëse ai është deklarimi standard i një imazhi dekorativ dhe është i saktë. Matur mbi një faqe me pesë imazhe (alt="", pa alt, alt=" ", alt i mirë, pa alt), mjeti raportoi 4 imazhe pa alt kur gabime të vërteta ishin 3. Detajet te MASTER_PLAN/audits/61-ANALIZUESIT-INVENTAR.md §4.5.
Pra numri që jep raporti është tavan, jo vlerë e saktë — imazhet vërtet problematike janë po aq ose më pak.
Mjeti as nuk e vlerëson dot cilësinë e tekstit: alt="imazh" ose alt="laptop laptop laptop" kalojnë si të rregullta. Nuk sheh imazhe sfondi nga CSS-ja, as <svg> pa <title>, as <input type="image">. Fusha file_size e çdo imazhi kthehet gjithnjë 0 (services/ContentAnalyzer.php:283) — mjeti nuk i shkarkon imazhet.
Mospërputhje midis tekstit të analizuesit dhe matjes
| Teksti i analizuesit | Çfarë ndodh | Si u mat | Burimi |
|---|---|---|---|
| Images missing alt text — N image(s) lack alt attributes | alt bosh është deklarimi standard i një imazhi dekorativ dhe është i saktë; kodi e pranon vetëm me role=presentation. | Mbi 04-alt-bosh-kundrejt-alt-mungon.html u raportuan 4 imazhe pa alt kur gabime të vërteta ishin 3. — MASTER_PLAN/audits/61-ANALIZUESIT-INVENTAR.md §4.5 | services/AccessibilityAnalyzer.php:46 |
Kodi që e kryen matjen
services/ContentAnalyzer.php:252— ContentAnalyzer::analyzeImagesservices/AccessibilityAnalyzer.php:35— AccessibilityAnalyzer::checkImagesAltservices/AccessibilityAnalyzer.php:46— hasAttribute