Accessibilità digitale per gli esperti di marketing Parte 2: esperienza utente e siti Web
Pubblicato: 2022-06-16Nel primo post di questa serie sull'accessibilità digitale, abbiamo toccato i "cosa e perché" dell'accessibilità per i professionisti del marketing. Ora è il momento dei "come".
Tieni presente che abbiamo intenzionalmente limitato i nostri consigli a quegli elementi che sono abbastanza facili da implementare e sono rilevanti per i marketer. Questa serie non è affatto un elenco completo di tutti gli standard di cui le aziende devono essere a conoscenza quando si tratta di contenuti accessibili. Se stai cercando di conoscere il nocciolo della questione delle linee guida sull'accessibilità e dei criteri WCAG, dai un'occhiata al programma di e-learning TGPi. È un'opzione di autoapprendimento che puoi utilizzare per mantenere fresche le tue abilità o aggiornarti sulle tecniche e le migliori pratiche di accessibilità.
Passiamo ai consigli!
Accessibilità ed esperienza utente
Un'esperienza utente fluida e senza sforzo è la stella polare per ogni marketer. La facilità con cui un individuo può completare un'attività critica e quanto bene il contenuto soddisfi le aspettative ha un forte impatto su di esso e farà o distruggerà i tuoi sforzi di marketing.
Ha senso, vero? Se desideri acquistare qualcosa online e riscontri un problema nel tentativo di inserire i dati della tua carta di credito, o se l'articolo che volevi è esaurito, la qualità della tua esperienza utente precipiterà. Primo, perché non sei stato in grado di realizzare ciò che ti eri prefissato, e in secondo luogo, perché ti aspettavi di poterlo realizzare, ma non era nelle carte. Questo doppio smacco ti assicurerebbe quasi sicuramente che non tornerai su quel particolare sito web!
In qualità di marketer, sei ben in sintonia con l'importanza di un'esperienza utente superiore. Potresti anche testarlo (buon per te!) O disporre di analisi per misurarlo. Queste misure sono fondamentali per ottimizzare la canalizzazione di marketing. Tuttavia, ciò che potresti non fare è testare l'accessibilità dell'esperienza utente. (Se non lo sei, nessun giudizio! Ecco cosa intende cambiare questa serie di post.)
Percorsi degli utenti
Un percorso utente (altrimenti noto come flusso utente o percorso utente) è una sequenza di azioni che un utente esegue sul tuo sito. Un percorso utente critico è in linea con l'obiettivo principale del tuo sito, come completare un acquisto, inviare un modulo, guardare un video, leggere un post, ecc.
Dovresti sempre dare la priorità alla correzione dell'accessibilità per i tuoi viaggi utente essenziali per diversi motivi.
Innanzitutto, sebbene tu possa avere contenuti straordinari in tutto il tuo sito, se un utente non riesce a completare il suo obiettivo principale per visitare il tuo sito Web, quello è un cliente che hai perso per sempre.
In secondo luogo, molte persone con disabilità sono purtroppo abituate a incontrare sfide quando fanno cose che altre persone danno per scontate. In genere li aspettano, poiché gran parte del mondo non è stato creato pensando alle loro particolari disabilità.
In media, è improbabile che problemi di accessibilità minori sui contenuti tangenziali non li vanifichino al punto da avviare un'azione legale. Ma se non sono in grado di fare l' unica cosa che sono venuti a realizzare sul tuo sito web, ti apri a un grande vecchio rischio legale, specialmente se sei un marchio con sede negli Stati Uniti.
Testare i percorsi utente critici
Quindi, come testare l'accessibilità dei flussi utente critici? Se si opta per il percorso manuale, è possibile condurre test utente con persone con disabilità o ispezionare il codice per ogni passaggio utilizzando uno strumento come ARC Toolkit di TPGi (ne parleremo più avanti) per identificare gli errori WCAG.
Sebbene il test manuale sia in definitiva più completo, se stai cercando di identificare immediatamente gli errori di accessibilità nei percorsi utente critici, puoi utilizzare la funzione Flussi utente di ARC Monitoring per scansionare automaticamente ogni componente per l'accessibilità. Puoi includere tutti i componenti e le interazioni dinamiche di un percorso dell'utente, dalle immagini alle finestre di dialogo, per la scansione, e sarai in grado di tenere traccia degli errori nel tempo per migliorare i tuoi processi di riparazione interni.
Puoi associare le informazioni acquisite dal monitoraggio dei flussi utente di ARC con gli altri tuoi strumenti di analisi, come Google Analytics Funnel e Obiettivi, per identificare gli ostacoli che impediscono agli utenti di completare l'azione desiderata.
Siti web accessibili
Un sito web è il negozio digitale o l'ufficio della tua azienda. Potrebbe essere la prima (o l'unica) impressione che un potenziale cliente ottiene della tua azienda, quindi ti consigliamo di renderla il più attraente possibile. Forse hai qualche video, o molte immagini per spezzare la monotonia, o pagine su pagine di preziosi contenuti del blog. Queste sono tutte risorse straordinarie che i marketer possono sfruttare per convincere le persone ad acquistare i loro prodotti.
Garantire che tutti questi contenuti siano accessibili può sembrare scoraggiante, ma molte delle migliori pratiche per contenuti accessibili sono indistinguibili dalle migliori pratiche di marketing. Continuate a leggere per saperne di più:
Testo descrittivo del collegamento
Ogni buon marketer sa che la chiarezza è essenziale per una comunicazione eccellente. Se abbellisci la tua copia con parole lanuginose e dal suono importante (ma alla fine prive di significato), il tuo messaggio andrà perso. Allo stesso modo, se sei troppo scarso con le tue spiegazioni, un cliente potrebbe non avere abbastanza informazioni per capire cosa stai dicendo loro.
Il contenuto di alta qualità è un equilibrio tra questi due estremi e non sorprende che il link o il testo di ancoraggio seguano queste stesse regole. Il miglior testo di collegamento dà all'utente un'idea di cosa aspettarsi una volta cliccato. Il testo descrittivo del collegamento è particolarmente critico per la tua copia di invito all'azione. Cosa prepara meglio l'utente a ciò che incontrerà quando farà clic: "Clicca qui" o "Scarica il nostro whitepaper"? Ovviamente quest'ultimo! (Se hai scelto il primo, potresti prendere in considerazione un nuovo percorso professionale.)
Non c'è bisogno di consacrare la tua CTA con parole alla moda ("Scarica il white paper più grande del mondo sulla magia di Harry Houdini!"), ma è fondamentale far sì che le persone sappiano in cosa si stanno cacciando.
Perché il testo del collegamento è così importante per l'accessibilità? In primo luogo, aiuta molto le persone non vedenti o ipovedenti con lo scrematura del contenuto della pagina. (Questo vale anche per le persone con una vista impeccabile.) Gli utenti con disabilità visive utilizzano una gamma di tecnologie assistive per accedere ai contenuti digitali, come strumenti di ingrandimento dello schermo per persone ipovedenti e lettori di schermo per non vedenti. Come suggerisce il nome, uno screen reader legge letteralmente ciò che è sullo schermo.
Tuttavia, i lettori di schermo come JAWS consentono agli utenti di saltare tutto lo schermo, leggendo vari componenti invece di esaminare tutto l'HTML dall'alto verso il basso. Quando un utente passa da un componente all'altro, l'utilità per la lettura dello schermo legge solo il testo di ancoraggio per i collegamenti, non la copia circostante. Ciò significa che se tutti i tuoi collegamenti sono la stessa copia "fai clic qui", un utente di screen reader non avrà idea di cosa accadrà se seguirà quel collegamento; sono costretti a esplorare il contenuto circostante per capire a cosa si riferisce quel collegamento.
Inoltre, le utilità per la lettura dello schermo consentono agli utenti di aprire un "elenco di collegamenti", che consente loro di accedere rapidamente a tutti i collegamenti su una pagina Web. Questo è uno scenario comune in cui il testo del collegamento verrà letto fuori dal contesto circostante e in cui cose come "fare clic qui" diventano un problema reale.
Testo alternativo per le immagini
Il testo alternativo, o "testo alternativo", descrive le immagini del tuo sito Web in modo che un utente di screen reader possa avere un'idea più completa del contenuto di ciascuna pagina Web. Se hai scelto immagini che fungono da spiegazione visiva, le persone che non possono vederle rimarranno perse se rinunci al testo alternativo.
Tuttavia, se hai incluso immagini per motivi puramente estetici (forse ti piacciono davvero le immagini di persone curve sui computer) e ne hai molte, potresti non voler aggiungere testo alternativo per tutte. Le utilità per la lettura dello schermo leggeranno tutto il testo alternativo per ogni immagine, il che, se il testo non aggiunge attivamente valore all'esperienza, può essere fastidioso. Se un'immagine può essere considerata decorativa e non aggiunge alcun significato/comprensione aggiuntivo al contenuto della pagina, allora dovrebbe essere nascosta alla tecnologia assistiva fornendo un attributo alt vuoto.
Siti web ben strutturati
Utilizza i tag di intestazione in modo appropriato in modo che sia i lettori ipovedenti che quelli non ipovedenti possano scorrere la pagina e ottenere una comprensione di base del contenuto e navigarla facilmente. Segui le best practice per le intestazioni, come iniziare ogni pagina con un H1 che descrive il contenuto della pagina, quindi utilizzare H2 e H3 come sottotitoli. Usa intenzionalmente i tag di intestazione; non scaglionarli casualmente senza pensare alla struttura.
Sebbene tu possa differenziare i titoli attraverso mezzi visivi attraverso lo stile CSS, gli utenti di screen reader non hanno il lusso di vedere queste distinzioni. È particolarmente importante utilizzare layout di pagina ben formattati per garantire che gli utenti con problemi di vista possano consumare facilmente i tuoi contenuti.
Riduci al minimo i paragrafi densi, usa frasi più brevi quando puoi ed evita di usare gergo o gergo. Una copia più chiara e concisa aiuterà gli utenti con disabilità cognitive a comprendere meglio i tuoi contenuti e aiuterà anche a ridurre al minimo la confusione per tutti i lettori.
Forse hai sentito che la capacità di attenzione delle persone ora è più breve di quella di un pesce rosso? In caso di dubbio, scomponilo; renderlo il più semplice possibile.
Rapporti di contrasto del colore
Speriamo che la guida di stile della tua organizzazione non sia stata progettata da Babbo Natale, poiché l'uso del rosso e del verde per i colori complementari non farà alcun favore ai tuoi utenti. Il contrasto cromatico è un elemento essenziale di un design accessibile. Gli individui ipovedenti possono avere difficoltà a distinguere tra colori troppo simili e per gli utenti daltonici molti colori sono indistinguibili.
Potresti provare lo strumento gratuito Color Contrast Analyzer di TGPi eliminerà le congetture nel determinare rapporti di colore sufficienti. Usa il selettore colore per scegliere i colori di primo piano e di sfondo e l'ACC ti dirà se il contrasto è appropriato.
Moduli accessibili
Praticamente ogni sito utilizza un modulo per consentire agli utenti di completare un'attività. Che la tua attività sia e-commerce, basata su servizi o anche solo una vetrina online, molto probabilmente includerà un modulo. Tuttavia, i moduli possono essere complicati per le persone con disabilità. Ci sono diverse considerazioni tecniche (leggi: quelle che gli sviluppatori devono implementare) e non tecniche, che i marketer senza conoscenze di codifica possono facilmente seguire. Ecco le migliori pratiche non tecniche:
- Mantieni i moduli brevi e semplici : ottieni le informazioni di contatto dei clienti e quindi crea una relazione per coinvolgerli e trarre ulteriori informazioni
- Fornisci istruzioni chiare ed etichette visibili : a nessuno piace un modulo confuso
- Convalida input (annulla modifiche/conferma) – Avvisa gli utenti di eventuali problemi e come risolverli
- Notifica utente (successo/fallito) – Comunica agli utenti se l'invio del modulo è andato a buon fine o meno
- Adotta multipagina o progressivo : se devi avere un modulo più complicato, punta a un modulo multipagina o progressivo che non sopraffà gli utenti
- Rimuovi i limiti di tempo o fornisci opzioni : i limiti di tempo possono essere utili per costringere gli acquirenti ad acquistare, ma aggiungono stress eccessivo alle persone con gravi problemi di ansia
Briciole di pane
I breadcrumb sono una forma di navigazione sul tuo sito che ti consente di vedere come la pagina che stai attualmente navigando si inserisce nell'immagine più ampia. Di solito sono collegamenti che portano a pagine di livello superiore.
Un esempio di una traccia breadcrumb su un sito di e-commerce che vende abbigliamento potrebbe essere
Donna > Giacche > Lana > Caban.
I breadcrumb sono utili per l'orientamento e consentono agli utenti di tornare facilmente alle pagine di livello superiore senza iniziare il viaggio da zero.
Sono particolarmente critici per le persone con disabilità per diversi motivi. Per uno, gli utenti con disabilità cognitive beneficeranno sempre di un'esperienza user-friendly che riduce al minimo l'ambiguità. I breadcrumb sono particolarmente critici se il tuo sito è esteso e complicato. Le breadcrumb inoltre orientano immediatamente gli utenti degli screen reader, rendendo la navigazione del sito meno faticosa.
Sebbene i breadcrumb siano chiaramente utili per gli utenti con disabilità, come molte migliori pratiche di accessibilità, migliorano l'esperienza per tutti gli utenti.
Chatbot e integrazioni di terze parti
Molti siti Web sfruttano integrazioni di terze parti per i loro siti Web, come chatbot, pop-up modali, pagine di destinazione dinamiche, ecc. È una sfortunata realtà che il software di terze parti sia spesso in gran parte inaccessibile, una situazione aggravata dall'incapacità di un'azienda di rimediare.
Se la tua organizzazione sceglie di integrare un'applicazione di terze parti nel tuo sito web, assicurati di farla valutare da un esperto prima di aggiungerla. Anche se potresti non essere in grado di conciliare molti dei problemi di accessibilità, almeno capirai il livello di rischio che stai assumendo. Puoi anche richiedere una dichiarazione di accessibilità o una garanzia al tuo fornitore da integrare in un contratto (sebbene dovresti comunque testare il prodotto per verificarne l'accuratezza prima dell'implementazione).
Come nota a margine, chiedi sempre ai tuoi fornitori informazioni sull'accessibilità dei loro prodotti. Più clienti richiedono prodotti accessibili, maggiori sono le possibilità che i fornitori ascoltino e inizino a incorporare funzionalità di accessibilità nelle build dei loro prodotti.