6 sfaturi pentru îmbunătățirea accesibilității site-ului

În mod ideal, accesibilitatea ar trebui să fie considerată ca parte a fiecărui proiect web pentru a crește disponibilitatea pentru publicul cât mai larg posibil. În lumea reală însă, poate fi ușor trecută cu vederea. În acest articol ne vom uita la modalități ușoare pe care le puteți îmbunătăți accesibilitatea site-ului dvs. fără a fi nevoie să faceți schimbări drastice sau consumatoare de timp.


Introducere

"Din păcate, puterea și adaptabilitatea web nu este întotdeauna utilizată pe deplin"

World Wide Web este o resursă incredibilă și a deschis noi posibilități interesante. Multe persoane sunt acum capabile să acceseze informații și divertisment nedisponibile anterior prin intermediul formelor tradiționale de media. World Wide Web este deosebit de important pentru persoanele cu dizabilități, deoarece cantitatea vastă de informații digitale stocate poate fi manipulată pentru a satisface cerințele diferite. Din păcate, puterea și adaptabilitatea web nu este întotdeauna utilizată pe deplin, iar persoanele cu dizabilități pot întâmpina dificultăți în navigarea pe site-uri web și au o experiență negativă cu Web-ul în general.

Există numeroase motive pentru care ar trebui să urmăriți îmbunătățirea accesibilității site-ului dvs., dintre care unul este faptul că este legea în multe țări. În Regatul Unit, de exemplu, accesibilitatea pe web se încadrează în Legea privind discriminarea persoanelor cu handicap și, dacă site-ul dvs. nu respectă legislația, ar putea fi intentată o acțiune în justiție împotriva dvs. Cu toate acestea, problemele legale aruncate deoparte, de ce nu doriți să deschideți site-ul dvs. pentru publicul cât mai larg, făcându-l accesibil tuturor?

Inițiativa accesibilității web (WAI) a fost creată de W3C pentru a promova accesibilitatea pe Web. WAI încearcă să-i educe pe oameni cu privire la modul în care cei cu dizabilități utilizează Web-ul și a creat linii directoare pentru designerii web și dezvoltatorii care urmează să le urmeze. Veți găsi că multe dintre liniile directoare sunt ușor de urmărit și implementate. Mai jos vom discuta câteva metode ușoare care vă vor ajuta să respectați aceste îndrumări și să vă îmbunătățiți accesibilitatea site-ului dvs..


Sfat 01: Luați în considerare culorile

Se estimează că aproximativ zece milioane de bărbați suferă de o formă de orbire a culorilor în S.U.A. Cele mai frecvente tipuri sunt Protanopia și Deuteranopia; iar cei care suferă de acestea au dificultăți în a distinge culorile roșii, verzi și similare. Cu o prevalență atât de mare a acestei afecțiuni, merită luată în considerare în momentul proiectării și codării site-ului dvs..

În cea mai mare parte, nu există măsuri radicale care trebuie luate atunci când se proiectează cu orbire în culori - așa cum este cazul majorității sugestiilor din acest articol. Un site web bine conceput nu va genera, în general, probleme majore pentru utilizatorii de tip "color blind". Merită însă să luați în considerare în plus, atunci când proiectați elemente interactive sau call-to-action. De exemplu; o legătură text simplă, roșie, fără altă decorare, poate fi imposibil de văzut dacă se află într-un bloc de text gri sau negru. Nimeni nu sugerează că trebuie să rămânem cu stilul implicit de legătură, dar este util să folosiți mai mult de un tip de decor, cum ar fi o subliniere sau o culoare de fundal.

Un instrument util pentru designeri poate fi găsit la colorfilter.wickline.org care oferă mai multe filtre diferite care imită modul în care diferite tipuri de utilizatori color-orb ar percepe un site web. Pur și simplu tastați adresa URL a unui site Web și selectați filtrul pe care doriți să-l utilizați - nu durează puțin timp pentru a încărca totuși astfel încât va trebui să aveți răbdare.

