Esistono 1052 diverse famiglie di Google Font disponibili gratuitamente (nel momento in cui scriviamo questo articolo). Sono davvero un sacco! Quindi non c’è da meravigliarsi se avete bisogno di aiuto per trovare l’opzione perfetta nella lista dei migliori Google Fonts. L’abbiamo preparata per voi!

In questo articolo condivideremo anche alcune buone pratiche per l’utilizzo di Google Fonts in WordPress.

La scelta di un font è più di una semplice scelta estetica; può avere un effetto sostanziale sul tasso di rimbalzo del vostro sito e sui tassi di conversione, soprattutto se scegliete un font difficile da leggere. Pertanto, vale la pena di prendersi un po’ di tempo per scegliere la famiglia di Google Fonts perfetta per il vostro sito web, piuttosto che usare il primo font che vi capita a tiro.

Se avete bisogno di ancora più font, date un’occhiata al nostro articolo su Oltre 50 Font Moderni da Usare sul Tuo Sito Web WordPress nel 2021.

Perché Usare Google Fonts?

Ci sono migliaia di repository di font su internet, quindi cosa rende Google Fonts così speciale?

Catalogo Google Fonts.

Catalogo Google Fonts.

In primo luogo, è gratuito! Inoltre, i Google Fonts sono mantenuti e forniti da Google, il che significa che sono garantiti per essere sicuri. Naturalmente ci sono un sacco di siti web dove è possibile scaricare font gratuiti, ma chi sa cos’altro si può prendere con quei file?

Anche la qualità dei font su tali siti web può essere a volte discutibile.

Google ha curato una selezione di oltre mille font di alta qualità. Se non siete web designer con un occhio perfetto per la tipografia, è una scelta più sicura.

In secondo luogo, non ci sono contorte restrizioni di licenza. Tutti i font nel catalogo di Google Fonts sono open source e liberi per l’utilizzo in progetti commerciali. Potete scaricarli o incorporarli sul vostro sito, e potete anche usarli in progetti di stampa.

Anche se non c’è una licenza unificata, la maggior parte dei font nel repository usa la Open Font License.

Licenza Open Font.

Licenza Open Font.

Altri “font gratuiti” sono raramente gratuiti includono con tutta una serie di confuse restrizioni di licenza che potrebbero crearvi qualche problema se fate un errore. Google Fonts, invece, non si porta dietro questo peso.

E infine, aggiungere i Google Fonts al vostro sito web è molto facile grazie all’API di Google Fonts. In alternativa, potete scaricarli individualmente e caricarli sul vostro server web via FTP/SFTP.

Mentre i Google Font tendono a essere semplici e forse non così appariscenti come alcuni font a pagamento, certamente battono i fonts web-safe che vengono preinstallati con i principali sistemi operativi, che altro non sono che gli stessi font che chiunque ha visto migliaia di volte.

Esistono 1052 diverse famiglie di Google Font disponibili gratuitamente... ti senti già travolto dalle possibilità di scelta? 🤯 Restringi il campo con l'aiuto di questa guidaClick to Tweet

Cosa Cercare in un Font Google

Se c’è una cosa che dovreste imparare quando disegnate un sito web, è come scegliere un Google Font adatto al vostro progetto. La tipografia è capace di migliorare o peggiorare il vostro sito.

Può sembrare un dettaglio insignificante, ma può fare la differenza tra qualcuno che lo abbandona presto o chi rimane per leggerlo tutto o diventare un cliente fedele.

Scegliere il font giusto è qualcosa che i graphic designer imparano a padroneggiare dopo anni, ma tenendo alcuni principi in mente, potete scegliere un bel font per il vostro sito web.

I 10 Migliori Font di Google nel 2021 (Secondo la Saggezza Popolare)

Quindi, come si fa a sviluppare una lista dei migliori Google Fonts quando la scelta del “migliore” è soggettiva? Non vogliamo che l’intera lista sia di parte, quindi ci serviremo dei dati per costruire una lista dei Google Font più popolari.

Useremo l’analisi di Google Fonts per fidarci della saggezza della folla. Con oltre 50 trilioni di visualizzazioni totali di font, Google ha un po’ di dati da cui attingere.

Poi, andremo un po’ oltre i numeri grezzi di popolarità e sceglieremo alcuni font HTML emergenti che stanno guadagnando popolarità.

