Așa arată ce primește un client după o verificare rapidă, scurtat pentru web. Magazinul este real și provine din studiu; numele lui nu este dezvăluit. Cifrele, dovezile și valorile culorilor sunt cele produse de scanare pe 15 septembrie 2026.

Verificare rapidă de accesibilitate, raport model

Magazinul RO-08: pagina principală față de WCAG 2.1 AA

Retailer de electronice, România, mărime medie. Rezultat: neconform. Cinci reguli pică pe 79 de elemente, zece dintre ele critice. Aproape totul vine din patru locuri din cod.

Client: Magazinul RO-08 (nume nedezvăluit)
Data scanării: 15 septembrie 2026
Scopul acestui model: Pagina principală, desktop 1366 × 768, scanare automată plus verificări de structură
Standard: WCAG 2.1 nivel AA prin EN 301 549, așa cum cer Legea 232/2022 și European Accessibility Act
Instrumente: axe-core 4.13 în Google Chrome, rulat prin Playwright
Întocmit de: Daniel Butnar

1. Rezumat

Rezultatele pe scurt
Reguli picate (WCAG 2.1 A/AA)	5	Limba declarată	da, `ro`
Elemente eronate	79	Titlu de nivel unu	niciunul
Critice	10	Link „sari la conținut”	niciunul (primul link este „sus”)
Grave	69	Imagini	395, toate cu atribut alt
De verificat manual	43	Elemente HTML în pagină	5.445

Erorile sunt concentrate: o componentă de carusel, un șablon de bannere, un formular de căutare și trei valori de culoare din temă explică 78 din cele 79 de elemente eronate. Cine repară aceste patru locuri repară pagina principală și, pentru că sunt șabloane partajate, cea mai mare parte a restului site-ului.

Efort estimat de remediere: 2 până la 4 zile de dezvoltator, inclusiv retestarea, presupunând acces la codul-sursă al temei. Estimarea este pentru planificare; o ofertă cu preț fix urmează după ce văd codul.

2. Priorități

Denumește controalele caruselului. Critic, 9 elemente, o componentă. Constatarea 1.
Denumește butonul de căutare. Critic, 1 element. Constatarea 2.
Dă un nume linkurilor promoționale. Grav, 20 de elemente, un șablon. Constatarea 3.
Corectează trei perechi de culori din temă. Grav, 48 de elemente. Constatarea 4.
Subliniază linkul din subsol. Grav, 1 element. Constatarea 5.
Adaugă un titlu de nivel unu și un link „sari la conținut”. Recomandat. Constatarea 6.

3. Constatări

Constatarea 1: punctele caruselului nu au nume accesibil

Critic

WCAG 4.1.2 Nume, rol, valoareregula axe button-name9 elementeCaruselul principal, .owl-dot

Dovadă: Fiecare indicator de slide este un buton care conține un span gol. Un cititor de ecran anunță „buton” de nouă ori la rând. Atributul role="button" pe un button este redundant.
Efect: Utilizatorii de cititoare de ecran și de control vocal nu pot ști ce slide selectează un control sau care este activ.
Remediere: Adaugă fiecărui buton o etichetă ascunsă vizual și marchează-l pe cel activ. Dacă biblioteca de slider generează punctele, eticheta se poate adăuga prin dotsData sau printr-un callback onInitialized.
Efort: Aproximativ o oră.

<!-- găsit -->
<button role="button" class="owl-dot"><span></span></button>

<!-- reparat -->
<button type="button" class="owl-dot" aria-current="true">
  <span class="sr-only">Slide 1 din 9</span>
</button>

Constatarea 2: butonul de căutare nu are nume

Critic

WCAG 4.1.2 Nume, rol, valoareregula axe input-button-name1 elementCăutarea din antet, .submit-search

Dovadă: Butonul de trimitere al căutării este un input cu value gol; lupa este o imagine de fundal.
Efect: Este anunțat ca „buton” fără niciun scop. Utilizatorii de control vocal nu pot spune „apasă căutare”.
Remediere: Dă inputului o valoare și păstrează pictograma ca fundal, sau treci la un button cu text ascuns.
Efort: Cincisprezece minute.

<!-- găsit -->
<input type="submit" value="" class="submit-search">

<!-- reparat -->
<input type="submit" value="Caută" class="submit-search">
/* CSS păstrează pictograma și ascunde textul vizual: */
.submit-search { font-size: 0; color: transparent; background: url(search.svg) center / 20px no-repeat; }

Constatarea 3: douăzeci de linkuri promoționale fără text

Grav

WCAG 2.4.4 Scopul linkului, 4.1.2regula axe link-name20 de elementeBannerul pop-up și grila de bannere, /ajax/bannerUrl?bannerId=…

Dovadă: Fiecare banner este un link care conține doar o imagine, iar atributul alt al imaginii este gol. Linkul nu are așadar niciun nume accesibil; cititoarele de ecran citesc „link” sau adresa.
Efect: Conținutul campaniilor, în acest moment cel mai vizibil lucru din pagină, este invizibil pentru utilizatorii de cititoare de ecran. Douăzeci de opriri de Tab nu anunță nimic.
Remediere: Lasă șablonul de banner să scrie titlul campaniei în alt-ul imaginii. Textul trebuie să spună unde duce linkul, nu ce arată imaginea. Bannerele pur decorative nu ar trebui să fie linkuri.
Efort: Două ore în șablon, plus un câmp de titlu pentru fiecare banner în CMS, dacă nu există.

