Cât de mare este impactul designului asupra accesibilității site-ului web

Căutați un punct de plecare în vasta disciplină a accesibilității? Vom aprofunda practicile și instrumentele reale pe care le puteți implementa în procesul de proiectare pentru a vă îmbunătăți produsele digitale, făcându-le incluzive pentru mai mulți utilizatori.

Ce este accesibilitatea?

Site-urile accesibile permit unei varietăți mai largi de utilizatori să interacționeze cu conținutul de pe site-ul dvs. într-o manieră fără fricțiuni. Indiferent dacă abordăm subiectul dintr-o perspectivă UI sau UX, accentul este pus pe crearea unui produs de calitate care să se potrivească unui public divers.

Acest public divers „se extinde la oricine se confruntă cu orice dizabilitate permanentă, temporară sau situațională, de exemplu, a avea un singur braț este o afecțiune permanentă, a avea un braț rănit este temporar și a ține un copil într-un braț este situațional - în fiecare caz, utilizatorul poate îndeplini sarcini cu o singură mână. ” (Avinash Kaur, 2018).

De ce este importantă accesibilitatea?

În calitate de designeri, este responsabilitatea noastră să ne asigurăm că proiectăm într-un mod accesibil tuturor utilizatorilor, indiferent de situația, abilitățile sau contextul lor. Ca rezultat, web-ul poate fi un spațiu incluziv pentru toți, indiferent dacă au o dizabilitate cognitivă, o deficiență vizuală sau o dizabilitate fizică.

Crearea unui site web accesibil nu trebuie să necesite sume mari de buget sau modificări. Deoarece nu necesită caracteristici sau conținut suplimentar, accesibilitatea poate fi realizată prin educare și conștientizare la începutul unui proiect de proiectare.

Este, de asemenea, important pentru afaceri: studiile arată că site-urile accesibile au rezultate de căutare mai bune, ajung la un public mai mare, sunt prietenoase cu SEO, au timp de descărcare mai rapid, încurajează bune practici de codificare și au întotdeauna o utilizare mai bună.

Cum putem realiza accesibilitatea?

Va trebui să faceți anumite ajustări și să urmați un cadru pentru a vă asigura că proiectați un set divers de abilități, vârste și nivel de experiență cu dispozitivele.

Accesibilitatea este o disciplină independentă, care evoluează constant pentru a se potrivi produselor digitale. Dar, în același mod, soluțiile software cresc și ele. Adică nu putem acoperi totul în subiect, dar dacă vi se pare util acest articol, putem face o parte 2!

Vom face o scufundare profundă în 5 zone mari:

1. Contrast de culoare
2. Text alternativ
3. Stări de focalizare
4. Formulare
5. Tipografie

Contrast de culoare

Asigurarea unui contrast de culoare suficient între text și fundal îi ajută pe utilizatorii care se luptă cu vederea. Acest lucru afectează un număr mai mare de utilizatori decât se aștepta și este adesea ignorat ca o problemă. Cu toate acestea, până la 1 din 12 bărbați sunt daltonici și mulți alții cu vedere slabă sau orbi.

Pentru început, ghidurile de accesibilitate dictează că culoarea nu ar trebui să fie niciodată singura modalitate de transmitere a informațiilor. Cu alte cuvinte, trebuie să existe un indiciu suplimentar pentru acei utilizatori care percep culoarea în mod diferit și care pot rata instrucțiunile noastre bazate pe culoare.

Pentru a menține un contrast decent între text și fundal, un raport bun de urmat este de minim 4,5 la 1. Acest lucru permite clarității utilizatorilor cu vedere redusă sau orbire a culorii să facă diferența între cele două.

Raportul de contrast de 4,5 la 1 aderă la nivelul de conformitate AA (din cele trei niveluri: A, AA și AAA), dar acest lucru se modifică în funcție de dimensiunea fontului și de nivelul de conformitate pe care doriți să îl atingeți. Fonturile mai mari necesită un raport de contrast mai mic de numai 3 la 1 dacă tipul este 18 pt (sau 14 pt cu caractere aldine).

Aceste rapoarte minime nu se aplică textului care se află într-o siglă sau un nume de marcă, dar este util să vă verificați singur raportul de contrast folosind acest instrument util.

Text alternativ

Pentru utilizatorii care accesează web utilizând cititoare de ecran, conținutul afișat nu este întotdeauna transmis corect. Text alternativ (alt) este ceea ce utilizează cititorul de ecran pentru a informa utilizatorul ce imagini sunt pe pagină.