Iniziamo con la lista!

1. Roboto

Roboto.

Roboto.

Occupa il primo posto da molto tempo ed è anche il font scelto da Kinsta: Roboto è un sans-serif offerto da Christian Robertson che Google ha sviluppato come font di sistema per Android. Ora è molto popolare, è disponibile in 12 stili diversi, e fa molteplici apparizioni nelle analisi di Google Fonts.

Se Roboto è il font più popolare, Roboto Condensed è il sesto font più popolare, e Roboto Slab fa un’apparizione anche al numero 12!

2. Open Sans

Open Sans.

Open Sans.

Open Sans Condensed è un font altamente leggibile commissionato da Google e ispirato al suo predecessore Droid Sans. Google usa Open Sans su alcuni dei suoi siti web e sui suoi annunci stampa e web. Open Sans Condensed, il suo font gemello, detiene il tredicesimo posto più popolare su Google Fonts.

3. Lato

Lato.

Lato.

Lato è un’altra scelta popolare creata da Łukasz Dziedzic. Ha una bella storia dietro il suo design che bilancia obiettivi contrastanti, con il risultato di un font sans-serif unico e leggero.

4. Montserrat

Monstserrat.

Monstserrat.

Montserrat è un font sans-serif di Julieta Ulanovsky, che vive nell’omonimo quartiere di Montserrat a Buenos Aires. Con 18 stili diversi che vanno dal più leggero al più pesante, vi offre un’ampia scelta.

5. Oswald

Oswald.

Oswald.

Oswald è un font sans-serif originariamente sviluppato da Vernon Adams. È stato progettato pensando al font Alternate Gothic, come è evidente dai suoi tratti audaci.

6. Source Sans Pro

Source Sans Pro.

Source Sans Pro.

Source Sans Pro è un font sans-serif creato per Adobe e il primo font open-source di Adobe. Realizzato da Paul Hunt, il suo lettering leggero lo rende pulito e leggibile.

7. Slabo 27px/13px

Slabo.

Slabo.

Slabo è un font serif sviluppato da John Hudson di Tiro Typeworks. Questo font è specificamente progettato per certe dimensioni – 27px o 13px, a seconda delle vostre esigenze.

8. Raleway

Raleway

Raleway

Con i suoi 18 stili diversi, Raleway è un altro font sans-serif di grande formato, inizialmente creato da Matt McInerney. Se vi piace Raleway e state cercando qualcosa di unico, Raleway Dots offre uno stile simile con un approccio punteggiato che può funzionare per grandi intestazioni.

9. PT Sans

PT Sans.

PT Sans.

PT Sans è stato sviluppato per i Public Types della Federazione Russa e, come tale, include sia caratteri latini che cirillici. Ci sono anche molti altri font nella famiglia PT, comprese alcune opzioni serif.

10. Merriweather

Merriweather.

Merriweather.

Il nome di Merriweather evoca l’idea di un design piacevole, e questo è esattamente ciò che intendevano le persone che lo hanno progettato. Anche se non è così popolare, Merriweather Sans è un progetto gemello che si accoppia eccezionalmente bene con esso.

Font Bonus ed Emergenti

Secondo i numeri, i dieci font di cui sopra sono i più popolari di Google Fonts. Ma mostrare solo le opzioni più popolari rende un disservizio ai grandi font emergenti che non hanno ottenuto l’esposizione necessaria per apparire nelle classifiche.

Ecco alcuni dei nostri preferiti che ancora non sono apparsi in cima alle liste.

11. Noto Sans / Serif

Noto Sans / Serif.

Noto Sans / Serif.

Noto è un font commissionato da Google che è disponibile sia in versione serif che sans-serif. Sta ricevendo aggiornamenti regolari, e ora ci sono ben oltre 100 font Noto, con altri che arrivano continuamente!

L’obiettivo di Noto è quello di coprire tutti gli alfabeti e i caratteri di varie lingue mentre il suo design distinto rimane armonioso tra centinaia di famiglie di font diverse. Tra i suoi font derivati troviamo i popolari Noto Sans KR e Noto Sans JP.

12. Nunito Sans

Nunito Sans.

Nunito Sans.

Nunito Sans è un’opzione sans-serif che sta rapidamente crescendo in popolarità. Il suo uso è triplicato tra il 2018 e il 2019, e diventa più popolare di anno in anno.