<!-- găsit -->
<a href="/ajax/bannerUrl?bannerId=12594"><img src="/banners/12594.jpg" alt=""></a>

<!-- reparat -->
<a href="/ajax/bannerUrl?bannerId=12594">
  <img src="/banners/12594.jpg" alt="Back to school: laptopuri de la 1.499 lei" width="600" height="300">
</a>

Constatarea 4: 48 de elemente de text sub contrastul minim de 4,5:1

Grav

WCAG 1.4.3 Contrast (minim)regula axe color-contrast48 de elementeMeniu, bandă promoțională, carduri de produs

Dovadă: Trei perechi de culori produc toate cele 48 de erori.

Perechi de culori care pică, cu contrastul măsurat și o propunere de înlocuire
Unde	Culori găsite	Măsurat	Propunere	Rezultat
Link de meniu „Servicii”, 15 px	`#FF0000` pe `#FFFFFF`	3,99:1	`#C40000` pe alb	6,3:1
Banda promoțională cu rate, 20 px	`#FFFFFF` pe `#F76981`	2,87:1	alb pe `#C8102E`	5,9:1
„In stoc magazin” pe cardurile de produs, 14,4 px	`#349900` pe `#FFFFFF`	3,68:1	`#2E7D00` pe alb	5,2:1

Efect: Persoanele cu vedere slabă, utilizatorii mai în vârstă și oricine se uită pe telefon afară nu pot citi starea stocului, prețurile din promoții sau meniul de servicii.
Remediere: Schimbă cele trei valori acolo unde sunt definite în temă. Culorile propuse păstrează nuanța și trec de AA; designerul poate alege alte valori, atât timp cât ating 4,5:1.
Efort: O jumătate de zi, inclusiv o verificare vizuală a fiecărui loc în care sunt folosiți tokenii.

Constatarea 5: linkul din subsol se distinge doar prin culoare

Grav

WCAG 1.4.1 Utilizarea culoriiregula axe link-in-text-block1 elementSubsol, „Vezi hartă”

Dovadă: Linkul este #666666 într-un paragraf cu text #999999, fără subliniere. Diferența dintre link și text este 2,01:1; minimul este 3:1 atunci când culoarea este singurul indiciu.
Remediere: Subliniază linkurile din textul curent. Asta rezolvă constatarea și pentru orice alt link din paragrafele site-ului.
Efort: Cinci minute.

.footer p a { text-decoration: underline; text-underline-offset: .15em; }

Constatarea 6: fără titlu de nivel unu și fără link „sari la conținut”

Recomandat

WCAG 2.4.1 Evitarea blocurilor, 1.3.1 Informații și relațiiVerificare de structurăÎntreaga pagină

Dovadă: Pagina nu are h1. Primul element focalizabil este un link „sus” cu eticheta „SUS”, așa că utilizatorii de tastatură pornesc de la capătul greșit al paginii și trebuie să treacă cu Tab prin tot mega-meniul ca să ajungă la produse.
Remediere: Adaugă un singur h1 (pe pagina principală ajung numele magazinului și sloganul) și un link „sari la conținut” ca prim element din body, care trimite la conținutul principal.
Efort: O jumătate de oră.

<a class="skip" href="#main">Sari la conținut</a>
…
<main id="main" tabindex="-1">

4. De verificat manual

Scannerul nu a putut determina contrastul pentru 43 de elemente de text, pentru că stau pe imagini sau degradeuri (plăci promoționale și titluri de categorii). În verificarea rapidă plătită, acestea sunt măsurate manual și fie sunt eliminate, fie sunt adăugate la Constatarea 4.

5. Ce nu include acest model

Această pagină arată partea automată a unei verificări rapide pe o singură pagină. Verificarea rapidă pe care o comanzi adaugă, pentru pagina principală, o pagină de produs și coș:

o trecere doar cu tastatura: focalizare vizibilă, ordinea focalizării, dacă se pot opera și părăsi caruselul și mega-meniul, dacă redarea automată poate fi oprită;
o trecere cu cititorul de ecran NVDA prin căutare, alegerea produsului și adăugarea în coș, precum și prin formularele din coș, cu date introduse intenționat greșit, ca să auzim mesajele de eroare;
zoom 200 % și un viewport de 320 px lățime, pentru a verifica reașezarea conținutului;
o verificare a declarației de accesibilitate, dacă există.

6. Pașii următori

Repară Constatările 1-5 în ordinea de mai sus; primele două iau o după-amiază.
Retestez fiecare corecție și o confirm în scris. Retestarea este inclusă când implementez eu corecțiile și se oferă la preț fix când le face echipa ta.
Publică o declarație de accesibilitate care numește standardul, problemele rămase cunoscute și un contact pentru feedback. Eu furnizez schița în română, germană sau engleză.

Daniel Butnar, dezvoltator web și specialist în accesibilitate, Brașov. daniel.butnar@gmail.com. Scanare din 15 septembrie 2026, axe-core 4.13, set de reguli WCAG 2.1 A și AA. Verificările automate găsesc doar o parte din bariere; acest raport nu face nicio afirmație despre criteriile care necesită testare manuală.