Merită, de asemenea, să țineți cont de nivelul de contrast dintre elementele primare și de fond ale site-ului dvs. web. Un nivel ridicat de contrast va fi benefic pentru toată lumea, nu doar pentru cei cu deficiențe de vedere. Liniile directoare privind accesibilitatea web sugerează un raport minim de contrast de 4,5: 1 și un raport ideal de 7: 1 pentru textul corpului de dimensiuni standard. Evident, cea mai sigură opțiune este întotdeauna textul negru pe fundal alb sau invers.

Puteți verifica raportul de contrast al mai multor elemente de pe un site utilizând extensia Firefox pentru Contrastul Color Contrast Analyzer. Acesta va analiza fiecare element din pagină și va furniza un raport cu privire la respectarea sau nu a regulilor WAI.


Sfat 02: Legături contextuale

Cei care utilizează cititoarele de ecran vor avea adesea opțiunea de a naviga pe o pagină web prin săriți prin link-uri pentru a găsi ceva de interes. În cazul legăturilor text, utilizatorul ar auzi pur și simplu cuvântul în mod izolat, indiferent de conținutul care îl înconjoară. Prin urmare, este extrem de nefolositor atunci când tot ceea ce aude utilizatorul este "faceți clic aici" sau "mai mult" - aceste tipuri de link-uri nu oferă nicio informație despre locul în care conduc utilizatorul sau despre ceea ce se referă.

O opțiune mult mai bună este de a oferi o legătură mai descriptivă. Un link care duce utilizatorul la articolul complet pe un blog ar putea citi "afla mai multe despre S.E.O" sau "click aici pentru articolul complet despre S.E.O".


Sfat 03: Conținut alternativ

Unul dintre principiile de bază ale inițiativei "Accesibilitate Web" este de a face ca conținutul pe web să fie accesibil tuturor, indiferent de handicapul pe care îl pot avea. Există o serie de tehnici, cum ar fi cele discutate în acest articol, care vor contribui la atingerea scopului WAI. Totuși, vor exista întotdeauna anumite tipuri de conținut, care nu pot fi accesibile pentru unii utilizatori, cum ar fi audio pentru cei care sunt surzi. În acest scenariu, trebuie să furnizați întotdeauna conținut alternativ, acolo unde este posibil.

Ghid de accesibilitate a conținutului Web 1.1:

Furnizați alternative de text pentru orice conținut care nu este text, astfel încât să poată fi schimbat în alte forme de oameni, cum ar fi imprimare mare, Braille, simboluri sau limbă mai simplă.

De exemplu, dacă aveți un videoclip al unui interviu pe site-ul dvs., puteți lua în considerare includerea unei transcrieri a conversației pe care utilizatorii o pot descărca sau citi pe site. O altă metodă este să adăugați subtitrări la videoclip - o metodă pe care YouTube o experimentează cu ajutorul software-ului de recunoaștere a vorbirii.

O abordare mai completă este furnizarea unui link către o versiune a textului site-ului dvs. numai pentru text. Această metodă va face, de asemenea, site-ul dvs. mult mai accesibil pentru cei cu conexiuni de internet lent, cum ar fi cei care încă utilizează o conexiune dial-up sau navighează pentru un dispozitiv mobil.


Sfat 04: Indici de file

Indexul de taburi stabilește, în principiu, ordinea elementelor pe care un utilizator le va trece prin utilizarea tastei "Tab". În majoritatea cazurilor, dacă un design al paginii urmează o ordine logică și stabilește o ierarhie puternică folosind titluri, sub-rubrici etc., atunci nu trebuie să vă faceți griji în legătură cu acest lucru prea mult. Cu toate acestea, cu ajutorul formularelor, această funcție este foarte valoroasă.

