Blog

by News

Come scegliere il giusto font per il web

Ti è mai capitato di faticare a leggere un testo a causa del carattere troppo confuso, le dimensioni piccole o i colori poco idonei?

Se la risposta è sì, la persona che ha realizzato graficamente quella pagina non è un web designer.

Qual è la relazione?
Il web designer è una figura che cura nel dettaglio questi aspetti e che, oggi, è fondamentale per la buona riuscita di un progetto online. Sempre di più la nostra capacità di concentrazione viene ridotta dalle decine di input che riceviamo simultaneamente.
Il compito del web designer è quindi quello di rendere il più semplice e gradevole possibile le pagine web che realizza.

Il primo aspetto, fondamentale, è quello di scegliere un font – il carattere tipografico – adatto.

Per questo bisogna considerare almeno 2 punti:

  • Qual è il nostro obiettivo? Informativo, di conversione o di divertimento?
  • Qual è il nostro stile?

Perché questi due aspetti sono fondamentali?

Perché usare il comic sans (il font che spesso si trova nei fumetti), in una presentazione di un progetto, non rispecchia la nostra personalità.

Come nella rivisitazione del logo di McDonald’s sulla destra.

Vuoi scoprire di più sui font e quali sono i più giusti per il tuo sito?

Eccoti nel posto giusto!

Continua a leggere per saperne di più!

Cosa sono i Web Font

I “web font” sono letteralmente i font dedicati al web. Questi sono i caratteri tipografici che dovresti privilegiare nella realizzazione di una pagina online perché risultano più facili da leggere rispetto ad altri, in base a determinati parametri specifici.

Quali sono i criteri per definire i font migliori da utilizzare nel web?

Leggibilità

Il primo elemento che distingue i Web font dagli altri è la leggibilità, che racchiude: lunghezza dei righi, interlinea e dimensione del carattere.

Vediamoli nello specifico.

  • interlinea: si tratta dello spazio bianco che si trova tra un rigo e l’altro. Per il web è consigliata un’interlinea di 1,5 volte la dimensione del font.
    Sicuramente ti sarà capitato, mentre leggevi un testo online, di ritrovarti a leggere il rigo sotto o quello sopra. Significa che lo spazio bianco tra le righe era troppo poco e ti ha portato a confondere la lettura.

    Guarda l’esempio qui sotto:
  • lunghezza dei righi: una giusta lunghezza comprende dai 40 ai 75 caratteri, spazi inclusi, per rigo. È necessario fare attenzione a questo parametro perché la nostra lettura non è regolare: saltiamo lettere e parole mentre leggiamo.

    Se la riga è troppo lunga c’è il rischio che la lettura sia rallentata e ciò porta gli utenti a uscire velocemente dalla pagina.

    Guarda qui sotto:
  • dimensione del carattere: per il corpo del testo, le dimensioni variano a seconda del dispositivo utilizzato.
    Le linee guida affermano:
    • 16 px per mobile
    • tra i 16 px e i 22 px per desktop

Chiaramente i font occupano spazio e capienza differenti.

In questo esempio, noti delle differenze?

Cerchi aiuto per scegliere il migliore font per il tuo progetto online?

Presentazione mobile

Il font incide sulla User Experience.

La User Experience, come anticipa il termine, è l’esperienza che l’utente fa all’interno del sito.
L’obiettivo di ognuno è quello di presentare al meglio il proprio sito nel web.

In che modo?

Attraverso il design e l’interfaccia utente, che devono catturare l’attenzione dell’utente e farsi ricordare.
La User Experience racchiude un’insieme di elementi come il font utilizzato, la facilità di navigazione, il layout e altri fattori che influenzano l’esperienza delle persone online.

Per fare in modo che questa sia positiva allo stesso modo da mobile e da desktop, assicurati che il tuo sito web sia responsive, ossia che si adatti al supporto dal quale viene letto.

Il tuo sito ha un’esperienza utente efficace?
Scoprilo leggendo l’ultima parte di questo nostro articolo

