Cum să vă testați site-ul pentru accesibilitate

Peste 1 miliard de oameni din lume și 1 din 4 adulți din SUA au un handicap. Site-urile web care nu sunt dezvoltate pentru a fi accesibile reprezintă o provocare pentru persoanele cu dizabilități în navigare și utilizare, iar site-urile web inaccesibile își expun proprietarii riscului de a primi o plângere sau un proces de accesibilitate. Este din ce în ce mai important pentru dezvoltatorii din SUA, Canada și UE să se asigure că site-urile web pe care le construiesc sunt accesibile. Nu sunteți sigur ce este accesibilitatea site-urilor web și cum să vă asigurați că site-urile web pe care le creați sunt accesibile? Ești în locul potrivit. Acest tutorial acoperă elementele fundamentale pentru înțelegerea accesibilității web ca dezvoltator și cum să vă testați site-ul pentru probleme de accesibilitate.

Ce este mai exact accesibilitatea web? Accesibilitatea web se referă la capacitatea de utilizare a unui site web pentru persoane cu o varietate de limitări permanente sau situaționale. Exemple de dizabilități care pot afecta capacitatea oamenilor de a utiliza un site web fără considerații specifice de codare includ orbirea, deficiențe de auz, deficiențe motorii care limitează capacitatea de a folosi un mouse sau tastatură și dizabilități cognitive. Un site web accesibil este unul pe care utilizatorii cu toate abilitățile, inclusiv utilizatorii de tehnologie de asistență, îl pot accesa, interacționa și naviga cu ușurință. Din 2008, au existat standarde convenite la nivel internațional pe care designerii și dezvoltatorii le pot urma pentru a se asigura că site-urile lor sunt accesibile. Aceste standarde sunt numite Ghid de accesibilitate a conținutului web (WCAG).

Caracteristici cheie ale site-urilor web accesibile Ghidurile privind accesibilitatea conținutului web constau în „criterii de succes” care pot fi utilizate pentru a măsura nivelul de accesibilitate al unui site web. Criteriile au fost create pentru a se asigura că site-urile web sunt:

• Perceptibil : informațiile și elementele de pe site pot fi percepute de utilizatori, indiferent de modul în care le experimentează. De exemplu, utilizatorii nevăzători pot cere cititorilor de ecran să citească textul site-ului web pe care nu îl pot vedea, iar utilizatorii d/Deaf pot citi o transcriere sau subtitrări dacă este prezent un videoclip pe care nu îl pot auzi.
• Operabil : Toți oamenii de pe toate dispozitivele pot folosi toate componentele interfeței cu utilizatorul, elementele interactive și navigarea site-ului. Site-ul web trebuie să fie complet funcțional pentru persoanele care nu folosesc o tastatură și un mouse tradițional pentru a naviga pe web.
• De înțeles : conținutul și funcționalitatea site-ului trebuie să fie de înțeles. Acest lucru se aplică în egală măsură elementelor precum nivelul de citire al paginii și conținutul real al textului de pe site, precum și funcționalității site-ului.
• Robust: modul în care este construit site-ul web, atât prin introducerea codului, cât și a conținutului, trebuie să poată fi accesat și interpretat de o varietate de dispozitive și tehnologii de asistență.

Cea mai bună modalitate de a vă asigura că site-urile web pe care le dezvoltați sunt accesibile persoanelor de toate abilitățile este să efectuați testarea manuală a accesibilității împreună cu o scanare automată AI.

Cum să alegeți un instrument de scanare automată a accesibilității Scanerele automate de accesibilitate sunt un prim pas bun pentru a identifica dacă pe un site web există erori de accesibilitate și dacă acesta nu îndeplinește standardele de accesibilitate web. Instrumentele automate de verificare a accesibilității folosesc liniile directoare menționate mai sus pentru a semnala erorile de accesibilitate care pot fi identificate programatic, examinând codul site-ului web. Atunci când alegeți un instrument automat, este esențial să luați în considerare următoarele:

• Câte pagini și postări am pe site-ul meu? Va putea acest instrument să se ocupe de scanarea tuturor?
• Doresc un instrument separat de site-ul meu web sau un instrument pe care îl pot folosi fără a părăsi site-ul meu?
• Va trebui să folosesc acest instrument pe mai multe site-uri web? Dacă da, pot folosi acest instrument pe mai multe site-uri simultan?
• Ce se întâmplă dacă am nevoie de ajutor cu erorile de accesibilitate pe care acest instrument le semnalează pe site-ul meu? Dezvoltatorul de instrumente oferă suport suplimentar?