13. Concert One

Concert One.

Concert One.

Concert One è un bizzarro carattere arrotondato che funziona alla grande per i titoli. Il suo design non convenzionale attira senza dubbio lo sguardo.

14. Prompt

Prompt.

Prompt.

Prompt è un sans-serif proposto dallo studio di communication design tailandese Cadson Demak. Non contiene loop (l’equivalente tailandese di sans-serif) e include sia caratteri thai che latini.

15. Work Sans

Work Sans.

Work Sans.

Work Sans è un font sans-serif ottimizzato per l’uso su schermo. I designer raccomandano di usare gli stili middleweight per qualsiasi testo tra i 14px e i 48px.

Hai bisogno di un hosting incredibilmente veloce, affidabile e completamente sicura per il tuo sito WordPress? Kinsta fornisce tutto questo e un supporto di classe mondiale 24/7 da parte di esperti di WordPress. Scopri i nostri piani.

Come Creare le Migliori Combinazioni di Google Fonts

Se pensavate che provare a scegliere un font da Google Fonts fosse difficile, aspettate a provare l’accoppiamento sul vostro sito! Per fortuna, questo non è un problema che dovete risolvere (a meno che non lo vogliate) perché potete usare un paio di modi per trovare le migliori combinazioni di Google Fonts.

In primo luogo, lo stesso sito web di Google Fonts suggerisce gli abbinamenti più popolari se si scorre la pagina verso il basso:

Scoprire gli abbinamenti popolari di Google Fonts.

Scoprire gli abbinamenti popolari di Google Fonts.

Oltre a questo, potete anche usare un sito come Font Pair per avere più suggerimenti.

Migliori Pratiche per l’Utilizzo di Google Fonts su WordPress

Una volta che avete trovato i font perfetti per il vostro progetto, ecco alcune buone pratiche per utilizzare Google Fonts su WordPress.

Limitare il Numero di Pesi dei Font Che Usate

Alcuni di questi font – come Montserrat e Raleway – hanno 18 pesi diversi. Se questo, da un lato, è un bene per ampliare le vostre opzioni, non vi conviene caricare tutti i 18 pesi sul vostro sito WordPress perché i tempi di caricamento aumenteranno moltissimo.

Seguire questa regola è molto importante!

Per la maggior parte dei font, una buona regola empirica è quella di usare al massimo tre pesi:

Molti siti WordPress che vediamo al giorno d’oggi saltano addirittura il corsivo e usano solo due diversi pesi di carattere.

Se state incorporando Google Fonts in autonomia, potete scegliere esattamente quali pesi includere. Per prima cosa, visitate la pagina di un font e poi fate clic su Select this style accanto a quelli che volete.

Scegliere un font in Google Fonts.

Scegliere un font in Google Fonts.

La maggior parte dei temi WordPress oggi includono modi semplici per scegliere quali Google Fonts e pesi si desidera utilizzare. Ma non tutti coloro che sviluppano temi si concentrano sulle prestazioni. Quindi, in alcuni casi, potrebbe essere meglio disabilitare i Google Fonts nel vostro tema e aggiungerli da voi.

Anche i font variabili stanno iniziando a diventare popolari e sono supportati da tutti i browser moderni. Questi sono fantastici perché permettono a un file di font di trasformarsi grazie a proprietà diverse. Google Fonts ha un sacco di font variabili tra cui scegliere, e potete anche restringere la vostra ricerca a quelli specifici.

"Setting

Considerate di Ospitare Localmente i Font di Google

Come alternativa al servire i font dal server di Google, potete anche ospitare i font localmente, offrendo vantaggi in termini di prestazioni. Tuttavia, ricordate che la maggior parte dei font di Google sono probabilmente già presenti nella cache dei browser delle persone. Quindi vi consigliamo di fare i vostri test di performance.

Se state usando un font premium diverso dai font di Google, come il font “Brandon” che usiamo sul nostro sito Kinsta, ospitarli localmente (e servirli dal vostro CDN) è la strada migliore. Per saperne di più su questo argomento, controllate i nostri articoli su come ospitare i font localmente.

Scegliere un Font Che Verrà Aggiornato in Futuro