Acest lucru se poate face prin conversia textului alternativ în braille, o descriere audio sau citirea vizuală a textului. Aceasta înseamnă că este important să descrieți cu exactitate ceea ce se întâmplă în imagine pentru cei care nu o pot vedea.

Uneori este posibil să nu fie necesar să adăugați text alternativ. De exemplu, pot exista suficienți indicatori contextuali în jurul imaginii sau imaginea nu are altă funcție decât cea estetică.

Stări de focalizare

Cel mai probabil sunteți familiarizați cu indicatorii de focalizare deja fără să vă dați seama. Stările de focalizare sunt contururile (adesea) albastre care apar atunci când este selectat un element, de ex. Linkuri, meniuri, butoane și câmpuri de formular.

Acestea semnalizează elementul pe care utilizatorul este concentrat în prezent atunci când folosește tastatura. Adesea, acești indicatori sunt priviți ca fiind inestetici sau ca și cum nu ar servi unui scop, dar sunt de fapt foarte importanți. Mulți utilizatori se limitează la utilizarea doar a tastaturii și persoanele cu deficiențe de vedere care utilizează cititoare de ecran necesită, de asemenea, indicatori de focalizare pentru a ajuta la navigarea pe pagină.

Indicatorii de focalizare sunt o modalitate simplă de a vă face navigarea pe pagină clară și accesibilă cu foarte puțin efort și totuși o mare diferență pentru utilizator. Se pot lega perfect de brand folosind culori adecvate, trebuie doar să fie contrastante, astfel încât elementele să iasă în evidență.

Formulare

Formularele pot fi complexe pentru oricine, dar cele cu probleme suplimentare de accesibilitate se pot lupta adesea atunci când formularele sunt prea minimaliste și neclare. Mai jos sunt enumerate câteva elemente comune care trebuie abordate pentru a aborda accesibilitatea:

• Etichete - utilizarea textului substituent ca etichetă mai degrabă decât text în afara câmpului creează confuzie pe măsură ce textul dispare atunci când utilizatorul începe să tasteze. Omiterea direcțiilor cruciale pentru utilizator în favoarea minimalismului sau esteticii este o eroare majoră de evitat.
• Borduri - ceva la fel de simplu ca o margine în jurul unei introduceri de text este important pentru utilizatorii cu dizabilități cognitive, deci este clar unde trebuie să facă clic
• Instrucțiuni suplimentare - de multe ori formularele utilizează o abordare minimalistă pentru a încurca designul, însă acest lucru împiedică utilizarea și, prin urmare, accesibilitatea.
• Mesaje de eroare - acestea ar trebui să fie indicate de mai multe elemente, în mod obișnuit se folosește culoarea, dar pe lângă acestea, erorile ar trebui să fie indicate prin simboluri sau text.
• Revizuire - formularele ar trebui să permită o perioadă de revizuire înainte de trimitere pentru a permite utilizatorului să corecteze orice informație.

Tipografie

Informațiile sunt mai ușor de digerat atunci când nu sunt aglomerate și prea mari într-un spațiu. Acest lucru se aplică și site-urilor web accesibile. După cum s-a menționat mai devreme, dimensiunea fontului poate modifica cerințele minime pentru raportul de contrast, dar dimensiunile fontului nu ar trebui să fie mai mici de 10 pt.

După cum puteți vedea, este dificil să citiți în 9 pct.

Creșterea cantității de spațiu alb între ambele linii de text și cuvinte individuale poate ajuta utilizatorii cu deficiențe de vedere sau cu dislexie. Următoarea distanță minimă asigură îndeplinirea cerințelor acestor utilizatori:

• Spațierea literelor : x0.12 dimensiunea fontului
• Spațiere cuvânt : x0.16 dimensiunea fontului
• Spațiere între linii : x1,5 dimensiunea fontului
• Spațierea paragrafelor : x2 dimensiunea fontului

Concluzie

În mod surprinzător, aceste mici modificări pot face o mare diferență în accesibilitate. Nu necesită bugete mari și mult timp pentru ca site-ul dvs. să se încadreze în Ghidul de accesibilitate a conținutului web, dar poate schimba dramatic experiența pentru un utilizator și, prin urmare, vă poate stimula afacerea.

Adăugarea acestor sugestii în procesul dvs. de proiectare poate deveni a doua natură, deschizând calea către un viitor al site-urilor web mai accesibile - depinde de noi, ca designeri.

Dacă aveți nevoie de ajutor pentru reclama dvs., nu ezitați să ne contactați.