Mai sentito parlare di Google Fonts? Si tratta di una utilissima raccolta di font edita da Google che puoi usare gratuitamente se stai realizzando il tuo nuovo sito web in WordPress. Se non sei un grafico è normale che la prima cosa che ti verrà da pensare dinanzi a così tanta scelta sarà “da dove comincio?” Per questo abbiamo pensato di fornirti una bella guida sui font di Google per utilizzarli al meglio su WordPress.
Come usare i Google Fonts sul tuo sito WordPress
Google Fonts è una fornitissima sezione di font che puoi scegliere per realizzare il tuo nuovo sito web. Prima di procedere vogliamo accertarci, con un piccolo ripasso, che tu abbia seguito passo per passo tutti gli step necessari prima di arrivare alla personalizzazione del sito. Per esempio hai scelto un hosting sicuro ed affidabile? Hai impostato un dominio di navigazione sul protocollo sicuro HTTPS? Hai scelto password di accesso sicure? E infine, hai installato un buon tema per iniziare a personalizzare il tuo sito? Si, perché i migliori temi per WordPress danno la possibilità di utilizzare compositori visivi che offrono miriadi di livelli di personalizzazione e, tra questi, c’è la scelta della tipografia, ovvero di come devono apparire i testi del tuo sito. In alcuni temi la scelta è personalizzabile on-page su qualsiasi testo mentre, in altri, questa avviene tramite la sezione Personalizza a cui accedi dalla dashboard principale del tuo sito.
Cosa sono i Google Fonts
Qualche anno fa la scelta di font non era così vasta come lo è oggi. Se hai un budget minimo o stai realizzando il sito web per conto tuo potresti voler risparmiare qualcosina affidandoti a risorse gratuite, come i font di Google. Attenzione però, perché il fatto che siano gratuiti non significa affatto che siano di minor qualità. Il font è una questione estetica e si può avere un ottimo effetto visivo pur scegliendo font comuni che ritrovi in tantissimi siti. Per la scelta, tuttavia, non puoi affidarti al solo gusto estetico e quindi è necessaria una piccola infarinatura sui font, su come si suddividono e su come si scelgono in base alla loro destinazione d’uso. Innanzitutto digitando sulla barra del popolare motore di ricerca Google Fonts verrai reindirizzato alla pagina principale da cui avrai una panoramica completa di tutti quelli disponibili. A differenza dell’editor del tuo sito web in questa pagina puoi visualizzarli tutti, scegliendo tra le opzioni di visualizzazione e facendo delle prove digitando il testo e osservando l’effetto finale. La prima barra di lavoro che troverai sulla pagina di Google Fonts ti permette di cercarli per nome, di scrivere un testo per guardare come viene l’effetto del font scelto, di selezionare la grandezza in pixel e di visionare lo stesso testo con uno sfondo chiaro o scuro. In questo modo vedrai in tempo reale l’effetto visivo delle tue scelte.
Tipi di font
Poco più in basso una barra di navigazione ti offre la possibilità di filtrare i font presenti, che sono tantissimi, impostando delle regole. Per questo hai bisogno di una piccola infarinatura sui font: per capire meglio cosa significano le parole che vedi riportate.
- Serif: è il tratto di un font "con grazie", anche conosciuto come graziato. Le grazie sono le sporgenze ornamentali di un carattere, ovvero quegli allungamenti ortogonali che si trovano alle estremità del carattere e che danno un aspetto "aggraziato" ed elegante. Le grazie derivano dal carattere lapidario romano e servono a caratterizzare il font con eleganza. Il carattere Serif più conosciuto è il Times New Roman. Un testo con grazie è più raffinato, tuttavia ha un minor livello di leggibilità. Sceglilo per testi ampi, come bottoni e titoli.
- Sans serif: questa dicitura significa letteralmente “senza grazie” e il suo aspetto è l’opposto del precedente. I font senza grazie sono più regolari e non presentano ornamenti alle estremità, appunto le cosiddette grazie. Il carattere Sans serif più conosciuto è l'Arial. Questi font vengono anche denominati bastoni. Sono i font ideali per il corpo del testo, meglio noto come body.
- Display: questa variante è un po’ più rara e consiste in quei font ideati per i titoli. Un font display è proporzionato, leggero e adatto a grandezze più ampie del body.
- Handwriting: sono i font che somigliano ad una calligrafia umana e, pur essendo carini e deliziosi, farebbero diventare cieco qualunque lettore del tuo sito web. Questi font sono ideali per widget, call to action, loghi e aspetti del sito dove il testo è minimo mentre l’effetto visivo è massimo. Stando alle regole del User Experience Design utilizzare un font handwriting laddove vi sia richiesta interazione da parte degli utenti darebbe maggiori probabilità di conversione, ovvero di compimento dell’azione richiesta. Chiaramente la regola deve tenere conto anche di tanti altri aspetti del sito come chiarezza espositiva, costruzione della fiducia e facilità di navigazione.
- Monospace: come lascia intendere il nome stesso, i monospace sono font le cui lettere dell’alfabeto rinomatamente più larghe occupano lo stesso spazio delle altre. La lettera M o W, per esempio, vengono incasellate nel medesimo spazio della L, della A o della D. Alcuni sono molto ampi, quindi occhio a dove posizionarli.
Queste categorizzazioni possono anche sovrapporsi, per esempio scegliendo un font di tipo Serif handwriting oppure uno Display monospace. Più utilizzerai i font e più imparerai a conoscerli. Difatti dopo poco tempo anche tu inizierai ad innamorarti di particolari font e vivrai l’esperienza di sceglierli per qualsiasi lavoro grafico dovrai realizzare.
Come scegliere il font
Ci sarebbe da scrivere un trattato sulla scelta dei font, ma per questioni di spazio dobbiamo essere sintetici ed efficienti. Allora come possiamo aiutarti a imparare a scegliere i font? La prima dritta che ci viene in mente è quella di seguire la scaletta precedente per scegliere il giusto font in base alla sua categorizzazione. Questo perché il sito deve essere prima di tutto ben leggibile, dato che è proiettato su uno schermo illuminato e che deve essere visibile anche in uno spazio piccolo, come quello dello smartphone. Se vuoi trovare buoni abbinamenti dovrai guardarti intorno e visualizzare a occhio come altri grafici professionisti sono soliti abbinare font diversi. Scegli sempre ispirandoti ai migliori e non trascurare il fatto che la bellezza estetica di una pagina web è relativa, mentre la funzionalità è assolutamente obiettiva.
Come usare i Google Fonts
Come usare al meglio i font di Google? Impara a selezionarli usando la barra di navigazione in alto e prenditi un po’ di tempo per guardare gli effetti di questi tramite la barra dove puoi inserire il tuo testo. Poi annota il nome del font e provalo sul tuo sito web in costruzione. Purtroppo i temi di WordPress mostrano solo un elenco dei nomi dei font, quindi, a meno che tu non li conosca tutti a memoria, dovrai sempre tornare sulla pagina di Google Fonts e verificarne l’aspetto. Non usare più di tre font per uno stesso sito web, altrimenti l’effetto diventerà subito disordinato e confusionario. Per tutto il resto dai spazio alla tua fantasia senza mai trascurare l’usabilità del sito.
Pubblicato: | Aggiornamento: