Verifica Accessibilità

Test di Accessibilità: Il Tuo Sito è Accessibile a Tutti?

Con la Verifica di Accessibilità di Digitale.co, puoi scoprire quanto è accessibile il tuo sito web. Lo strumento esegue la scansione del tuo sito, assicurandosi che ogni sottopagina possa essere visualizzata correttamente dagli screen reader, consentendo anche agli utenti non vedenti e ipovedenti di sfruttarlo appieno.

Il Test di Accessibilità valuta 41 caratteristiche, suddivise in otto categorie. Le categorie più importanti sono:

Navigazione
Il nostro test controlla se la navigazione è uniforme ed accessibile.
ARIA
ARIA è un'estensione HTML semantica, che rende i siti Web più accessibili per le persone con disabilità. Il nostro test verifica se ARIA è stata implementata correttamente.
Nomi ed Etichette
Tra le altre cose, il nostro test verifica anche se i campi dei moduli e i pulsanti sono contrassegnati con tag significativi e se le immagini hanno un testo alternativo (alt text).
Contrasto
Per moltissimi utenti, il testo a basso contrasto è difficile o impossibile da leggere. Il nostro test verifica se il rapporto di contrasto tra i colori di sfondo e in primo piano è sufficiente.
Tabelle ed Elenchi
Gli screen reader offrono funzioni che semplificano notevolmente la navigazione tra tabelle ed elenchi. Verifichiamo se questi sono stati implementati correttamente.
Audio & Video
Se un video contiene sottotitoli, gli utenti con problemi di udito possono comprenderne meglio il contenuto. Questo test controlla se ci sono markup corretti.
Internazionalizzazione e Localizzazione
Quando specifichi una lingua valida sul tuo sito, gli screen reader possono visualizzare correttamente il testo. Il nostro test verifica se è stata specificata una lingua valida.

Domande Frequenti

Cosa significa accessibilità del sito?

⊖

Un sito web accessibile è progettato in modo tale che le persone con disabilità o deficit di qualsiasi tipo possano utilizzarlo senza restrizioni.

Solitamente i migliori software per creare siti web come Wix permettono già di creare siti web accessibili senza essere dei professionisti. Scopri di più riguardo a opinioni e costi Wix nella nostra recensione scritta da esperti del settore.

Anche piattaforme e hosting WordPress permettono di creare questo tipo di verifiche in modo efficiente.

Perché il mio sito dovrebbe essere accessibile?

⊖

Un sito web accessibile può essere apprezzato da chiunque, indipendentemente dal tipo di handicap o disabilità. Ciò consente di raggiungere un bacino d'utenza più ampio, aumentare l'usabilità del sito e contribuire all'integrazione su Internet delle persone con disabilità.

Come funziona il Test di Accessibilità?

⊖

Dopo aver inserito un URL, il Test di Accessibilità di Digitale.co esegue la scansione del tuo sito Web, esaminando fino a 500 URL su di esso, per stabilirne l'accessibilità. Il test si basa su Lighthouse, uno strumento open source, con un punteggio (da 0 a 100), che indica l'accessibilità tecnica del tuo sito.

Verifica di Accessibilità in Dettaglio

Di seguito puoi trovare una descrizione per ciascuno degli elementi che il nostro Test di Accessibilità esamina.

Navigazione


1.	I valori `[accesskey]` sono univoci Attraverso l'inserimento di una combinazione di tasti, gli utenti possono concentrarsi rapidamente su un aspetto di una pagina. Per una corretta navigazione, ogni chiave di accesso deve essere univoca.
2.	La pagina contiene un titolo, uno skip link o un'area di riferimento Se aggiungi metodi per ignorare contenuti ripetitivi, la navigazione della pagina diventa più efficiente per chi usa la tastiera.
3.	Gli attributi [id] in elementi attivi per cui è possibile impostare lo stato attivo sono univoci Tutti gli elementi per cui è possibile impostare lo stato attivo devono avere un valore `id` univoco per garantirne la visibilità alle tecnologie per la disabilità.
4.	Gli elementi di intestazione vengono visualizzati in ordine decrescente sequenziale Le intestazioni nell'ordine corretto che non saltano livelli descrivono la struttura semantica della pagina, facilitando la navigazione e la comprensione quando vengono usate tecnologie per la disabilità.
5.	Nessun elemento ha un valore [tabindex] maggiore di 0 Un valore maggiore di 0 implica un ordine di navigazione esplicito. Sebbene sia tecnicamente valido, spesso genera un'esperienza frustrante per gli utenti che usano tecnologie di ausilio per la disabilità.

ARIA


1.	*Gli attributi [aria-] corrispondono ai rispettivi ruoli** Ogni elemento `role` di ARIA supporta un determinato sottoinsieme di attributi `aria-`. Se non dovessero corrispondere, gli attributi `aria-` non saranno considerati validi.
2.	L'attributo [aria-hidden="true"] non è presente nel documento <body> Le tecnologie per la disabilità, come gli screen reader, funzionano in modo incoerente se viene impostato il valore `aria-hidden="true"` nel documento `<body>`.
3.	Gli elementi [aria-hidden="true"] non contengono discendenti per cui è possibile impostare lo stato attivo I discendenti per cui è possibile impostare lo stato attivo all'interno di un elemento `[aria-hidden="true"]` impediscono di mettere tali elementi interattivi a disposizione degli utenti che usano tecnologie per la disabilità come gli screen reader
4.	I campi di immissione ARIA hanno nomi accessibili Quando un campo di immissione non ha un nome accessibile, gli screen reader lo descrivono con un nome generico, rendendolo inutilizzabile per gli utenti che si affidano agli screen reader.
5.	*Gli elementi [role] hanno tutti gli attributi [aria-] obbligatori** Alcuni ruoli di ARIA hanno attributi obbligatori che descrivono lo stato dell'elemento agli screen reader.
6.	Gli elementi con un ruolo ARIA [role] che richiedono che gli elementi secondari contengano un ruolo [role] specifico hanno tutti gli elementi secondari obbligatori. Alcuni ruoli principali di ARIA devono contenere specifici ruoli secondari per poter eseguire le funzionalità per l'accessibilità previste.
7.	Gli elementi [role] sono contenuti nei rispettivi elementi principali obbligatori Alcuni ruoli secondari di ARIA devono essere contenuti in specifici ruoli principali per poter eseguire in modo corretto le funzionalità per l'accessibilità previste.
8.	I valori [role] sono validi I ruoli di ARIA devono contenere valori validi per poter eseguire le funzionalità per l'accessibilità previste.
9.	I campi di attivazione/disattivazione ARIA hanno nomi accessibili Quando un campo di attivazione/disattivazione non ha un nome accessibile, gli screen reader lo descrivono con un nome generico, rendendolo inutilizzabile per gli utenti che si affidano agli screen reader.
10.	*Gli attributi [aria-] hanno valori validi** Le tecnologie di ausilio per la disabilità, come gli screen reader, non sono in grado di interpretare gli attributi di ARIA con valori non validi.
11.	*Gli attributi [aria-] sono validi e non contengono errori ortografici** Le tecnologie di ausilio per la disabilità, come gli screen reader, non sono in grado di interpretare gli attributi di ARIA con nomi non validi.
12.	Gli ID ARIA sono univoci Il valore di un ID ARIA deve essere univoco per evitare che altre istanze vengano ignorate dalle tecnologie per la disabilità.

Nomi ed etichette


1.	I pulsanti hanno un nome accessibile Quando un pulsante non ha un nome accessibile, gli screen reader lo descrivono semplicemente come "pulsante", rendendolo inutilizzabile per gli utenti che si affidano agli screen reader.
2.	Il documento ha un elemento <title> Il titolo fornisce agli utenti di screen reader una panoramica della pagina, mentre per gli utenti di motori di ricerca è utile per stabilire se una pagina è attinente alla loro ricerca.
3.	Nessun campo del modulo ha più etichette I campi dei moduli con più etichette potrebbero essere descritti in modo confuso dalle tecnologie per la disabilità come gli screen reader, che usano la prima etichetta, l'ultima o tutte le etichette.
4.	Gli elementi <frame> o <iframe> hanno un titolo Gli screen reader si affidano ai titoli dei frame per descrivere i contenuti dei frame agli utenti.
5.	Gli elementi immagine hanno attributi [alt] Gli elementi informativi dovrebbero mostrare testo alternativo breve e descrittivo. Gli elementi decorativi possono essere ignorati con un attributo alt vuoto.
6.	Gli elementi <input type="image"> hanno testo [alt] Quando viene utilizzata un'immagine come pulsante <input>, fornire del testo alternativo può aiutare gli utenti di screen reader a comprendere lo scopo del pulsante.
7.	Gli elementi del modulo sono associati a etichette Le etichette consentono di assicurarsi che i comandi dei moduli vengano descritti in modo corretto dalle tecnologie di ausilio per la disabilità, come gli screen reader.
8.	I link hanno un nome distinguibile Un testo dei link (incluso il testo alternativo delle immagini, se usate come link) distinguibile, univoco e per cui sia impostabile lo stato attivo migliora l'esperienza di navigazione per gli utenti di screen reader.
9.	Gli elementi <object> hanno testo [alt] Gli screen reader non possono tradurre contenuti non testuali. Aggiungere testo alternativo agli elementi <object> aiuta gli screen reader a comunicare il significato agli utenti.