Având în vedere răspunsurile la aceste întrebări, puteți găsi un instrument automat de accesibilitate care vă va funcționa cel mai bine. Mai jos sunt câteva exemple de instrumente utilizate în mod obișnuit pentru a scana site-urile web pentru erori sau probleme de accesibilitate.

VAL WAVE este un serviciu gratuit dezvoltat de WebAIM, o organizație dedicată practicilor de accesibilitate web. WAVE evaluează conținutul web și semnalează accesibilitatea și erorile WCAG. WAVE este perfect pentru site-urile web mai mici care pot scana paginile una câte una. Pentru a utiliza acest instrument, vizitați pagina de evaluare a accesibilității WAVE, introduceți adresa URL a paginii pe care doriți să o scanați și WAVE vă va oferi o listă cu toate erorile de accesibilitate găsite pe pagină. WAVE oferă, de asemenea, detalii despre erori și despre cum le puteți remedia. Dacă doriți să scanați mai multe pagini simultan, WAVE are o API la care dezvoltatorii se pot conecta pentru a scana în bloc mai multe pagini web sau site-uri web întregi. Creditele API încep de la 0,025 USD fiecare. În funcție de cât de multe informații doriți să primiți despre pagină, fiecare scanare poate utiliza 1-4 credite. Dacă dezvoltați un site web cu un buget mare pentru monitorizarea în curs de desfășurare a accesibilității site-ului sau dacă sunteți de acord să faceți scanări unice pe o singură pagină, WAVE ar putea fi o opțiune bună pentru nevoile dvs.

topor axe este un instrument de scanare a accesibilității de la Deque. axe oferă o extensie Google Chrome gratuită, precum și trei opțiuni plătite pentru scanarea accesibilității: axe DevTools, axe Auditor și axe Monitor. DevTools ajută dezvoltatorii web să obțină accesibilitate prin testare ghidată. Auditorul realizează audituri automate WCAG asupra conținutului și aplicațiilor web. Monitor scanează site-urile web și raportează erorile de accesibilitate. axe este un instrument excelent pentru dezvoltatorii web și creatorii de conținut care au nevoie de rapoarte separate de accesibilitate. Extensia gratuită axe Chrome este disponibilă pentru descărcare instantanee și, la fel ca WAVE, este un instrument excelent pentru scanarea pe o singură pagină, declanșată manual.

Verificator de accesibilitate Accesibility Checker este un plugin WordPress de scanare automată a accesibilității de la Equalize Digital. Oferit atât în ​​versiune gratuită, cât și în versiunea pro, Accessibility Checker poate scana în bloc paginile și postările pentru erori de accesibilitate și oferă rapoarte chiar în editorul WordPress. Pluginul scanează conținutul web pentru conformitatea cu WCAG 2.1 și ajută atât dezvoltatorii, cât și managerii de conținut să testeze site-urile web pentru probleme de accesibilitate în mod continuu. Verificatorul de accesibilitate poate fi folosit de utilizatorii WordPress de toate nivelurile de calificare, indiferent dacă aveți nevoie de el pentru un site sau mai multe. Pluginul gratuit Accesibility Checker poate fi descărcat de pe WordPress.org, iar pluginul Accessibility Checker Pro poate fi achiziționat de la Equalize Digital. Cu Verificatorul de accesibilitate nu există limite pentru numărul de pagini scanate (sau taxele API asociate), iar rapoartele sunt vizibile chiar pe ecranul de editare post.

Acest lucru le permite managerilor de conținut – care pot fi mai puțin familiarizați cu accesibilitatea – să vadă dacă conținutul pe care îl adaugă sau îl editează este accesibil după ce le predați site-ul. Versiunea Pro a Verificatorului de accesibilitate include liste centralizate de probleme deschise și scanare în bloc, într-un program, economisind timp la rularea scanărilor pe o singură pagină una câte una. Cum să utilizați o scanare AI pentru a vă face site-ul accesibil Odată ce ați selectat instrumentul automat de testare a accesibilității, testarea site-ului dvs. este la fel de ușor ca declanșarea unei scanări și revizuirea rapoartelor. Cu Verificatorul de accesibilitate, de exemplu, puteți vedea o listă a oricăror erori sau avertismente identificate într-o scanare pe ecranul de editare pentru pagina sau postarea respectivă.

