Verificare accesibilitate HTML (WCAG 2.2)
Verificare accesibilitate HTML
Un fragment sau o pagină întreagă. Scripturile nu rulează. Ctrl+Enter verifică.
Verificatorul are nevoie de JavaScript, pentru că rulează în browserul tău. Fără el, citește regulile de mai jos sau folosește verificarea gratuită a unei pagini după adresă.
<h1>Garden chairs</h1> <img src="chair.jpg"> <a href="/cart"><svg width="24" height="24"><path d="M2 3h3l3 12h11l3-9H6"/></svg></a> <label>Email</label> <input type="text" name="email"> <button></button> <p style="color:#999;background:#fff">Free delivery over 50 EUR.</p>
Ce a fost verificat
Lipește un fragment HTML sau o pagină întreagă. Verificatorul o afișează într-un cadru izolat, rulează în browserul tău motorul open-source axe-core și listează problemele după impact, fiecare cu codul greșit, criteriul de succes WCAG și indicația de remediere. Nimic nu este trimis pe serverul nostru.
Ce vezi în rezultat
- Probleme după impact: critice, grave, moderate și minore; regula cea mai frecventă prima.
- Criteriul de succes al fiecărei probleme ca legătură, de exemplu 1.1.1 Conținut non-text, cu nivelul (A sau AA).
- Elementele greșite: selectorul CSS și HTML-ul fiecăruia, ca să le găsești în cod.
- Cum se remediază, din biblioteca noastră de reguli, în limba acestei pagini, cu legătură către explicația completă.
- „Necesită o privire umană”: cazuri pe care regula nu le-a putut decide, de exemplu o culoare pe o imagine de fundal. Verifică-le manual.
Ce rămâne pe calculatorul tău
Browserul tău interpretează HTML-ul și îl afișează într-un iframe cu sandbox="allow-same-origin" și o politică strictă de securitate a conținutului: niciun script din fragment nu rulează, formularele nu pot fi trimise, iar legăturile se deschid într-o filă nouă. Implicit, previzualizarea nu încarcă imagini sau stiluri de pe alte site-uri; bifează opțiunea dacă fragmentul are nevoie de o foaie de stil externă. axe-core se încarcă de pe serverul nostru la prima apăsare a butonului, iar verificarea rulează în browserul tău. Nu primim codul tău.
Fragment sau pagină întreagă
Un fragment nu este o pagină, de aceea regulile despre pagina întreagă (titlul paginii, atributul lang, repere, titlul de nivel unu, legătura de salt) sunt dezactivate pentru fragmente. Lipește un document complet care începe cu <!doctype html> sau <html> și vor fi verificate și ele. Opțiunea „include regulile de bune practici” adaugă recomandări pe care WCAG nu le cere; debifeaz-o ca să vezi doar problemele WCAG.
Ce nu poate găsi verificarea unui HTML lipit
- Ce adaugă pagina mai târziu. Sursa nu conține ce construiesc scripturile după aceea. Copiază HTML-ul randat din instrumentele pentru dezvoltatori („Copy outerHTML”) sau testează adresa reală cu verificatorul WCAG.
- Stilurile pe care nu le-ai lipit. Contrastul culorilor, conturul focusului și spațierea textului depind de CSS. Culorile le testezi în verificatorul de contrast.
- Tot ce are nevoie de un om. Dacă textul alternativ descrie imaginea, dacă ordinea de citire are sens, dacă un utilizator de tastatură poate finaliza comanda, cum sună pagina într-un cititor de ecran. Vezi cum se testează WCAG.
Este o verificare automată, nu un audit complet, și nu este consultanță juridică. Un rezultat fără constatări nu înseamnă că HTML-ul este accesibil.
Nu este un validator în sensul W3C
Un validator de sintaxă HTML verifică dacă marcajul respectă specificația HTML. Instrumentul acesta verifică reguli de accesibilitate: butoane fără nume, imagini fără text alternativ, câmpuri de formular fără etichetă, atribute ARIA greșite. Sunt două întrebări diferite; o pagină poate fi HTML valid și totuși să nu respecte WCAG, și invers. WCAG 2.2 nu mai are criteriul 4.1.1 Analiză; marcajul greșit contează atunci când strică nume, roluri sau relații (4.1.2, 1.3.1).
Unde se potrivește
Folosește-l când scrii o componentă sau verifici un șablon primit de la un client. Pentru o pagină publicată există verificatorul WCAG, pentru paginile din spatele unui login extensia de browser. Alte instrumente sunt comparate în instrumente de testare a accesibilității. Pandus rulează astfel de verificări pe fiecare pagină a site-ului tău în fiecare săptămână și explică fiecare problemă în limba proprietarului.
Întrebări frecvente
Codul meu este trimis pe un server?
Nu. HTML-ul este afișat și verificat în browserul tău. De pe serverul nostru se încarcă doar pagina și scriptul de verificare; codul lipit nu este trimis nicăieri.
Rulează scripturile din HTML-ul meu?
Nu. Previzualizarea folosește un cadru izolat fără permisiunea de a rula scripturi, deci scripturile inline, gestionarii de evenimente și etichetele script nu fac nimic. Conținutul pe care l-ar adăuga scripturile nu este verificat.
Ce reguli folosește?
Regulile axe-core pentru WCAG 2.0, 2.1 și 2.2 la nivelurile A și AA, plus regulile de bune practici dacă lași opțiunea activă. Constatările sunt explicate cu propriile noastre fișe de reguli.
Este un validator W3C?
Nu. Nu validează sintaxa HTML, ci reguli de accesibilitate. Este o altă întrebare.
Poate confirma că HTML-ul meu respectă WCAG sau EAA?
Nu. Regulile automate găsesc doar o parte din probleme. Rămâne necesară o verificare manuală cu tastatura și cu un cititor de ecran, iar instrumentul nu este consultanță juridică.