Come allineare i testi sul sito?

Pubblicato il 19 Ottobre 2023
Aggiornato il 19 Ottobre 2023

Un ottimo argomento che riguarda la user experience è l’allineamento del testo sui siti web: centrato, giustificato, destra o sinistra?

Per quanto potessi sentirti cert@ di ciò che funziona su un documento in Word, che di solito può essere stampato o trasformato in PDF, potresti scoprire che un sito web non segue le stesse regole, e ora vediamo perché.

Prima però dobbiamo prendere in considerazione la leggibilità: di che si tratta?


La leggibilità e la user experience

Di user experience ho parlato diverse volte su questo blog, ma non è un argomento che può aprirsi e chiudersi, è in continua espansione.

Così come si susseguono, infatti, i trend di web design, allo stesso modo il design stesso trova nuovi modi per rendere il web un luogo sempre più fruibile dalle persone. I comportamenti degli utenti vengono studiati e i siti si assicurano di creare spazi dove navigare sia piacevole, facile, intuitivo, anzi: dove quasi non ci si accorga di navigare per quanto spostarsi da un contenuto all’altro segua un flusso naturale.

La leggibilità dei testi è una parte straordinariamente importante di questo flusso naturale, perché, nonostante i contenuti video abbiano sempre più importanza nel web, i contenuti testuali continuano ovviamente a farla da padroni e accompagnano ogni elemento.

Scegliere, quindi, come allineare il testo sulle pagine del proprio sito può decretare un maggiore o minore coinvolgimento degli utenti. Se leggere un testo appare fastidioso agli occhi dell’utente, difficilmente questo resterà su quel sito, anzi… probabilmente non tornerà più. Questo coinvolge i colori percepiti durante la lettura, ma anche la disposizione del testo.


Come allineare il testo su un sito web

Mentre su Word si prediligono testi giustificati, che prevedano dunque un vero e proprio muro di testo, con la stessa distanza, per intenderci, da margine destro a margine sinistro, sul sito non è quasi mai la scelta più corretta da fare.

Infatti, così come può scoraggiare trovarsi di fronte un muro di testo privo di variabili (lo vediamo più sotto, poi, come fare), anche gli spazi bianchi forzati tra una parola e l’altra, per impostare il testo giustificato, possono risultare innaturali e “di troppo”.

Allineare al centro il testo non è una scelta comunissima, ma è invece usato per i titoli e in generale per gli header dei siti. Può essere anche utilizzato per staccare dal testo principale alcune frasi che si vogliono mettere in evidenza, magari scegliendo anche un’altra dimensione e font. Naturalmente devono essere periodi fatti e finiti, di senso compiuto se letti da soli e staccati, appunto, dal testo.

Allineare a destra non è indicato, a meno che non stiamo inserendo del testo (poco) in una tabella.


Testo giustificato? No grazie, non sul web!

Una delle domande che mi viene posta più spesso come web designer è “possiamo mettere i testi giustificati“?. E la mia risposta è quasi sempre “NO“. È come cercare di fare incastrare un puzzle quando le tessere non sono proprio della stessa dimensione. Ecco perché potrebbe non essere la scelta migliore per il tuo sito:

  1. La leggibilità va un po’ a farsi benedire: Questo tipo di testo può creare degli spazi assurdi tra le parole, come se cercassimo di far stare tutto in una scatola con risultati un po’ strampalati. E se ciò rende la lettura più complicata.
  2. Non si adatta a tutti: Le pagine web devono essere belle su tutti i dispositivi, dai computer ai tablet e agli smartphone. Ma il testo giustificato è un po’ come un vestito che ti sta bene solo il 50% delle volte. Puoi finire per avere un testo tutto scombinato su schermi diversi, ed è un bel pasticcio.
  3. Spaziature irregolari: La giustificazione può portare a spaziature strambe tra le parole, il che rende il testo difficile da leggere e a volte sembra proprio fatto da principianti. Inoltre, potresti dover mettere spazi extra o andare a capo a mano per sistemare le cose.
  4. Accessibilità – questa sconosciuta: Il testo giustificato può creare problemi di accessibilità per le persone con disabilità visive. Può essere difficile per i lettori di schermi o per le persone con difficoltà visive navigare attraverso il testo giustificato, specialmente se la spaziatura è irregolare.
  5. Compatibilità con la lingua: Alcune lingue e tipi di scrittura non si sposano bene con la giustificazione, e il risultato è un pasticcio totale.

Ma allora, qual è l’allineamento più corretto per il testo su un sito web?

Allineare a sinistra il testo è sempre la scelta più opportuna: non si sbaglia, la pagina sarà leggibile dall’utente.

Un altro piccolo tip che mi sento di darti, sempre per accompagnare la leggibilità, è: nel caso di muri di testo, il grassetto aiuta. Ma non intere frasi, bensì le parole più importanti, evidenziate proprio per attirare l’attenzione del lettore appena arriva nella pagina. È dimostrato che porterà a termine con più probabilità la lettura del testo (che è quello per cui la pagina è stata pensata!).

Non ci dovrebbe essere bisogno di dirlo, ormai, ma repetita iuvant: attenzione ai colori del sito e al contrasto tra font e sfondo. Non siamo nel 1998, dove si spiattellavano testi giallo fosforescente su fondi neri, oggi si deve dare la precedenza alla leggibilità da parte dell’utente e i contrasti non aiutano.

Naturalmente, nel caso tu abbia dei dubbi, è il tu@ web designer che può guidarti nel fare le scelte più opportune, che riguardino l’allineamento del testo o i colori del sito: contattami e parliamone insieme!

Hola!

Sono Nicole, web designer e grafica freelance.

Scopri chi sono

Sono una web designer freelance

Mi occupo di sviluppo di siti web responsive, e-commerce, blog e grafica da circa 15 anni. Dal 2018 aiuto piccoli imprenditori, artigiani e liberi professionisti a portare la propria attività online con successo.

Mi occupo inoltre di formazione e consulenza in UI design per aziende, web agency e freelance, ed offro supporto e percorsi di mentoring a web designer che desiderano decollare con la loro attività.

Creazione siti web
Siti e-commerce
Branding

Formazione per web designer

FREELANCE

Se sei un web designer freelance alla ricerca di orientamento, chiarezza e supporto per prosperare nel mondo digitale in continua evoluzione, sei nel posto giusto! Il mio servizio di consulenza, formazione e mentoring è qui per te.

Scopri la formazione

Dal blog