Gli hyperlink o link sono imperative controls convenzionalmente utilizzati sul web per la navigazione all’interno o all’esterno di un sistema. Sono generalmente riconoscibili per il loro colore blu sottolineato.

 

Come aiuta l’utente

Gli hyperlink sono importanti perché aiutano l’utente nella scansione della pagina alla ricerca di informazioni rilevanti. È importante, quindi, che siano molto riconoscibili e che descrivano chiaramente il contenuto linkato anche se letti fuori contesto, in modo da alleggerire il carico cognitivo dell’utente.

 

Anatomia

  1. Testo
  2. Sottolineatura (facoltativa)

 

Stati

  1. Active: L’elemento è attivo e disponibile 
  2. Disabled: L’elemento non è attivo, quindi inutilizzabile
  3. Hover: Il cursore è sopra l’elemento ma non è stata compiuta nessuna azione
  4. Visited: L’elemento è stato premuto almeno una volta
  5. Focused: L’elemento è stato selezionato tramite un input come la tastiera o un comando vocale 


Accessibilità e usabilità

Per mantenere la riconoscibilità dell’elemento è importante rispettare alcune linee guida.

  • Distinguere il testo cliccabile dal restante attraverso l’uso del colore e della sottolineatura. La sottolineatura può essere evitata se viene già utilizzato il colore come elemento distintivo ma, in questo caso, bisognerà scegliere un colore riconoscibile anche a chi ha problemi visivi.
  • La sottolineatura non è necessaria se:
    • i link sono all’interno di voci di menù;
    • i link fanno parte di un gruppo di link chiaramente distinto dal resto.
  • La sottolineatura è un forte segno di cliccabilità sul web, per questo è preferibile non utilizzarla nel testo per evitare incomprensioni.
  • Attenzione alla scelta dei colori per gli stati “active” e “visited”: per il primo meglio utilizzare colori saturi e più luminosi del secondo che, invece, deve dare l’idea di essere stato usato. I due colori devono mantenere una relazione tra loro, per questo è consigliato sceglierli della stessa tonalità.
  • L’interazione al mouse hover non è indispensabile ma può essere utilizzata per far comparire la sottolineatura e migliorare l’affordance.
  • Assolutamente evitare di cambiare il peso del carattere utilizzato per non avere antipatici ridimensionamenti del testo.

 

Maggiori dettagli su https://www.nngroup.com/articles/guidelines-for-visualizing-links/