Salt la conținut
Pandus

Verificarea accesibilității magazinului online: un test de 30 de minute

· Lectură de 4 min

Puteți verifica singur accesibilitatea magazinului online în aproximativ 30 de minute: un scan automat al paginilor cheie, apoi cinci teste manuale simple, cu tastatura, la zoom 200%, pentru contrast, pentru formulare și pe telefon. Nu veți găsi tot, dar veți afla dacă un cumpărător cu dizabilități poate finaliza o comandă și unde trebuie reparat întâi.

Testul de mai jos nu înlocuiește un audit complet și nu constituie consultanță juridică. Este un punct de plecare practic.

Înainte de a începe (2 minute)

Alegeți paginile prin care trece o comandă:

  • prima pagină;
  • o categorie cu filtre;
  • un produs cu variante (mărime, culoare);
  • coșul;
  • pagina de comandă, până la alegerea plății;
  • autentificarea sau crearea contului.

Notați problemele într-un tabel simplu: pagina, ce nu a mers, cât de grav este (blochează comanda sau doar încurcă).

Pasul 1: scanul automat (5 minute)

Rulați o verificare automată după WCAG 2.2 AA pe paginile alese. Puteți testa o pagină cu verificarea gratuită. Scanul găsește rapid problemele detectabile tehnic:

  • imagini de produs fără text alternativ;
  • text cu contrast insuficient;
  • câmpuri de formular fără etichetă;
  • butoane-pictogramă (coș, căutare, favorite) fără nume;
  • lipsa limbii paginii.

Testele automate acoperă însă doar o parte din bariere; studiile apreciază diferit cât de mare este această parte. De aceea urmează testele manuale.

Pasul 2: doar cu tastatura (10 minute)

Lăsați mouse-ul deoparte. Folosiți Tab, Shift+Tab, Enter, Space și săgețile.

  • Căutați un produs, alegeți o variantă, adăugați-l în coș și mergeți până la alegerea plății.
  • Vedeți mereu unde este focusul? Un contur vizibil trebuie să arate elementul activ.
  • Rămâneți blocat undeva? De exemplu într-un meniu, într-o fereastră pop-up sau într-un câmp de adresă cu sugestii.
  • Se închide banner-ul de cookie-uri din tastatură?
  • Focusul ajunge sub un header fix și dispare din vedere?

Dacă nu puteți plasa comanda doar cu tastatura, aveți o barieră majoră: o parte dintre cumpărători nu pot comanda deloc.

Pasul 3: zoom 200% (3 minute)

Măriți pagina la 200% în browser și repetați parcursul pe scurt. Textul trebuie să rămână lizibil, fără să fie tăiat sau suprapus, iar butoanele importante să fie accesibile fără derulare pe orizontală.

Pasul 4: contrastul (3 minute)

Uitați-vă la prețuri, la textul gri despre livrare, la placeholder-ele din formulare și la butoanele pe fundal colorat. Textul normal are nevoie de un raport de contrast de cel puțin 4,5:1. Valorile exacte le puteți măsura cu verificatorul de contrast.

Pasul 5: formularele (4 minute)

În coș și la comandă:

  • fiecare câmp are o etichetă vizibilă, nu doar un placeholder care dispare;
  • câmpurile obligatorii sunt marcate clar;
  • trimiteți formularul gol intenționat: mesajul de eroare spune ce trebuie corectat și apare lângă câmp?

Pasul 6: pe telefon (3 minute)

Deschideți magazinul pe telefon. Butoanele „adaugă în coș”, „plus/minus” cantitate și filtrele trebuie să fie suficient de mari ca să le apăsați fără greșeală; WCAG 2.2 introduce un criteriu pentru dimensiunea minimă a țintelor. Nimic important nu trebuie să fie acoperit de banner-e fixe sau de butoane de chat.

De unde vin problemele

Erorile găsite au de obicei patru surse. Contează să știți care, pentru că de ea depinde cine repară.

Sursa Exemple Cine repară
Tema contrast, focus invizibil, meniu doar cu mouse-ul, butoane-pictogramă fără nume dezvoltatorul temei sau agenția
Pluginuri și aplicații slider, pop-up, banner de cookie-uri, chat, recenzii furnizorul pluginului sau înlocuirea lui
Conținut imagini de produs fără text alternativ, PDF-uri, titluri sărite echipa care introduce produsele
Cod propriu configuratoare, filtre personalizate, pasul de livrare dezvoltatorul magazinului

Pe WooCommerce, Shopify sau PrestaShop, cea mai mare parte a structurii vine din temă. De aceea reparați la nivel de șablon, nu pagină cu pagină: un șablon de produs corectat elimină eroarea pe toate produsele deodată. Pentru WordPress și WooCommerce există și pluginul nostru, care arată problemele lângă fiecare pagină.

Ce faceți cu rezultatele

  1. Întâi tot ce oprește comanda: câmpuri fără etichetă, butoane fără nume, capcane de tastatură.
  2. Apoi navigarea și căutarea.
  3. Apoi informațiile despre produse: texte alternative, prețuri lizibile, tabele de mărimi.
  4. Restul: blog, pagini de prezentare.

Lista detaliată a criteriilor este în checklist-ul WCAG 2.2, iar cele mai frecvente erori, cu reparații, în articolul greșeli frecvente de accesibilitate.

Repetați după fiecare actualizare

O temă nouă, un plugin actualizat sau o pagină de campanie pot aduce erori noi. Repetați scanul automat regulat, de exemplu săptămânal, și testul manual după schimbările mari. Dacă magazinul dumneavoastră intră sub Legea nr. 232/2022, pașii juridici sunt descriși în ghidul Legea 232/2022, iar verificarea completă în trei pași în pagina verificare EAA.

Verificarea noastră este o verificare automată, nu un audit complet, și nu constituie consultanță juridică. Pentru o evaluare completă, citiți despre auditul de accesibilitate.

Surse