Contrasto


1.	Il rapporto di contrasto tra i colori di sfondo e primo piano è sufficiente Il testo a basso contrasto è difficile, se non impossibile, da leggere per molti utenti.

Tabelle ed elenchi


1.	Gli elementi <dl> contengono solo gruppi <dt> e <dd> ed elementi <script>, <template> o <div> nell'ordine corretto Se il markup degli elenchi di definizioni non è stato eseguito in modo corretto, gli screen reader possono generare risultati ambigui o imprecisi.
2.	Gli elementi dell'elenco di definizioni sono aggregati negli elementi <dl> Gli elementi dell'elenco di definizioni (<dt> e <dd>) devono essere aggregati in un elemento `<dl>` principale affinché gli screen reader possano descriverli correttamente.
3.	Gli elenchi contengono solo elementi <li> ed elementi che supportano gli script (<script> e <template>) Gli screen reader descrivono gli elenchi in un determinato modo. Una struttura dell'elenco corretta agevola il compito dello screen reader.
4.	Gli elementi dell'elenco (<li>) sono contenuti in elementi principali <ul> o <ol> Gli screen reader richiedono che gli elementi dell'elenco (<li>) siano contenuti in un elemento <ul> o <ol> principale per poterli descrivere in modo corretto.
5.	Le celle in un elemento <table> che utilizzano l'attributo [headers] fanno riferimento a celle della stessa tabella Gli screen reader sono dotati di funzionalità che semplificano lo spostamento nelle tabelle. Se ti assicuri che le celle `<td>` che usano l'attributo `[headers]` facciano riferimento esclusivamente ad altre celle nella stessa tabella puoi migliorare l'esperienza degli utenti di screen reader.
6.	Gli elementi <th> e gli elementi con ruolo [role="columnheader"/"rowheader"]` hanno le celle di dati da essi descritte. Gli screen reader sono dotati di funzionalità che semplificano lo spostamento nelle tabelle. Se ti assicuri che le intestazioni delle tabelle facciano sempre riferimento a un insieme di celle puoi migliorare l'esperienza degli utenti di screen reader.

Migliori pratiche


1.	Il documento non usa <meta http-equiv="refresh"> L'aggiornamento automatico della pagina è un evento imprevisto per l'utente e, una volta verificatosi, imposta di nuovo lo stato attivo sulla parte superiore della pagina. Ciò può costituire motivo di frustrazione o confusione per l'utente.
2.	[user-scalable="no"] non viene usato nell'elemento <meta name="viewport"> e l'attributo [maximum-scale] non è inferiore a 5 Disattivare lo zoom è problematico per gli utenti ipovedenti che si affidano all'ingrandimento dello schermo per vedere in modo chiaro i contenuti di una pagina web.

Audio e video


1.	Gli elementi <video> contengono un elemento <track> con [kind="captions"] Se un video ha i sottotitoli, per i non udenti o gli utenti con problemi di udito è più facile accedere alle relative informazioni.

Internazionalizzazione e localizzazione


1.	L'elemento <html> ha un attributo [lang] Se per una pagina non viene specificato alcun attributo lang, lo screen reader presuppone che la lingua della pagina sia quella predefinita scelta dall'utente durante la configurazione dello screen reader. Se la lingua della pagina non è effettivamente quella predefinita, lo screen reader potrebbe non pronunciare correttamente il testo della pagina.
2.	L'attributo [lang] dell'elemento <html> ha un valore valido La specifica di una lingua BCP 47 valida consente agli screen reader di pronunciare correttamente il testo.
3.	Gli attributi [lang] hanno un valore valido La specifica di una lingua BCP 47 valida per gli elementi consente di assicurarsi che il testo sia pronunciato correttamente dallo screen reader.

Top Website Builder 2024

Sponsorizzato

da 0,00 €

al mese

Wix

9,9

Recensione

molto buono

da 11,00 €

al mese

Squarespace

9,4

Recensione

molto buono

da 0,00 €

al mese

Webflow

8,8

Recensione

buono

da 0,00 €

al mese

Strikingly

8,3

Recensione

buono

mostra tutto

Autore: Janis von Bleichert

Janis von Bleichert ha studiato informatica aziendale al TU di Monaco e informatica al TU di Berlino, Germania. Lavora in proprio dal 2006 ed è co-fondatore di DIGITALE.co. Scrive di hosting, software e sicurezza informatica.

Scopri di Più

Strumenti sito web