Pochi modi per rendere il tuo sito facilmente accessibile

Pubblicato: 2017-02-15

La strutturazione di una pagina e delle sue risorse la rende adeguatamente adatta alle macchine, qualunque essa sia. Aggiungi il tipo di tecniche di buon senso che consentono agli utenti (inclusi gli utenti con disabilità) e alle macchine di accedere direttamente a contenuti significativi e sicuramente ti stai muovendo per rendere il tuo sito facilmente accessibile e compatibile con i motori di ricerca.

Conosciamo tutti la potenza di WordPress che consente a un principiante oa una persona non tecnica di progettare e sviluppare la propria proprietà web. Questa piattaforma è semplice da configurare e fornisce una solida struttura per i temi e i plug-in che determineranno come andranno avanti i tuoi contenuti e le tue funzionalità per qualsiasi visitatore.

Se vuoi che il tuo sito sia accessibile alle persone con disabilità, scoprirai che WordPress di base ha molto di ciò che è necessario per facilitare lo sviluppo di un sito web accessibile, e non è difficile andare oltre attraverso l'aggiunta di plugin e buoni tecnica.

Prima di iniziare, ci sono due fattori importanti di cui essere consapevoli. In primo luogo, l'attuazione di queste quattro tecniche da sole non renderà alcun sito Web totalmente accessibile a tutti nella misura in cui soddisfi tutti i requisiti necessari, ma affronterà le barriere più comuni all'accesso al Web e garantirà un'accessibilità molto maggiore.

In secondo luogo, è importante capire che l'accessibilità può essere raggiunta solo attraverso la cooperazione di progettazione, sviluppo e migliori pratiche di creazione di contenuti. Un designer può progettare un tema accessibile, uno sviluppatore può aggiungere funzionalità accessibili, ma se un autore di contenuti inserisce un'immagine significativa senza un alt tag, il significato completo della pagina web sarà inaccessibile.

Con questo in mente, ecco quattro suggerimenti per rendere il tuo sito facilmente accessibile.

Testo alternativo per le tue immagini

È risaputo che il più grande ostacolo all'accessibilità al web è l'uso corretto del testo alternativo per descrivere le immagini su una pagina web. Se questo singolo punto fosse affrontato da tutti coloro che creano siti web, eliminerebbe il maggior numero di reclami sull'accessibilità. E questo è il motivo per cui abbiamo sentito il bisogno di sviluppare un fantastico plugin SEO Image Optimizer, che colma il divario dei tag alt mancanti sulle immagini.

Il punto fondamentale da capire è che se hai intenzione di inserire immagini sul tuo sito, è fondamentale etichettarle correttamente con alt text. In altre parole, ogni immagine che metti online deve avere un significato affinché il robot possa elencare la tua immagine sui motori di ricerca.

Le informazioni nel tag alt consentono agli utenti di lettori di schermo (che leggono le pagine Web ad alta voce per utenti con disabilità visive), browser di solo testo e connessioni lente che non caricano le immagini di comprendere le informazioni veicolate dalle immagini.

Se un'immagine non ha significato, ad esempio è usata puramente per la decorazione, ci sono due modi per affrontarla. Se la carichi come immagine di sfondo usando CSS, gli screen reader la ignoreranno e l'immagine non richiede un alt tag (attenzione, perché questo vale anche per le immagini significative: se la carichi in background, lo screen reader la ignorerà ). Se un'immagine viene visualizzata utilizzando HTML ma è puramente decorativa, utilizzare il tag alt ma lasciarlo vuoto. Questo dice allo screen reader che un'immagine è presente ma non ha significato per l'utente e può essere ignorata, il che consente di rendere il tuo sito più accessibile per un lettore

Quando metti un'etichetta sulle tue immagini, usa del testo descrittivo che consentirà alle persone che non possono vedere di capire qual è il significato dell'immagine. Ciò richiede giudizio: perché l'immagine è stata qui e quale messaggio trasmette e quali parole trasmettono meglio lo stesso significato. Non lasciarti coinvolgere dalle descrizioni letterali di ogni dettaglio visivo, comunicane il significato.

Un classico esempio è l'immagine di una lente d'ingrandimento utilizzata come pulsante per avviare una ricerca. L'immagine ha un significato, quindi dovrebbe essere descritta. Descriverlo come "una lente d'ingrandimento" non aiuta l'utente. Quello che devono sapere è che facendo clic su questo pulsante verrà avviata una ricerca, quindi il testo alternativo "fai clic qui per cercare" o anche solo "cerca" potrebbe essere più appropriato.

Solo le immagini che servono a uno scopo devono essere etichettate. Esempi di questi sono i seguenti:

Immagini utilizzate come pulsanti

Immagini che vengono utilizzate come collegamenti

Immagini che vengono utilizzate per qualsiasi altro controllo

Immagini che si riferiscono direttamente al contenuto

Questa tecnica si applica a tutti i siti Web, ovviamente, non solo ai siti WordPress. WordPress, tuttavia, lo rende più semplice della maggior parte, in primo luogo consentendo all'autore del contenuto di passare dalla visualizzazione visiva a quella HTML e, in secondo luogo, fornendo un campo per il testo alternativo ogni volta che viene inserita un'immagine utilizzando la funzionalità Aggiungi media.

Plugin per una migliore accessibilità