Indiferent de instrumentul pe care l-ați folosit pentru a scana, va trebui să parcurgeți fiecare eroare sau avertisment și să determinați dacă au fost semnalate corect și să dezvoltați un plan de acțiune pentru rezolvarea problemei. Dacă nu sunteți sigur dacă o problemă semnalată este cu adevărat o problemă de accesibilitate, testarea manuală a paginii vă poate ajuta să determinați cât de mare ar putea fi problema. Ce este testarea manuală a accesibilității? Testarea manuală a accesibilității este atunci când o persoană examinează o pagină web (mai degrabă decât un scaner AI) și determină dacă există probleme de accesibilitate prezente. Câteva exemple de testare manuală includ:

• Verificarea conținutului media încorporat, cum ar fi fișierele video și audio, pentru subtitrări și transcrieri.
• Folosind doar o tastatură pentru a naviga prin site-ul web.
• Scanarea conținutului site-ului web cu un cititor de ecran.
• Examinând site-ul web pe diferite dispozitive și cu rezoluții diferite.

Este important de reținut că accesibilitatea manuală este diferită de testarea utilizatorului. Testarea utilizatorilor implică angajarea persoanelor cu dizabilități pentru a testa accesibilitatea unui site web și pentru a oferi feedback. Testarea manuală a accesibilității este o parte vitală a identificării erorilor de accesibilitate, deoarece doar 30-40% dintre problemele de accesibilitate pot fi identificate printr-un instrument de testare automatizat.

Cum se efectuează testarea manuală a accesibilității Modul în care vă testați manual site-ul pentru accesibilitate va depinde dacă site-ul dvs. este deja activ sau nu. Pentru site-urile web live, cel mai bine este să testați paginile site-ului dvs. în această ordine:

Testați pagina de pe site-ul dvs. care primește cel mai mult trafic. Puteți utiliza orice software de urmărire preferați pentru a găsi aceste informații, dar Google Analytics este utilizat în mod obișnuit.

Testați toate paginile în care se așteaptă să aibă loc o conversie. Exemplele includ paginile coșului de cumpărături, paginile cu formulare web, paginile de contact și paginile de destinație publicitare.

Testează-ți pagina de pornire.

Testați o pagină reprezentativă pentru fiecare tip de postare. Tipurile de postări ar putea include un blog, o pagină de biografie a angajaților, pagini de calendar de evenimente și așa mai departe. De asemenea, ar trebui să testați pagina de arhivă pentru fiecare dintre aceste tipuri de postări.

Testează restul paginilor și postărilor de pe site-ul tău, în ordine de la paginile cu cel mai mare trafic la cele cu cel mai puțin trafic. Continuați până când ați examinat manual fiecare adresă URL publică de pe site-ul dvs. web.

Dacă site-ul dvs. nu este încă activ, vă puteți testa manual conținutul, pornind de la pagina de pornire și apoi deplasându-vă prin restul site-ului, în orice ordine este cea mai logică pentru dvs. Testați navigarea cu tastatura Cel mai bun mod de a începe testarea manuală a accesibilității este cu un test de navigare de la tastatură. Unii oameni care vă vizitează site-ul web vor trebui să-și folosească tastatura pentru a naviga prin acesta în loc de mouse. Acestea pot include utilizatori nevăzători sau cu deficiențe de vedere sau utilizatori cu leziuni sau deficiențe motorii. Pentru a testa site-ul dvs. de la tastatură, încărcați mai întâi pagina pe care doriți să o testați. Utilizați tastele Tab și săgeți pentru a vă deplasa prin paginile site-ului dvs. și pentru a interacționa cu caracteristicile fiecăruia. Scopul tău este să realizezi tot ce poți cu un mouse folosind doar tastatura. Când testați site-ul dvs. de tastatură, luați în considerare următoarele:

• Puteți vedea unde este starea de focalizare și unde vă aflați pe o pagină în orice moment?
• Stările de focalizare pentru butoane și linkuri au suficient contrast cu fundalul?
• Puteți accesa diferite pagini folosind doar tastatura?
• Pagina dvs. web are un link care vă permite să săriți la conținutul principal al paginii?
• Puteți interacționa cu funcții speciale ale paginii, cum ar fi glisoare de imagine, hărți sau videoclipuri?
• Puteți să trimiteți formulare web și să finalizați achizițiile de produse?

Testați cu cititoare de ecran După ce ați testat site-ul dvs. web pentru navigarea cu tastatură, puteți începe să îl testați cu cititoare de ecran. Un cititor de ecran este un tip de tehnologie de asistență pe care persoanele nevăzătoare și cu deficiențe de vedere o vor folosi adesea pentru a naviga printr-un site web și a citi conținutul web. Dacă aveți un Mac, vă puteți testa site-ul web folosind VoiceOver, un software de citire a ecranului încorporat în computer. Dacă nu aveți un Mac, puteți descărca NVDA, un cititor de ecran gratuit, open-source. De asemenea, poate doriți să luați în considerare testarea cu JAWS, un cititor de ecran plătit care este foarte popular printre utilizatorii nevăzători și cu deficiențe de vedere. Puteți testa site-ul dvs. numai cu unul dintre aceste cititoare de ecran, dar testarea cu două sau mai multe va oferi rezultate mai bune, deoarece nu toate cititoarele de ecran citesc același lucru atunci când întâlnesc elemente. Pentru a vă testa site-ul web cu un cititor de ecran, instalați software-ul de citire a ecranului pe computer, porniți-l și încărcați pagina pe care doriți să o testați. Deplasați-vă prin pagină așa cum ați făcut atunci când efectuați testarea manuală a tastaturii, folosind tastele Tab și săgeți. Ascultă ce spune cititorul de ecran și notează orice sună confuz sau incorect, cum ar fi:

• Un link care nu descrie scopul său . De exemplu, ați putea auzi „link pe care se poate da clic” sau „aflați mai multe”. Linkurile ar trebui să explice ce ar trebui să facă sau unde duc un utilizator.
• Elemente automate. Dacă aveți videoclipuri sau glisoare care se redă automat, acestea pot perturba cititoarele de ecran și pot deruta utilizatorul.
• Elemente complexe ale paginii. Dacă pagina dvs. are elemente complexe, cum ar fi conținut cu file sau acordeon, trebuie să vă asigurați că starea de focalizare se mută la conținutul din interiorul acordeonului. Dacă nu, utilizatorii cititorului de ecran nu vor putea găsi și citi conținutul.

Verificați mediile încorporate Diverse elemente media trebuie testate manual, inclusiv videoclipuri YouTube, glisoare de imagini și text, documente încorporate și widget-uri sau iFrame terțe. Fiecare dintre aceste încorporare trebuie să fie accesibilă. Pentru a testa accesibilitatea media încorporate, va trebui să vizitați partea frontală a site-ului dvs. și să-i observați vizual aspectul. Examinați tranziția și sincronizarea glisoarelor și videoclipurilor. Asigurați-vă că videoclipurile au subtitrări sau transcrieri separate. Testați fiecare dintre încorporații pentru cititorul de ecran și navigarea prin tastatură. Cum rezolv problemele de accesibilitate identificate? După ce ați finalizat scanările automate și testarea manuală, va trebui să rezolvați orice probleme identificate pentru a vă asigura că site-ul web este accesibil și respectă legile aplicabile. Deoarece există multe părți mobile în site-urile WordPress, diferite probleme de accesibilitate pot necesita soluții diferite. În cadrul WordPress, atingerea accesibilității poate însemna modificarea codului temei, reintroducerea conținutului în editor sau modificarea modului în care designul unei pagini să fie mai accesibil. Dacă problema există într-un plugin terță parte, este posibil să puteți contacta dezvoltatorul pluginului pentru a-i cere să facă modificarea. Dacă nu sunt capabili să facă schimbarea, atunci puteți fie să codificați un patch în tema dvs. sau un plugin, fie poate fi necesar să înlocuiți acel plugin cu un alt plugin cu totul. Pentru unele probleme de accesibilitate, poate fi logic să contractați o companie de remediere a accesibilității pentru a rezolva unele dintre problemele mai dificile.