Formularele pot include multe elemente mici, cum ar fi casetele de selectare și butoanele radio, care pot necesita mișcări precise și clicuri ale mouse-ului. Este posibil ca cineva cu dizabilități motorii să nu aibă controlul necesar pentru a efectua astfel de acțiuni precise. Cu un indice de fișiere corect stabilit, un utilizator va putea să circule și să interacționeze cu fiecare element de formular utilizând simpla apăsare pe tastatură. Indexul de filme va beneficia, de asemenea, pe cei care nu au acces la un mouse și se bazează exclusiv pe utilizatorul unei tastaturi pentru a naviga pe un site Web.


Sfat 05: Utilizarea corectă a atributului Alt

Știm cu toții despre alt text. Este textul pe care trebuie să-l adăugăm la imagini pentru ca site-ul nostru să poată fi validat. Toată lumea le folosește bine? De fapt, există o mulțime de site-uri care nu fac acest lucru și pe cele care le folosesc adesea incorect. De fapt, există multe dezbateri despre utilizarea corectă a atributului alt.

Atributul alt are trei scopuri principale:

  • Tehnologiile de asistență, cum ar fi cititoarele de ecran, utilizează alt text și îl citesc cu voce tare utilizatorului.
  • Alt text este afișat în locul imaginii când imaginile au fost dezactivate de către cei care au o conexiune la internet lentă sau cei care utilizează un browser numai pentru text.
  • Motoarele de căutare utilizează și alt text pentru a stoca informații despre pagină, deoarece nu pot citi conținutul imaginilor.

"Adevărul este că textul alternativ pentru imagini depinde de contextul în care acesta este plasat"

Deci, alt text în esență este echivalentul textului unei imagini sau al unei alte surse media și este folosit atunci când imaginea nu poate fi accesată din diverse motive. Deci ce informații folosim exact pentru atributul alt? Unii oameni plasează descrieri detaliate ale imaginii, în timp ce alții o încarcă cu cuvinte cheie într-un efort de a-și ajuta clasamentul de căutare. Adevărul este că textul alternativ pentru imagini depinde de contextul în care este plasat.

De exemplu, este obișnuit ca o imagine relevantă să însoțească o postare pe blog, cum ar fi o mașină de scris pentru un articol despre scrierea independentă. Articolul însăși nu face nicio referire la imagine, de aceea este destul de inutil. Unii oameni pot da alt atribut valoarea "mașinii de scris" sau "imaginea unei mașini de scris" sau poate că ar da valoarea titlului articolului. Toate aceste metode sunt greșite. Să vedem de ce.

În primul rând trebuie să ne imaginăm că nu putem vedea imaginea. Deci, dacă valoarea atributului alt era "mașină de scris", am vedea titlul postului de blog, cuvântul "mașină de scris" pe cont propriu, apoi textul principal al articolului - acest lucru nu are sens atunci când este privit ca text și ar fi chiar și mai confuz dacă utilizați un cititor de ecran și ați auzit la întâmplare o "mașină de scris".

Ca regulă generală, este mai bine să nu folosiți expresii precum "o imagine a" sau "o imagine a" atunci când oferiți valori de atribut alt. Atributul alt va aduce beneficii numai celor care nu pot vedea imaginea din diverse motive, prin urmare, spunând acestor utilizatori că există o imagine care nu oferă nicio valoare reală decât eliminarea unor confuzii cauzate de metoda de mai sus.

În cele din urmă, dând alt atribut valoarea titlului postării pe blog, rezultatul va fi doar afișat de două ori ca text sau repetat de două ori când se utilizează cititoare de ecran. Alt text nu trebuie să repete nici o informație care este deja furnizată ca text, este pur și simplu inutilă și potențial confuză.

