Report di accessibilità di esempio
Questo esempio statico mostra il tipo di report che il nostro scanner automatico può generare: problemi rilevati specifici, riferimenti WCAG, contesto interessato e indicazioni che il tuo team può adattare.
Problemi rilevati chiari e concreti
I report mostrano il selettore interessato, la gravità, la mappatura WCAG e le pagine coinvolte, così uno sviluppatore può decidere cosa correggere per primo.
Esempio di problema rilevato: testo alternativo mancante
HTML: <img src='logo.png'> Problema rilevato: un'immagine informativa non ha un'alternativa testuale. WCAG: 1.1.1 Contenuto non testuale.
Esempio di suggerimento
Il report può suggerire di aggiungere un attributo alt significativo, ad esempio <img src='logo.png' alt='Company name logo'>. Il tuo team deve comunque verificare che il testo sia accurato nel contesto.
Oltre l'automazione
Il report segnala anche i controlli che richiedono una verifica manuale, come l'ordine logico del focus, il testo alternativo significativo e il comportamento nei vari stati di interazione.
Esempio di contesto annotato
Quando disponibile, il report può mostrare il contesto dell'interfaccia interessato accanto al risultato della regola, aiutando i team a collegare un problema rilevato in automatico alla pagina da ispezionare.
1.4.3 Contrast (Minimum)
Fix any of the following: Element has insufficient color contrast of 2.94 (foreground color: #9ca3af, background color: #ffffff, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 4.5:1
Ensure that text has a contrast ratio of at least 4.5:1 against its background color to be legible for people with moderately low vision.
Dettagli tecnici
Markup non conforme → esempio di correzione
<a href="/about" class="nav-link text-gray-400 bg-white">About Us</a><a href="/about" class="nav-link text-gray-700 bg-white">About Us</a>Esempio di correzione: indicazioni per il tuo codice, non applicate al tuo sito.
Leggi la guida alla regola di wcagc: color-contrastLeggi le indicazioni di axe: 1.4.3(si apre in una nuova scheda)