L'importanza della tipografia sul web

Attenzione alla leggibilità

Ti è mai successo? Scrutare molto vicino allo schermo perché il carattere tipografico è così piccolo? Mi ritrovo spesso a ingrandire le pagine Web perché non riesco a leggere il testo. È estremamente fastidioso.

La leggibilità del testo sul tuo sito Web o nella comunicazione online è determinante per influenzare il modo in cui le persone lo leggono. Non è solo la tua scelta delle parole: anche un carattere standard adatto ha un ruolo importante da svolgere in questo. Anche la dimensione del carattere, la lunghezza della riga e l'interlinea influiscono sulla leggibilità del testo.

La tipografia online e stampata non sono la stessa cosa

Quando sono passato per la prima volta dalla carta stampata all'online, devo ammettere che mi ci è voluto del tempo per abituarmi al fatto che tutto sul web può essere leggermente più grande. Ho iniziato nel mondo dei giornali, dove una dimensione del carattere di 9 o 10 px è abbastanza normale per il corpo principale del testo. Ricordo ancora la mia prima pubblicazione online: una dimensione del carattere enorme per il voci e un carattere minuscolo per il corpo principale del testo. Era completamente un'idea sbagliata. Il testo del corpo principale avrebbe dovuto essere grande il doppio, almeno 16 px. E, naturalmente, i titoli potrebbero anche essere più sottili. Inizialmente l'ho trovato strano, ma ora ci sono completamente abituato.

C'è una logica dietro questo perché le proporzioni sono molto diverse sul web. Pensaci: spesso ti siedi più lontano dallo schermo di un giornale, opuscolo, o rivista. In una pubblicazione web, quindi, hai bisogno di una dimensione del carattere più grande, perché la distanza fa sembrare il carattere più piccolo. Ma non è tutto. Anche la lunghezza della linea è importante, così come l'interlinea. Ma come si fa a decidere qual è la dimensione del carattere, la lunghezza della linea e la spaziatura ideali? Penso che questo vari a seconda del carattere perché differiscono parecchio in termini di dimensioni. Non sono sicuro che esistano degli ideali linee guida, ma dopo aver fatto qualche ricerca, ho creato il seguente elenco

importanza della tipografia web

Linee guida per la tipografia

Dimensione carattere: 16px o superiore
Lunghezza riga: da 45 a 75 caratteri
Interlinea: 1.4 volte la dimensione del carattere

Quanto sopra sono dimensioni medie, ma se il tuo carattere è piccolo o stretto, dovresti sentirti libero di optare per un pixel più alto.

Fluidità di elaborazione: attraente o leggibile?

Tempo per un po' di scienza. I nostri cervelli sono sensibili ai cambiamenti all'interno di un messaggio. Potresti pensare che mi riferisca alla tua scelta del vocabolario, ma anche il carattere che scegli gioca un ruolo importante. Se vuoi incoraggiare il tuo lettore a continuare a leggere, assicurati di utilizzare il carattere giusto. La fluidità di elaborazione, in altre parole, la facilità con cui il nostro cervello elabora le informazioni, è estremamente importante in questo. Scegliere un buon font per il proprio lavoro online può sembrare una banalità, ma in realtà influisce sul nostro modo di agire, anche se non ne siamo consapevoli.

Un font ha un'influenza sulla leggibilità del testo. Ad esempio, i caratteri di facile lettura come Helvetica e Verdana possono essere elaborati in una frazione di secondo. Lo stesso non si può dire per i font più creativi (come gli stili scritti a mano) che sono più difficili da leggere.

Ma la scelta di un carattere creativo e scritto a mano ha in realtà un altro impatto positivo sulla leggibilità del testo. Risulta più personale e rende più credibile il significato del messaggio. Quindi dovresti optare per attraente o leggibile? Scegli il meglio dei due mondi – in altre parole, un carattere chiaro e leggibile come Arial, Helvetica o Verdana e intervallalo con caratteri creativi, in un citare, per esempio.

