Share
Idealmente, l'accessibilità dovrebbe essere considerata parte di ogni progetto web al fine di aumentare la disponibilità al pubblico più ampio possibile. Nel mondo reale, tuttavia, può essere facilmente trascurato. In questo articolo vedremo modi semplici per migliorare l'accessibilità del tuo sito senza dover apportare modifiche drastiche o dispendiose in termini di tempo.
"Sfortunatamente, la potenza e l'adattabilità del Web non sono sempre pienamente utilizzate"
Il World Wide Web è una risorsa incredibile e ha aperto nuove eccitanti possibilità. Molte più persone sono ora in grado di accedere a informazioni e intrattenimento precedentemente non disponibili per loro attraverso le tradizionali forme di media. Il World Wide Web è particolarmente significativo per le persone con disabilità poiché la grande quantità di informazioni digitali memorizzate può essere manipolata per soddisfare requisiti diversi. Sfortunatamente, la potenza e l'adattabilità del Web non sono sempre pienamente utilizzate e le persone con disabilità possono trovare difficoltà a navigare nei siti Web e avere un'esperienza negativa con il Web in generale.
Ci sono numerosi motivi per cui dovresti mirare a migliorare l'accessibilità del tuo sito, uno dei quali è che è la legge in molti paesi. Nel Regno Unito, ad esempio, l'accessibilità alla rete rientra nella Legge sulla Discriminazione della Disabilità e, se il tuo sito web non viene rispettato, un'azione legale potrebbe essere intentata contro di te. Tuttavia, a parte questioni legali, perché non vorreste aprire il vostro sito al pubblico più ampio possibile rendendolo accessibile a tutti?
La Web Accessibility Initiative (WAI) è stata creata dal W3C per promuovere l'accessibilità sul web. Il WAI tenta di educare le persone su come le persone con disabilità usano il Web e ha creato linee guida per i web designer e gli sviluppatori da seguire. Scoprirai che molte delle linee guida sono facili da seguire e implementare. Di seguito discuteremo alcuni semplici metodi che ti aiuteranno a soddisfare queste linee guida e migliorare l'accessibilità del tuo sito.
Si stima che circa dieci milioni di uomini soffrano di una qualche forma di cecità ai colori negli Stati Uniti. I tipi più comuni sono la protanopia e la deuteranopia; e quelli che soffrono di questi hanno difficoltà a distinguere tra i colori rosso, verde e simili. Con una tale alta prevalenza di questa condizione, vale davvero la pena considerare quando si progetta e si codifica il tuo sito web.
Per la maggior parte, non ci sono misure radicali che devono essere prese quando si progetta con il daltonismo in mente - come nel caso della maggior parte dei suggerimenti in questo articolo. Un sito web ben progettato in genere non causerà grandi problemi agli utenti daltonici. Vale la pena prendere in considerazione, tuttavia, quando si progettano elementi interattivi o call-to-action. Per esempio; un semplice link di testo, in stile rosso senza altre decorazioni potrebbe essere impossibile vedere se si trova all'interno di un blocco di testo grigio o nero. Nessuno sta suggerendo che è necessario attenersi allo stile di collegamento predefinito, ma è utile utilizzare più di un tipo di decorazione, ad esempio una sottolineatura o un colore di sfondo.
Uno strumento utile per i progettisti può essere trovato su colorfilter.wickline.org che fornisce diversi filtri diversi che imitano il modo in cui i diversi tipi di utenti daltonici percepirebbero un sito web. Basta digitare l'URL di un sito Web e selezionare il filtro che si desidera utilizzare: richiede un po 'di tempo per essere caricato, quindi è necessario essere pazienti.
Vale anche la pena prendere in considerazione il livello di contrasto tra gli elementi di primo piano e di sfondo del tuo sito web. Un alto livello di contrasto andrà a vantaggio di tutti, non solo di quelli con problemi alla vista. Le linee guida sull'accessibilità del Web suggeriscono un rapporto di contrasto minimo di 4,5: 1 e un rapporto ideale di 7: 1 per il corpo del testo di dimensioni standard. Ovviamente l'opzione più sicura è sempre il testo nero su sfondo bianco o viceversa.
È possibile controllare il rapporto di contrasto di più elementi su un sito utilizzando l'estensione Firefox di Color Contrast Analyzer di Juicy Studio. Analizzerà ogni elemento della pagina e fornirà un rapporto sulla conformità o meno alle linee guida del WAI.
Coloro che utilizzano screen reader avranno spesso la possibilità di navigare in una pagina Web saltando attraverso i link per trovare qualcosa di interessante. Nel caso di collegamenti testuali, l'utente ascolta semplicemente la parola in isolamento, indipendentemente dal contenuto che la circonda. È quindi estremamente inutile quando tutto ciò che l'utente sente è "clicca qui" o "altro" - questi tipi di collegamenti non forniscono informazioni su dove indirizzano l'utente o su cosa si riferiscono a.
Un'opzione molto migliore è fornire un link più descrittivo. Un link che porta l'utente all'articolo completo di un blog potrebbe leggere "ulteriori informazioni su S.E.O" o "fai clic qui per l'articolo completo su S.E.O".
Uno dei principi fondamentali della Web Accessibility Initiative è rendere i contenuti disponibili sul web accessibili a tutti, indipendentemente da eventuali disabilità che possono avere. Ci sono un certo numero di tecniche, come quelle discusse in questo articolo, che aiuteranno l'obiettivo del WAI. Ci saranno sempre comunque alcuni tipi di contenuti che non possono essere resi accessibili ad alcuni utenti, come l'audio a coloro che sono sordi. In questo scenario, dovresti sempre fornire contenuti alternativi laddove possibile.
Linea guida 1.1 per l'accessibilità del contenuto Web:
Fornire alternative testuali per qualsiasi contenuto non di testo in modo che possa essere modificato in altre forme, come ad esempio caratteri grandi, Braille, simboli o linguaggio più semplice.
Ad esempio, se hai un video di un'intervista sul tuo sito, potresti considerare di includere una trascrizione della conversazione per gli utenti da scaricare o leggere sul sito. Un altro metodo consiste nell'aggiungere didascalie al video, un metodo che YouTube sta sperimentando utilizzando il software di riconoscimento vocale.
Un approccio ancora più completo consiste nel fornire un collegamento a una versione di solo testo del tuo sito web. Questo metodo renderà il tuo sito molto più accessibile a quelli con connessioni Internet lente come quelli che usano ancora una connessione dial-up o che stanno cercando un dispositivo mobile.
L'indice delle tabulazioni stabilisce fondamentalmente l'ordine degli elementi che un utente passa ciclicamente quando usa il tasto 'Tab'. Nella maggior parte dei casi, se il design di una pagina segue un ordine logico e stabilisce una gerarchia forte utilizzando intestazioni, sottotitoli ecc., Non è necessario preoccuparsi troppo di ciò. È con l'uso delle forme che questa funzione è davvero preziosa.
I moduli possono incorporare molti piccoli elementi come caselle di controllo e pulsanti di opzione che possono richiedere movimenti e clic precisi del mouse. Qualcuno con una disabilità motoria potrebbe non avere il controllo necessario per eseguire azioni così precise. Con un indice di tabulazione corretto, un utente sarà in grado di scorrere e interagire con ogni elemento del modulo usando semplici pressioni sulla tastiera. Un indice Tab andrà a beneficio anche di coloro che non hanno accesso a un mouse e si affidano esclusivamente all'utente di una tastiera per navigare in un sito web.
Sappiamo tutti del testo alternativo. È quel testo che dobbiamo aggiungere alle immagini affinché il nostro sito possa essere validato. Tutti li usano giusto? In realtà ci sono molti siti web che non lo fanno e quelli che li usano spesso non correttamente. Di fatto, c'è un ampio dibattito sull'uso corretto dell'attributo alt.
L'attributo alt ha tre scopi principali:
"La verità è che il testo alternativo per le immagini dipende dal contesto in cui è collocato"
In sostanza, il testo alternativo è l'equivalente testuale di un'immagine o di un'altra fonte multimediale e viene utilizzato quando l'immagine non è accessibile per vari motivi. Quindi quali informazioni usiamo esattamente per l'attributo alt? Alcune persone posizionano descrizioni dettagliate dell'immagine mentre altre lo caricano con parole chiave nel tentativo di aiutare il loro posizionamento nella ricerca. La verità è che il testo alternativo per le immagini dipende dal contesto in cui è collocato.
Ad esempio, è comune che un'immagine pertinente accompagni un post sul blog, come una macchina da scrivere per un articolo sulla scrittura freelance. L'articolo non fa alcun riferimento all'immagine, quindi è abbastanza superfluo. Alcune persone possono attribuire l'attributo alt al valore di 'macchina da scrivere' o 'immagine di una macchina da scrivere' o forse darebbero il valore del titolo dell'articolo. Tuttavia, tutti questi metodi sono sbagliati. Vediamo perché.
In primo luogo, dobbiamo immaginare che non possiamo vedere l'immagine. Quindi, se il valore dell'attributo alt fosse "macchina da scrivere", vedremmo il titolo del post del blog, la parola "typewriter" da sola e il testo principale dell'articolo - questo non ha senso se visto come testo e sarebbe ancora più confuso se si stesse usando uno screen reader e si sentisse casualmente "macchina da scrivere".
Come regola generale, è meglio non usare frasi come "un'immagine di" o "un'immagine di" quando si forniscono valori di attributo alt. L'attributo alt andrà a beneficio solo di chi non può vedere l'immagine per vari motivi, quindi dire a questi utenti che c'è un'immagine non offre alcun valore reale oltre a chiarire parte della confusione causata dal metodo precedente.
Infine, attribuendo l'attributo alt al valore del titolo del post del blog, il titolo verrà visualizzato due volte come testo o ripetuto due volte quando si utilizzano screen reader. Il testo alternativo non dovrebbe ripetere alcuna informazione che è già fornita come testo, è semplicemente inutile e potenzialmente confusa.
L'opzione migliore in questo scenario è semplicemente quella di fornire un valore di attributo alt vuoto. Un valore vuoto garantisce che non vengano comunicate informazioni potenzialmente confuse o irrilevanti e non vi è alcun pregiudizio alla comprensione dell'articolo in quanto l'immagine non è essenziale per questo. Alcuni potrebbero obiettare che dal momento che l'immagine è puramente estetica, quindi non è contenta e quindi non appartiene all'HTML e dovrebbe essere visualizzata usando i CSS, tuttavia ci sono opinioni differenti su questo.
Come puoi vedere, fornire valori di attributo alt corretti può essere complicato e dipende molto dalla situazione. Il miglior consiglio è di valutare ogni scenario individualmente, decidendo se l'immagine è necessaria per comprendere e usare il tuo miglior giudizio.
Come gli indici delle schede, le chiavi di accesso sono una funzionalità preziosa per gli utenti che si affidano a una tastiera per navigare in un sito Web. Sfortunatamente, Access Keys è uno degli elementi HTML meno utilizzati, principalmente perché molte persone non ne sono a conoscenza e coloro che scelgono di non implementarli nonostante siano estremamente semplici.
Le Access Key sono fondamentalmente scorciatoie da tastiera che aiutano un utente della tastiera a navigare rapidamente in determinate sezioni di un sito web. Le chiavi di accesso possono essere utilizzate tenendo premuto un tasto funzione (in genere Alt su Windows o Ctrl su Mac) e premendo una lettera o un tasto numerico specifico corrispondente a una sezione del sito.
Come accennato in precedenza, Access Keys è incredibilmente semplice da implementare. Tutto ciò che comporta è un semplice codice HTML aggiunto ai tag di ancoraggio di navigazione del tuo sito -
Casa
Semplice.
Un problema con Access Keys è che non esiste un set universale di chiavi assegnate che gli utenti possano aspettarsi di essere utilizzate e combinato con nessun reale standard di informazione degli utenti di quelli che sono stati effettivamente utilizzati, i risultati in Access Keys sono piuttosto inefficaci.
Tuttavia, il governo del Regno Unito dispone di una serie di Access Key raccomandate da assegnare, che sono le seguenti:
Come puoi vedere, molti dei metodi sopra descritti sono molto facili da implementare e richiedono solo una conoscenza di base dell'HTML. Rendere il tuo sito web più accessibile non richiede tempo, richiede modifiche massicce o pregiudica il fascino di un sito web.
Credo che sia importante per i progettisti e gli sviluppatori essere informati sull'accessibilità e considerarlo nelle varie fasi della costruzione di un sito web. Quanto prima nel processo di progettazione si dedica all'attenzione e al pensiero dell'accessibilità, tanto più facile sarà l'integrazione di questi metodi e il raggiungimento di risultati migliori.
È anche importante ricordare che la maggior parte dei metodi sopra descritti non solo aiuterà le persone con disabilità, ma favorirà tutti gli utenti del tuo sito web. Alcuni dei suggerimenti potrebbero anche migliorare il tuo posizionamento con i motori di ricerca.
Abbiamo discusso solo alcuni suggerimenti che renderanno il tuo sito Web più accessibile, ma se sei veramente impegnato, potresti voler verificare come puoi conformarti alla lista completa delle Linee guida per l'accessibilità ai contenuti web..
Accentsconagua