L'accessibilità di WordPress può essere migliorata utilizzando una varietà di plugin. Questi plugin sono facili da configurare e consentiranno agli utenti con una vasta gamma di disabilità di accedere al sito. Ecco alcuni plugin che ho trovato che renderanno il tuo sito facilmente accessibile.

Chiavi di accesso

Il plug-in Access Keys consente di assegnare chiavi di accesso a collegamenti e controlli sul tuo sito web. Ad esempio, al collegamento principale può essere assegnata la combinazione di tasti di accesso alt+h e al pulsante di ricerca può essere assegnata la combinazione di tasti alt+s. Le chiavi di accesso, come gli esempi forniti, consentono agli utenti ipovedenti ea quelli con problemi di mobilità di accedere facilmente a ciò che desiderano.

Retweet facile

Easy Retweet è un plugin che ti permetterà di aggiungere pulsanti accessibili alla tua pagina che facilitano la condivisione dei tuoi contenuti su Twitter. In questo modo, se le persone con disabilità desiderano condividere le tue pagine con i loro amici, possono farlo senza alcuna difficoltà.

AstickyPost OrderER

AstickyPostOrderER ti consente di scegliere l'ordine in cui visualizzare i tuoi contenuti. Puoi scegliere di visualizzare il contenuto dal meno recente al più recente o nell'ordine inverso.

Sommario SEO Hackadelic

Il plug-in Hackadelic SEO Table of Contents ti consente di fornire un sommario per i tuoi post o le tue pagine. Questo renderà i tuoi contenuti facili da trovare.

WP-Sondaggi

WP-Polls consente alle persone con disabilità di partecipare a tutti i sondaggi che potresti avere sul tuo sito

Nuovi plugin vengono sviluppati continuamente. Usa la funzionalità dashboard di WordPress per cercare di più. Prova diversi plugin e chiedi ai tuoi utenti con disabilità di darti un feedback

Quando utilizzi qualsiasi plug-in, assicurati che i plug-in utilizzati siano compatibili con il tema scelto e tra loro. Se i tuoi plugin non sono compatibili con il tuo tema, non funzioneranno o causeranno più problemi agli utenti disabili che tentano di navigare nel tuo sito. Se i tuoi plug-in non sono compatibili tra loro, il tuo sito potrebbe essere reso inutilizzabile o il contenuto potrebbe essere visualizzato in modo errato.

Strada da percorrere con le intestazioni

Quando si progettano le pagine, è fondamentale strutturare il contenuto utilizzando i titoli nell'ordine corretto: <h1> , <h2> , <h3> e così via. Quando strutturi il contenuto utilizzando le intestazioni, le persone che utilizzano le utilità per la lettura dello schermo possono ottenere un riepilogo di cosa trattano le pagine e navigarle più facilmente. Gli utenti di screen reader possono accedere alle sezioni di contenuto desiderate premendo la lettera "H" per andare avanti e "shift+H" per tornare indietro.

Puoi etichettare i tuoi contenuti utilizzando i titoli da uno a sei per rendere il tuo sito facilmente accessibile. Verifica in che modo il tuo tema utilizza i titoli (ad esempio, il tuo tema può o meno applicare <h1> al titolo del sito e quel titolo del sito può apparire o meno su ogni pagina web. In ogni caso, assicurati che il primo titolo utilizzato sia <h1> e le intestazioni seguenti (titolo di pagina, sottosezioni di pagina, intestazioni di paragrafo) scendono nell'ordine fino a <h6> , ove appropriato.

C'è una certa flessibilità nell'ordinamento, ma l'opzione più sensata è mantenere i titoli in ordine numerico e non confonderli in quanto creerà una situazione pericolosa sia per l'utente che per un motore di ricerca (non mescolarli in questo modo - > <h1> , <h4> , <h2> , ecc.).

I link di navigazione sono utili

Infine, è necessario disporre di collegamenti di navigazione nel design del sito. Questi collegamenti di navigazione consentiranno agli utenti con disabilità di saltare oltre la barra di navigazione o altri menu e caselle di ricerca e passare a determinati punti della pagina facendo clic su questi collegamenti. Oppure, l'utente può passare rapidamente alle sezioni desiderate del sito. Questi collegamenti devono apparire ovunque sia necessario per consentire agli utenti di passare a contenuti significativi. Esempi di ciò che possono dire questi collegamenti sono:

Salta al contenuto principale

Vai alla barra di navigazione

Vai alla ricerca

Alcuni temi WordPress potrebbero già fornire tali collegamenti. Se questo è il caso, dovrai controllare questi link per vedere se devi aggiungere qualcuno di tuo. Altri temi, tuttavia, non forniranno collegamenti di navigazione. Pertanto, dovrai aggiungere tu stesso questi collegamenti.

Avvolgendo

Ripeterò ciò che ho detto prima che nessuno di questi passaggi ti garantisce un sito Web accessibile al 100%, ma sì, aumenterà l'accessibilità del tuo sito per ogni visitatore che visita il tuo sito e il tuo sito è più accessibile del 90% dei siti Web WordPress disponibili .

I visitatori con disabilità potranno navigare nel tuo sito proprio come gli altri visitatori. Poiché questi visitatori includono anche robot di ricerca, dovresti essere certo di una cosa che rendere il tuo sito accessibile andrà anche a vantaggio della tua attività e ti aiuterà a posizionarti in cima ai motori di ricerca, con conseguente maggiore profitto dalla tua attività.

Spero che questo post sul blog ti sia stato utile e che tu stia prendendo alcuni elementi chiave da qui che prenderai