"Una citazione può fornire un posto dove riposare all'interno del testo."

Ma questo non inizia nemmeno a esplorare tutti i diversi caratteri che potresti usare! L'emergere di strumenti come Typekit e Google Fonts ora significa che innumerevoli nuovi caratteri Web hanno iniziato ad apparire accanto ai caratteri classici. Tendono ad essere un po' più freschi dei caratteri classici, conferendo alla tua pubblicazione o al tuo sito web un aspetto leggermente più leggero.

L'installazione dello strumento Skyfonts per Windows o Mac OSX consente di scaricare webfonts da Google Fonts con un clic del mouse. È facile aggiungere caratteri facendo clic sul segno più e verranno archiviati ordinatamente nello strumento. Il vantaggio finale di Skyfonts è che, dopo averli installati, puoi utilizzare i font immediatamente nei progetti su cui stai lavorando. Probabilmente conosci il problema: se installi un nuovo font separatamente, devi iniziare cercandolo nei download prima di aprirlo nella libreria dei font e salvarlo. C'è anche il problema di dover salvare separatamente tutte le versioni regolari, grassetto e corsivo, mentre con Skyfonts puoi salvare intere famiglie di font che funzionano subito. Cosa potrebbe esserci di meglio? C'è l'ulteriore vantaggio che i siti Web Fonts.com, Linotype, Monotype e My Fonts sono tutti affiliati a Skyfonts, consentendoti anche di aggiungere font a pagamento.

Guarda le tue parole!

le parole contano

Infine, la scelta delle parole è importante. Probabilmente non abbiamo bisogno di dirtelo, ma non tutti si assicurano che i testi che scrivono siano effettivamente adatti al lettore target. Dovresti adottare uno stile più leggero per i lettori più giovani, ma essere più elaborato quando ti rivolgi a lettori più anziani che richiedono maggiore profondità. Tieni a mente il tuo pubblico di destinazione, perché quelle sono le persone che miri ad attrarre. Se hai successo, è probabile che il lettore torni per saperne di più.

Tieni conto del tuo design reattivo

Senza dubbio avrai notato che è in atto un cambiamento nel web design, a seguito del quale quasi tutte le produzioni, i siti web e altre cose sul web sono diventate di risposta. Ciò significa che tutto il contenuto di una pagina si ridimensiona automaticamente, consentendone anche la visualizzazione altrettanto buona sul tablet o sullo smartphone. Ciò ha ripercussioni sulla tipografia in un web design e significa che dovresti tenere conto di colori, caratteri e dimensioni dei caratteri. La creazione di un design reattivo è importante, ma richiede tempo per essere realizzata.

Con lo strumento Foleon, è facile applicarlo nella tua pubblicazione online. Poiché è possibile adattare i colori, i tipi di carattere e le dimensioni dei caratteri per i dispositivi mobili nello stile generale del tema, nonché lo stile della pagina e lo stile dell'elemento a livello di pagina, puoi impostare le tue pagine come reattive in un batter d'occhio.

Potrebbe piacerti anche:

Biografia dell'autore

Ritesh SheombarRitesh è un responsabile del marketing digitale con anni di esperienza nel guidare la crescita. Attualmente è il direttore di inbound marketing a Folone. Puoi trovare di più su di lui sul suo Profilo LinkedIn.

Padroneggia l'arte del video marketing

Strumenti basati sull'intelligenza artificiale per Idea, ottimizza e amplifica!

  • Scatena la creatività: Scatena le idee video, gli script e gli hook coinvolgenti più efficaci con i nostri generatori di intelligenza artificiale.
  • Ottimizza istantaneamente: migliora la tua presenza su YouTube ottimizzando i titoli, le descrizioni e i tag dei video in pochi secondi.
  • Amplifica la tua portata: crea facilmente social media, e-mail e testi pubblicitari per massimizzare l'impatto del tuo video.