I font sono proprio come i plugin e i temi di WordPress: nel tempo, ricevono aggiornamenti e correzioni che li rendono ancora migliori. E mentre la posta in gioco non è così alta come per i plugin di WordPress, può essere vantaggioso scegliere un font che riceve aggiornamenti regolari. Per esempio, la famiglia Noto di Google ha ricevuto aggiornamenti regolari dal 2014.

Poiché la maggior parte dei font su questa lista sono popolari, è molto probabile che qualsiasi font su questa lista riceverà aggiornamenti e miglioramenti regolari. E se decidete di optare per un font fuori dalla lista, assicuratevi che sia abbastanza popolare da ottenere attenzione anche nel futuro.

Non Dimenticate l’Accessibilità

Secondo l’Organizzazione Mondiale della Sanità, in base ai dati raccolti nel 2015, si stima che 253 milioni di persone vivano con problemi di vista: 36 milioni sono cieche e 217 milioni hanno problemi di vista che vanno da moderati a gravi. Inoltre, il numero di persone con qualche forma di menomazione è salito a 2,2 miliardi a partire dal 2021.

Quando usate Google Fonts, potete controllare il suo aspetto con i CSS, come il colore e la dimensione. Quindi non dimenticate di seguire le linee guida 2.0 per l’accessibilità dei contenuti web (Web Content Accessibility Guidelines o WCAG). Questo assicurerà che il vostro contenuto sia facilmente accessibile a chiunque.

Seguire queste linee guida renderà il contenuto accessibile a una gamma più ampia di persone con disabilità, tra cui cecità e ipovisione, sordità e ipoacusia, difficoltà di apprendimento, limitazioni cognitive, movimento limitato, disabilità del linguaggio, fotosensibilità, e combinazioni di queste. – Web Content Accessibility Guidelines (WCAG) 2.0

Una linea guida da tenere sempre in considerazione è il contrasto dei colori. Il font che avevamo scelto per un vecchio design del sito di Kinsta era un po’ troppo chiaro, e diverse persone ci avevano espresso le loro preoccupazioni perché lo rendeva difficile da leggere. L’ultima cosa che volete è pubblicare un contenuto fantastico, ma che si converta in uno sforzo per la vista delle persone!

Potete usare uno strumento come il Color Contrast Checker di WebAIM per verificare se i colori dei vostri font superano le raccomandazioni ufficiali. Per esempio, potete vedere che i colori degli articoli del nostro blog ora superano il test. 👍

Strumento di controllo del contrasto di colore.

Strumento di controllo del contrasto di colore.

Come Aggiungere Google Fonts a WordPress

Una volta scelti uno o due font, il passo finale è quello di aggiungerli al vostro sito web. Grazie a Google Fonts, questo compito è ancora più facile del solito.

Supponiamo che vogliate portare un font sul vostro sito web. In questo caso, avete tre opzioni: installare un plugin come Easy Google Fonts o Google Fonts Typography, usare l’API di Google Fonts per caricare il font sul vostro sito, o scaricarlo manualmente e ospitarlo sul vostro sito.

Se avete bisogno di sapere come cambiare i vostri font in WordPress, abbiamo scritto una guida dettagliata per aiutarvi.

Scegliere un font è più di una semplice scelta estetica: può avere un effetto sostanziale sulla frequenza di rimbalzo e sul tasso di conversione del tuo sito 😲 Inizia da qui ⬇️Click to Tweet

Riepologo

I Google Font sono fantastici e utilizzati da milioni di siti web. Rendono il web più piacevole, aperto, veloce e accessibile grazie ai loro solidi principi di tipografia e iconografia.

Per garantire una migliore esperienza complessiva per i vostri visitatori, vi raccomandiamo di seguire le migliori pratiche per i font, come limitare il peso dei font, ospitare i font localmente (se necessario) e attenervi alle linee guida di accessibilità.

Ora tocca a voi: quali sono i vostri font e coppie di font preferiti da Google Fonts? Fatecelo sapere qui sotto nei commenti, e non dimenticate di leggere la nostra guida approfondita sui font WordPress!


Se questo articolo ti è piaciuto, allora amerai la piattaforma di hosting WordPress di Kinsta. Metti il turbo al tuo sito web e ottieni supporto 24/7 dal nostro team esperto di WordPress. La nostra infrastruttura alimentata da Google Cloud si concentra su scalabilità, prestazioni e sicurezza. Lascia che ti mostriamo la differenza di Kinsta! Scopri i nostri piani