Chiudi gli occhi. Immagina che qualcuno legga una pagina Web ad alta voce. Ora, immagina che alcune di quelle parole non abbiano senso perché sono vaghe oppure omesse del tutto.

La navigazione in un sito Web utilizzando la tecnologia assistiva, come uno screen reader, si basa su titoli, etichette e tag precisi per spostarsi facilmente tra i contenuti e trasmettere un'immagine completa. Il testo alternativo (o l’alt tag) rappresenta l'opportunità perfetta per incorporare l'accessibilità digitale nel tuo sito Web.

Il testo alternativo descrive un'immagine. È descrittivo, informativo e conciso. Con un ottimo testo alternativo, le tue parole dovrebbero rendere chiaro il contenuto dell'immagine.

Di norma, ogni immagine sulla tua pagina Web dovrebbe avere un testo alternativo, a meno che non sia puramente decorativa. Affronteremo questo argomento più tardi. Se non conosci il testo alternativo e devi iniziare con le basi, vai al Centro assistenza di Siteimprove.

Se invece sei a un livello più avanzato, continua a leggere per ottenere suggerimenti specifici su come portare il tuo testo alternativo al livello successivo.

 

Rifletti sullo scopo dell'immagine

Lo scopo di un'immagine è arricchire la narrazione, esortare un comportamento o essere informativo. Rifletti sullo scopo della tua immagine. Amplia il contesto dell'articolo? In tal caso, pensa a come metterla in parole.

Se un'immagine trasmette informazioni a cui altrimenti non avresti accesso, descrivila come testo alternativo. Ricorda, il testo alternativo funge da sostituto diretto e scritto dell'immagine.

Diamo un'occhiata a un sito Web di istruzione superiore come esempio. La pagina "Vita da studente" può includere una foto di studenti che svolgono un compito in classe. Senza vedere l'immagine, leggere il testo alternativo che dice "studenti con quaderni" non coglie completamente la storia o lo scopo.

L'immagine reale mostra tre studenti seduti a un tavolo da picnic all’aperto che lavorano su un compito. In questo caso, una descrizione migliore potrebbe essere "tre studenti che collaborano all'esterno". Lo scopo di quell'immagine è dipingere un quadro della vita del campus e un'atmosfera di studio rilassata. Semplificare eccessivamente il testo alternativo ignora il suo scopo.

Three students collaborating outsideThree students collaborating outside

Descrivi chi, dove e cosa

Rispondi alla domanda su chi sta facendo cosa e dove? Se c'è un colore rilevante nell'immagine, menzionalo. Il testo alternativo scritto come 'donna sofisticata che trasporta una borsa firmata rossa' dipinge un'immagine più chiara di 'donna con borsa'.

Rendi le tue parole chiare, concise e istruttive. Evita di scrivere 'immagine di' o 'foto di'. I lettori di schermo annunciano automaticamente un'immagine come immagine. Per questa ragione un testo alternativo scritto come 'immagine di una mela' verrebbe letto ad alta voce da uno screen reader come 'immagine, immagine di una mela'. Se l'immagine è un'illustrazione o un disegno tecnico con informazioni importanti, va bene indicarlo. Il testo alternativo non deve essere utilizzato per descrivere dettagli irrilevanti.

Technical drawing of male and female formsTechnical drawing of male and female forms

Collegalo al contenuto circostante

Immergiti più a fondo nel contesto dell'immagine e dell'articolo circostante. Una pagina Web con contenuti su suggerimenti per i social media potrebbe includere illustrazioni di un programma di pubblicazione. Scrivi il testo alternativo in modo che la relazione dell'immagine con il contesto sia espressa. Creare un testo alternativo da leggere 'calendario' è meno prezioso che descrivere l'immagine come 'calendario dei social media'.

Social media calendar

Usa le parole chiave, se hanno senso

Includi parole chiave importanti SOLO se hanno senso nel contesto. Non accumulare parole. I motori di ricerca eseguono la scansione delle tue pagine alla ricerca di parole chiave in tutti i tuoi contenuti, comprese le descrizioni del testo alternativo. Se hai l'opportunità di aggiungere una parola chiave di destinazione, dovrebbe essere accurata e non eccessiva. Siteimprove SEO ti aiuta a scegliere le parole chiave giuste. Ottimizza quei tag alt quando ha senso, per ottenere una spinta nel posizionamento sui motori di ricerca.

Dì loro dove stanno andando con i link di destinazione

Se l'immagine è un collegamento, descrivi dove ti porta la destinazione. In questo caso, il tuo testo alternativo dovrebbe descrivere lo scopo dell'immagine piuttosto che l'immagine stessa.

Non ignorare le immagini decorative

Se l'immagine è puramente decorativa, non fornire una descrizione. Tuttavia, lascia un tag alt vuoto (alt = ""). I lettori di schermo ignorano questi tag e passano al successivo contenuto pertinente.

Sii conciso

Testo alternativo lungo fornisce un'esperienza utente scadente per le persone che utilizzano lettori di schermo. Mantienilo il più nitido e conciso possibile, fornendo comunque un quadro completo.

Ora che conosci alcune strategie per creare un testo alternativo ottimale, fai pratica nello scriverlo in modo che esso aggiunga valore. Comunica accuratamente di cosa tratta l'immagine? È breve e conciso? Se chiudessi gli occhi mentre veniva letto ad alta voce, avresti una buona comprensione di ciò che ritrae?

Le immagini sono preziose per moltissime ragioni: SEO (parole chiave), un'esperienza più ricca, informazioni, esortazioni e accessibilità. Se dedichi del tempo a cercare o progettare con cura le tue immagini per attirare i visitatori, perché lasci che quelle immagini rimangano "invisibili" fino al 20% dei visitatori del tuo sito Web?

Per assicurarti che tutti i visitatori ottengano il contesto completo della tua pagina Web, non scrivere solo testo alternativo bensì un testo alternativo ottimale.