Collegamenti con Testo Distinguibile Mancante
Le pagine web utilizzano i collegamenti per indirizzare i visitatori a contenuti nuovi o aggiuntivi. I collegamenti possono essere di testo e immagini. I link sono potenti strumenti di navigazione e devono essere strutturati correttamente per garantire la migliore esperienza.
Le Linee guida per l'accessibilità dei contenuti Web (WCAG) sono requisiti specifici per garantire che i contenuti siano accessibili a tutti. Secondo le linee guida WCAG 2.2 AA, i link devono indicare lo scopo del link in modo che i visitatori possano decidere se vogliono seguirlo. I collegamenti hanno bisogno di un testo riconoscibile che indichi ai visitatori dove esso punta.
Cosa significa testo distinguibile?
I collegamenti in genere contengono due informazioni:
URL: indirizzo Web a cui il collegamento indirizza i visitatori quando selezionato
Testo visualizzato: testo visibile che indica ai visitatori cosa ci si può aspettare di trovare selezionando il collegamento
Nel codice sorgente HTML, il link alle migliori pratiche è simile a questo:<a href="#best-practices">Best practices for links</a>
Quando manca il testo visualizzato o il testo tra i tag <a>, il collegamento manca di testo distinguibile. Il testo distinguibile è quel testo visualizzato che indica ai visitatori lo scopo del collegamento.
È un problema minore quando i collegamenti non hanno testo distinguibile. Risolvi problemi minori per un'esperienza migliore. I collegamenti mancanti o con testo vago possono rendere la navigazione confusa ed essere fonte di frustrazione per le persone con disabilità.
Ally ti aiuta a identificare quando i collegamenti mancano di testo e spiega come risolverli. Ally passa attraverso questi controlli:
C'è del testo tra i tag del collegamento ipertestuale
<a>?Il testo tra i tag
<a>è nascosto?Le immagini utilizzate come collegamento hanno descrizioni alternative?
Se il collegamento non supera nessuno dei controlli, Ally lo contrassegna come un problema.
Usa Ally per trovare i collegamenti con il testo mancante
Utilizza il Report di accessibilità di Ally per scoprire e risolvere i problemi di accessibilità del tuo sito. Utilizza il link fornito per il report ed effettua l'accesso. Apri il report e consulta l'elenco dei problemi nella tabella Problemi di accessibilità.
Suggerimento
La tabella Problemi di accessibilità si trova sia nella scheda Panoramica che in quella Dominio. Iniziare dalla scheda Dominio per visualizzare i problemi specifici di un dominio.
I collegamenti privi di testo distinguibile vengono segnalati come un problema minore. Utilizza la scheda Minore nella tabella Problemi di accessibilità per visualizzare l'elenco dei problemi minori. Seleziona i problemi con i collegamenti senza testo distinguibile.
Suggerimento
Se inizi dalla scheda Panoramica, seleziona il problema e quindi il dominio con il problema.
Dall'elenco dei problemi nel dominio, seleziona l'indicatore del punteggio accanto a un elemento con il problema. Si apre il pannello di feedback dell'editor di contenuti.
Visualizza l'anteprima dei collegamenti con testo mancante
Il pannello di feedback di Ally ti mostra un'anteprima del contenuto, oltre a feedback dettagliati e supporto per aiutarti a risolvere i tuoi problemi di accessibilità. Usa l'anteprima per vedere i collegamenti con testo mancante.
L'anteprima evidenzia i punti specifici dei problemi di accessibilità presenti nel documento. Gli highlights mostrano ogni occorrenza di un tipo di problema alla volta. Ad esempio, per il problema dei collegamenti con testo mancante, l'anteprima evidenzia ogni istanza in cui si verifica questo problema specifico.
Strumenti di anteprima
Utilizza gli strumenti di anteprima per esplorare i problemi nel tuo documento.
Spostati nell'anteprima pagina per pagina.
Guarda quante volte viene visualizzato un problema specifico.
Salta tra gli highlights del problema.
Nascondi o mostra gli highlights.
Ingrandisci o riduci il contenuto dell'anteprima.
Se il problema si trova in un documento allegato, scaricare il file originale.
Segui i passaggi guidati di Ally per aggiungere il testo del collegamento
Importante
Ally presume che tu abbia una conoscenza di base dell'HTML e di come utilizzare il tuo sistema di gestione dei contenuti (CMS). Per seguire i passaggi guidati, è necessario sapere come modificare una pagina web in HTML o nel codice sorgente del tuo CMS.
Insieme all'anteprima, Ally ti fornisce una guida passo passo su come risolvere il problema. Ally organizza questo feedback in un albero decisionale. Leggi le indicazioni e rispondi alle richieste. Scopri qual è il problema, perché è importante e come correggerlo in modo appropriato.
Seleziona Come correggere il testo del link per seguire i passaggi guidati.
Modi per aggiungere testo ai collegamenti
C'è più di un modo per correggere il testo dei link sulle tue pagine web.
HTML: i passaggi guidati di Ally ti guidano su come trovare e correggere il testo del link in HTML. Fondamentalmente, trova la pagina web con il link. Modifica la pagina. Nel codice HTML, aggiungi del testo tra i tag
<a>. Salva la pagina.RTE: alcuni CMS dispongono di un editor di testo RTE (Rich Text Editor) che può fornire modi intuitivi per correggere i collegamenti. Trova il link sulla pagina web. Seleziona il link e utilizza gli strumenti CMS per aggiungere testo. Salva la pagina.
Suggerimento
Visita w3schools per saperne di più su HTML e CSS
Best practice per i link
Il testo del link deve essere significativo. Dì ai tuoi visitatori dove stanno andando. Descrivi ciò che l'utente può aspettarsi di vedere quando seleziona il collegamento.
Evita testi come "clicca qui" e "vedi di più". Queste frasi non dicono ai visitatori cosa aspettarsi quando selezionano il link. Alcune tecnologie di assistenza dispongono di uno strumento che elenca solo i collegamenti nella pagina. Frasi come queste non avranno alcun significato se tolte dal contesto della pagina e visualizzate in un elenco.
Evita gli URL come testo del link visibile. Un URL potrebbe non essere descrittivo. I lettori schermo leggono anche ogni lettera di un URL singolarmente, il che può essere frustrante per quei visitatori.
Il testo del link deve essere univoco. Ogni link deve essere unico rispetto agli altri link presenti nella pagina. La ripetizione del testo del collegamento può creare confusione quando viene tolta dal contesto della pagina e visualizzata nello strumento di elenco dei collegamenti.
I collegamenti devono risaltare visivamente. Dovrebbe essere chiaro che si tratta di un collegamento. Se non ti piace lo stile del collegamento, potresti voler aggiornare il modello.
Distingui il collegamento dal testo circostante in modo da non fare affidamento solo sul colore. WCAG 2.1 - 1.4.1
Importante
L'aspetto del collegamento è spesso definito nella guida di stile di un sito e può riflettere il branding. Prima di apportare modifiche, consulta la guida di stile del sito e l'amministratore del sito.
Informa gli utenti se il collegamento si apre in una nuova finestra. L'apertura del collegamento in una nuova finestra può essere disorientante. Informa i tuoi utenti quando li stai indirizzando a una nuova finestra o scheda.
Non utilizzare un'immagine per rappresentare qualcosa che puoi creare nell'HTML. Ad esempio, non utilizzare l'immagine di un pulsante anziché un pulsante reale. Non utilizzare un'immagine di una tabella invece di una tabella creata nel codice HTML sorgente.
Modalità di utilizzo dei collegamenti da parte delle persone con disabilità
I collegamenti appropriati che contengono un collegamento e un testo significativo consentono un'esperienza molto migliore per tutti. I collegamenti ben formati sono potenti strumenti di navigazione e chiariscono cosa aspettarsi. Tuttavia, i collegamenti adeguati sono essenziali per i visitatori con disabilità visive.
I collegamenti con testo unico e significativo possono significare una navigazione rapida per molti utenti.
Gli utenti di lettori schermo non devono ascoltare l'intera pagina. Possono invece scegliere di ascoltare e interagire con un elenco di collegamenti.
Gli utenti di riconoscimento vocale interagiscono con i collegamenti pronunciando ad alta voce il collegamento che desiderano selezionare.
I collegamenti formati correttamente possono essere più facili da vedere e con cui interagire per molti utenti.
Gli utenti che utilizzano solo la tastiera, che potrebbero non essere in grado di utilizzare il mouse, possono utilizzare la tastiera per spostarsi tra gli elementi della pagina come i collegamenti.
Gli utenti con daltonismo potrebbero non vedere la variazione di colore, ma possono vedere un collegamento sottolineato.