Contrasto dei link

Silktide individua i link all'interno del testo che si distinguono dalle parole circostanti solo per il colore, con una differenza cromatica troppo ridotta perché le persone con una percezione dei colori compromessa possano notarli. I link devono essere riconoscibili come tali, altrimenti i lettori non possono utilizzarli.

Perché è importante

Circa 1 uomo su 12 e 1 donna su 200 presentano una carenza nella percezione dei colori. Se l'unico elemento che identifica un link è un cambiamento cromatico sottile, questi lettori vedono del testo normale e non sanno che il link esiste. Questo significa perdere opportunità di navigazione e inviti all'azione, oltre a causare una violazione di livello A delle : si tratta di uno dei requisiti di accessibilità più basilari.

Come risolvere il problema

Esistono due modi per rendere conforme un link nel testo:

Distinguetelo usando qualcosa oltre al colore: la soluzione più semplice è una sottolineatura, che è ciò che la maggior parte dei lettori si aspetta dai link. Funzionano anche un bordo, uno sfondo o un peso del carattere sensibilmente maggiore.

\/* Link che si basano solo sul colore *\/\na { color: #4a6da7; text-decoration: none; }\n
\/* Corretto: la sottolineatura rende il link visibile a tutti *\/\na { color: #4a6da7; text-decoration: underline; }\n```

2. **Usate un colore nettamente diverso insieme a uno stato di focus e hover
   visibile**: il colore del link deve avere un [rapporto di contrasto](/definitions/contrast-ratio)
   di almeno **3:1** rispetto al testo circostante e il link deve cambiare
   visibilmente (per esempio mostrando una sottolineatura) quando il mouse passa
   sopra il link e quando riceve il [focus da tastiera](/definitions/keyboard-focus).

## Come Silktide esegue questo controllo

1. Individua i link visibili inseriti in una sequenza di testo, con parole
   direttamente prima o dopo di essi. I link autonomi, come le voci di menu e
   i pulsanti, non vengono verificati da questo controllo.
2. Ignora i link per i quali non è possibile determinare in modo affidabile il
   colore del link, quello del testo circostante o quello dello sfondo.
3. Considera conformi i link che si distinguono visivamente senza usare il
   colore: sono sottolineati, hanno un bordo o uno sfondo, oppure hanno un peso
   del carattere maggiore di almeno 200 unità rispetto al testo circostante.
4. In caso contrario, misura il rapporto di contrasto tra il colore del link e
   quello del testo circostante e verifica come cambia il link quando riceve il
   focus o quando il mouse passa sopra di esso. Segnala il link a meno che il
   rapporto non sia almeno **3:1** e lo stato di focus o hover non sia
   visibilmente diverso.

## Risoluzione dei problemi

### I miei link cambiano al passaggio del mouse, quindi perché vengono segnalati?

Un cambiamento al passaggio del mouse da solo non è sufficiente: il link deve
anche avere un contrasto cromatico di almeno 3:1 con il testo circostante. E,
anche insieme, questa soluzione aiuta solo le persone che riescono a percepire
la differenza di colore abbastanza bene da provare a passare il mouse sul link.
La sottolineatura rimane la soluzione più affidabile.

### I link nei menu e nei pulsanti non vengono segnalati

Esatto: questo controllo si applica solo ai link circondati da altro testo, dove
il lettore deve distinguere il link dalle parole circostanti. I link autonomi
sono identificabili visivamente grazie alla loro posizione e al loro stile.

## Per saperne di più

- [Comprendere il criterio di successo 1.4.1: Uso del colore (WCAG 2.1)](https:\/\/www.w3.org\/WAI\/WCAG21\/Understanding\/use-of-color.html)
- [Tecnica G183: Utilizzare un rapporto di contrasto di 3:1 con il testo circostante](https:\/\/www.w3.org\/WAI\/WCAG21\/Techniques\/general\/G183)