Cea mai bună opțiune din acest scenariu este pur și simplu să furnizeze o valoare alt atribut blank. O valoare necompletată nu asigură comunicarea informațiilor potențial confuze sau irelevante și nu există niciun prejudiciu pentru înțelegerea articolului deoarece imaginea nu este esențială pentru aceasta. Unii pot argumenta că, din moment ce imaginea este pur estetică, atunci nu este conținut și, prin urmare, nu aparține în HTML și ar trebui să fie afișată folosind CSS, există opinii diferite cu privire la acest lucru.

După cum puteți vedea, furnizarea unor valori corecte ale atributelor poate fi dificilă și depinde foarte mult de situație. Cel mai bun sfat este să evaluați fiecare scenariu individual, să decideți dacă imaginea este necesară pentru înțelegerea și folosirea celei mai bune judecăți.


Sfat 06: Taste de acces

Ca indici de file, cheile de acces reprezintă o caracteristică valoroasă pentru acei utilizatori care se bazează pe o tastatură pentru a naviga pe un site Web. Din păcate, cheile de acces reprezintă unul dintre elementele HTML cel mai puțin utilizate, în primul rând pentru că o mulțime de oameni nu sunt conștienți de ele și de cei care aleg să nu le implementeze în ciuda faptului că sunt extrem de simple.

Tastele de acces reprezintă, în esență, comenzi rapide de la tastatură care ajută un utilizator al tastaturii să navigheze rapid la anumite secțiuni ale unui site web. Tastele de acces pot fi utilizate ținând apăsată o tastă funcțională (de obicei, Alt pe Windows sau Ctrl pe Mac) și apăsând o anumită cheie de litere sau cifre care corespunde unei secțiuni a site-ului.

După cum am menționat mai devreme, cheile de acces sunt incredibil de simple de implementat. Tot ce implică este o simplă bucată de cod HTML adăugat la etichetele ancorare de navigare ale site-ului dvs. -

Acasă

Simplu.

O problemă cu cheile de acces este că nu există un set universal de chei atribuite pe care utilizatorii se pot aștepta să fie utilizate și combinate cu nici un standard real de informare a utilizatorilor despre cele care au fost folosite efectiv în cheile de acces fiind destul de ineficiente.

Guvernul Regatului Unit are totuși un set de taste de acces recomandate pentru atribuire, acestea sunt după cum urmează:

  • S - Sari peste navigație
  • 1 - Pagina de pornire
  • 2 - Știri / Actualizări
  • 3 - Harta site-ului
  • 4 - Căutați
  • 5 - Întrebări frecvente (F.A.Q)
  • 6 - Ajutor
  • 7 - Procedura de reclamații
  • 8 - Termeni și condiții
  • 9 - Formular de feedback
  • 10 - Informații cheie de acces

Gândurile finale

După cum puteți vedea, multe dintre metodele de mai sus sunt foarte ușor de implementat și necesită doar o cunoaștere de bază a HTML-ului. Realizarea site-ului dvs. mai accesibil nu trebuie să fie consumatoare de timp, să necesite modificări masive sau să fie în detrimentul apelului unui site web.

Cred că este important ca atât designerii, cât și dezvoltatorii să aibă cunoștințe despre accesibilitate și să o ia în considerare în diferitele etape ale construirii unui site web. Mai devreme în procesul de proiectare că atenția și gândirea sunt acordate accesibilității, cu atât mai ușor va fi încorporarea acestor metode și obținerea unor rezultate mai bune.

De asemenea, este important să rețineți că majoritatea metodelor detaliate mai sus nu numai că vor ajuta pe cei cu dizabilități, ci vor aduce beneficii tuturor utilizatorilor site-ului dvs. Web. Unele sfaturi pot chiar să vă îmbunătățiți clasamentul cu motoarele de căutare.

Am discutat doar câteva sfaturi care vor face site-ul dvs. mai accesibil, dar dacă sunteți într-adevăr angajat, vă recomandăm să verificați modul în care vă puteți conforma listei complete a Ghidului privind accesibilitatea conținutului web.