Compatibilità:

WebSite X5 Evo e Pro

I collegamenti testuali di una pagina sono un elemento basilare: per questo è importante fare in modo che chi naviga li sappia riconoscere a colpo d’occhio.


Per avere dei link usabili è sufficiente seguire alcune semplici convenzioni: implementarle richiede poco sforzo e i vantaggi per gli utenti sono rilevanti.


Le convenzioni da rispettare

Per evitare al tuo utente la frustrazione di provare a cliccare su un testo che in realtà non è un collegamento, devi considerare questi parametri:

  • Colore - È uno dei parametri principali che permette di distinguere un link dal resto del testo. Attenzione però che il colore da solo non è sufficiente: le persone daltoniche, per esempio, potrebbero non percepire alcuna differenza.
  • Stile - Puoi scegliere tra stili diversi: sottolineato, grassetto, con un font diverso… L’importante è usare per il link uno stile diverso dal resto della pagina: la prassi vuole che i link siano sottolineati e, in linea generale, è buona norma attenersi a questa convenzione. 
  • Contrasto - Proprio perché deve essere facile da identificare, bisogna fare in modo che il link contrasti bene rispetto a tutto il resto, non affidandosi al solo cambio del colore. 
  • Comportamento - È una consuetudine consolidata che al passaggio sul link il puntatore del mouse si trasformi: rispettare questa convenzione è indispensabile. 


Tenendo presente questi fattori e sapendo che la pratica migliore è di mantenere i link sottolineati, sperimentare soluzioni originali in linea con il design delle pagine è sicuramente lecito. L’obiettivo finale deve rimanere, però, la creazione di link facilmente riconoscibili e usabili.


#tip - La gestione del contrasto dei colori e del comportamento atteso sono particolarmente importanti quando si affronta il tema dell'accessibilità delle pagine Web. Puoi approfondire leggendo la guida Come verificare il contrasto dei colori per garantire l’accessibilità web.


Impostare lo stile dei link

Come puoi verificare provando a creare un collegamento testuale, questi hanno già un aspetto diverso dal testo normale, senza che tu abbia fatto ancora nulla in proposito. Lo stile che vedi applicato di default ai link dipende dal modello grafico che hai scelto per il tuo progetto. Sei libero di accettarlo così come ti viene proposto o di modificarlo a tuo gusto.

  • Via al Passo 2 - Modello clicca > Stile Testi, Campi e Pulsanti.
  • Dal menu a tendina che propone gli elementi di pagina, seleziona la voce Collegamento.
  • Il collegamento può avere 3 stati: attivo, su passaggio del mouse e già visitato. Seleziona uno stato per volta e, per ciascuno, definisci l’aspetto agendo su colori, stile e puntatore. 


I cambiamenti apportati vengono immediatamente applicati al progetto e lo stile di tutti i link testuali viene aggiornato senza che tu debba fare nulla.


Personalizzare lo stile di alcuni link specifici

Può accadere, però, che alcuni link del tuo sito debbano necessariamente avere uno stile diverso per continuare ad essere leggibili. Immagina, per esempio, di avere un sito in cui il corpo delle pagine ha uno sfondo chiaro mentre il footer ha un fondo scuro. Per i link del footer dovrai pensare a dei colori diversi rispetto a quelli previsti per l'intero sito.


Per ovviare a casi come questo, l'editor di testo offre un comando che ti permette di intervenire sullo stile dei collegamenti del solo Oggetto Testo su cui stai lavorando:

  • Apri l'Oggetto Testo su cui vuoi intervenire.
  • Clicca sul pulsante Stile Collegamento che trovi nella Barra Strumenti.
  • Nella finestra richiamata attiva l'opzione Stile Personalizzato.
  • Imposta i colori di testo e sfondo per i diversi stati del collegamento.


Il comando per la personalizzazione dello stile dei collegamenti è disponibile nell'editor dell'Oggetto Testo, dell'Oggetto Tabella e della finestra di composizione del Contenuto degli articoli del Blog.