Posizionamento del sito

Il carattere influisce sul posizionamento del sito?
La risposta è… sì!

Se ti sei perso cosa s’intende con il termine “posizionamento”, corri a leggere il nostro articolo! Lo trovi QUI.

Scegliere un font facilmente leggibile online aiuta l’utente a fermarsi per più tempo all’interno della tua pagina e, di conseguenza, migliora le performance del tuo sito rispetto a quello dei tuoi concorrenti.

Non finisce qui!

Oltre a utilizzare il giusto font, ricorda anche che gli stili sono importanti.
In ottica SEO è fondamentale utilizzare il “bold”, il “sottolineato” e le altre carature in base al grado d’importanza di quella determinata parola o frase.

I font sicuri per il Web

Conosci i cosiddetti “font web safe”?

Si tratta di una lista di font che puoi utilizzare senza problemi per il tuo sito web perché vengono letti allo stesso modo da tutti i sistemi operativi.

Nello specifico, i font web safe aumentano il tempo di permanenza degli utenti nel sito web migliorando e aumentando così il suo posizionamento a discapito dei siti concorrenti.

 Attenzione! Non prendere come riferimento un font web safe di un sistema operativo di ultima generazione perché potrebbe non essere sicuro per altri sistemi operativi meno recenti.

Ecco 3 font web safe tra i più utilizzati:

  • Arial: oltre ad essere sicuro, è anche uno tra i font più utilizzati proprio perché è facilissimo da leggere da qualsiasi dispositivo. Utilizzalo sia per i titoli che per il corpo del testo, si adatta facilmente.
  • Time New Roman: malgrado non sia un font moderno, il Time New Roman è comunque uno tra i più utilizzati grazie alla sua capacità di risultare semplice da leggere e capire.
  • Calibri: particolarmente pulito e leggero, il font Calibri si adatta ai diversi supporti e dispositivi. Si distingue da altri font simili grazie alla morbidezza delle linee ed è utilizzato soprattutto nei dispositivi Windows.

Se non sei molto esperto nel settore, vai sul sicuro con i font bastoni.

Cosa sono i font bastoni?
Sono caratteri senza “codine”. L’Helvetica (quello che vedi in tutto il nostro sito) è un font bastoni mentre, il famosissimo Times New Roman è un font con le grazie su ogni lettera.

Google Fonts

Se lavori con i font, conoscerai sicuramente Google Fonts!

Si tratta di un archivio messo a disposizione da Google che contiene più di ottocento font sempre nuovi e gratuiti da utilizzare online.
I Google Fonts sono infatti dedicati al web e, per questo, facilmente leggibili online!

Come procedere?

Ecco, passo a passo, come scaricare e utilizzare correttamente i Google Fonts.

1. Digita sulla barra di ricerca “Google Fonts” e clicca sul primo risultato disponibile

2. Clicca sul font che desideri scaricare

3. Vai su “Download family”, in questo modo scaricherai tutta la famiglia del font e, una volta installata, potrai utilizzarla direttamente dal tuo dispositivo!

Un consiglio: prima di scaricare il font digita i caratteri speciali nella barra di ricerca come nell’esempio sottostante.

Il gioco è fatto, sei pronto a utilizzare il font migliore per la tua pagina online!

Ovviamente tutti i consigli che abbiamo dato in questo blog sono solo una minima parte dell’esperienza di un web designer.

Saper mixare più font in maniera elegante e moderna è una capacità che solo un’approfondita conoscenza tecnica e l’esperienza rendono possibile.

Inoltre, prima ancora, è necessaria un’approfondita analisi del tuo obiettivo, della tua azienda e della tua buyer persona (leggi qui per saperne di più su questo tema). Solo attraverso questi potrai realizzare la strategia, anche visiva, perfetta per arrivare al cuore dei tuoi utenti e trasformarli in clienti!

Desideri ricevere una consulenza per il tuo prossimo progetto online?