93 318 54 36

Guida ai caratteri Google: come scegliere i caratteri per il tuo sito web?

25/05/2022
Elisabetta De Leon

Come avrai capito, i Google Fonts sono una serie di caratteri contenuti in una vera e propria libreria topografica, nello specifico si tratta di un insieme di interfacce di programmazione delle applicazioni o meglio conosciute come API. In particolare, consente a tutti gli utenti di utilizzare i caratteri web nella propria applicazione o sito web. In particolare sono utilizzabili liberamente poiché dotati di licenza gratuita, nel dettaglio si tratta di una libreria che mette a disposizione di tutti una vera e propria directory web interattiva, fondamentale per rendere più semplice la selezione e la gestione dei font tramite Android. e CSS.

Google mette a disposizione questo servizio e tutti i caratteri presenti e la larghezza di banda sono decisamente gratuiti.

Per questo motivo è necessario scegliere con attenzione i font più adatti al proprio caso, in modo da ottimizzare le prestazioni tecniche e rendere il sito gradevole alla vista dell'utente.

Cos'è Google Fonts?

Google Fonts è una licenza gratuita per semplificare i caratteri tramite CSS e Android. Google Fonts è stato creato per semplificare la ricerca dei font ed è disponibile gratuitamente con licenze open source. Possono essere utilizzati sia per progetti commerciali che non commerciali.

All'interno del sito, attraverso l'apposito comando di ricerca, possiamo scegliere il font esteticamente più adatto al nostro caso e recuperarlo all'interno del nostro sito, per far sì che il testo di una determinata pagina sia formattato secondo questi dettami.

Con la definizione delle prime specifiche CSS, infatti, è nata l'esigenza che le risorse web possano recuperare facilmente i font non da terminali locali ma da server, per garantire a tutti la corretta visualizzazione.

Google Web Fonts, oggi Google Fonts, ha sostituito il precedente TypeKit nel fornire font da incorporare sui siti web: basta infatti integrare l'apposito codice nell'HTML o nel CSS del sito per garantire la stessa visualizzazione su tutti i dispositivi.

I font che possiamo scegliere si dividono in:

  • Serif (serif font), piccole estensioni alle estremità delle lettere che sembrano avvicinarle tra loro, come Droid Serif;
  • Sans Serif (carattere sans serif), come Roboto e Open Sans;
  • Scritto a mano (caratteri che assomigliano alla scrittura a mano), come Shadows Into Light;
  • monospace (font i cui caratteri hanno la stessa larghezza e che hanno uno stile che ricorda quello delle macchine da scrivere) come Inconsolata
  • schermi (font con caratteri molto ravvicinati) come Lobster e Poiret One, generalmente adatti a progetti di grandi dimensioni

I font vanno scelti d'accordo, senza esagerare per non sovraccaricare troppo il sito; optare per più di due o tre caratteri per pagina renderebbe difficile la lettura.

Vantaggi dell'utilizzo di Google Fonts

I Google Fonts, come accennato, sono risorse estetiche del sito web che possono aumentare il tempo di permanenza e le conversioni CTA. Offrono infatti diversi vantaggi:

  • Libreria di caratteri gratuita e sicura (fornita da Google)
  • Font gratuiti per progetti commerciali e non commerciali (non si applicano restrizioni di licenza)
  • migliorare la leggibilità della pagina
  • molto leggeri (rendono più veloce il caricamento della pagina web che li ospita)
  • molto versatile - disponibile in numerose versioni per soddisfare le esigenze visive e di formattazione di tutti
  • assicurati che i caratteri siano compatibili con tutti i siti e le app
  • esteticamente attraente

Tutti i Google Fonts soddisfano precisi standard della community di Google e risultano altamente compatibili con la maggior parte dei siti.

Perché usarli?

Come sappiamo, anche i font utilizzati possono avere un impatto significativo sui tempi di caricamento delle pagine web e sulla leggibilità dei contenuti. Si traducono, quindi, in elementi importanti per l'esperienza d'uso della pagina, che a sua volta può influenzare il posizionamento attraverso i segnali di soddisfazione prodotti dall'utilizzo da parte dell'utente.

I Google Fonts sono progettati da Google per inviare il file nella maniera più leggera possibile in relazione alle tecnologie utilizzate per il suo utilizzo.

Grazie ad un tempo di caricamento più breve possiamo ottenere una frequenza di rimbalzo inferiore sul nostro sito web, aumentando le possibilità di conversione. Un font di difficile lettura, infatti, scoraggia il raggiungimento del fondo pagina e invita l’utente a uscire prima di rispondere alla call to action.

Quali Google Fonts scegliere per il nostro sito?

La tipografia può essere molto preziosa per il tuo sito. Un carattere appropriato per il tuo progetto riflette lo stile estetico del sito web, è molto leggibile e trasmette una certa personalità.

Nello store sono presenti più di 1040 font tra i quali troveremo sicuramente quello giusto per noi. Inoltre, come abbiamo accennato, i caratteri sono disponibili gratuitamente, quindi possiamo sperimentarne l'uno o l'altro finché non troviamo quello che meglio si adatta al nostro sito. Prendiamoci quindi un po' di tempo per scegliere il carattere giusto per il design del nostro sito, che incoraggerà più letture.

Per scegliere i Google Fonts più adatti al nostro sito dobbiamo prestare attenzione a diversi aspetti come:

  • leggibilità
  • professionalità in linea con lo stile del sito
  • dimensioni del progetto web adatte
  • tema del sito

Tra i font più apprezzati in circolazione abbiamo:

  • Roboto (carattere di sistema per Android)
  • Kinsta (utilizzato da Google per alcuni siti web)
  • Source Sans Pro (il primo carattere open source di Adobe)
  • Raleway (carattere speciale di grande formato)
  • allegro
  • nunito sans
  • Work Sans (adatto per l'uso su schermo)

I caratteri Google sono gratuiti

La licenza, come già detto, è gratuita ed, essendo open source, non sono previsti costi. Tuttavia è bene sapere che alcuni caratteri sono distribuiti tramite la licenza Apache. Tuttavia, in entrambe le situazioni esiste la possibilità di utilizzarli anche per uso commerciale. Inoltre, questa raccolta è servita anche dai servizi web SkyFonts di Monotype e Edge Web di Adobe e anche da Typekit di Monotype.

Recentemente, più precisamente dal 2021, questo progetto è stato esteso anche alle icone, poiché attraverso un primo set di simboli composti da esigenze comunicative generali e icone materiali che offrono la possibilità di scaricare direttamente sul desktop gli elementi per la fruizione in formato digitale valido per sia iOS, Web che Android.

Come installare Google Fonts sul sito

I caratteri Google possono essere incorporati dal sito in cui vengono inseriti o scaricati e incorporati tramite FTP, nonché utilizzati per progetti di stampa.

Prima di scaricare uno o più font da Google Fonts è importante sceglierli. Il catalogo online comprende sicuramente innumerevoli personaggi. Questo servizio, oltre a soddisfare tutte le esigenze degli utenti da questo punto di vista, offre la possibilità di cercare velocemente quelli che più vi piacciono e che intendete utilizzare sulla vostra piattaforma. In particolare la pagina ufficiale di Google Fonts permette di decidere diversi filtri per effettuare velocemente e facilmente una ricerca precisa, nel dettaglio c'è la possibilità di intervenire nei seguenti settori:

  • CERCA - Questo campo ti permette di digitare il nome esatto di un font che già conosci;
  • Anteprima del testo - ti permette di vedere un'anteprima reale dell'effetto ottico del font che vuoi utilizzare, questo avviene in particolare quando scegli un testo base o aggiungi una frase secondo le tue preferenze;
  • Dimensione carattere - affinare le misure in pixel del testo presentato in fase di anteprima ;
  • categorie - Seleziona il tipo di carattere in base alle 5 sezioni in cui si trovano tutti i caratteri Google;
  • Lingua - Limita la ricerca all'alfabeto di una lingua specifica;
  • proprietà Carattere: scegli determinate proprietà del carattere, come il numero di stili, inclinazione, peso e larghezza.

Come installare Google Fonts

  • visita il sito di Google Fonts
  • seleziona il carattere in questione
  • Fare clic su Scarica per scaricarlo in formato zip
  • decomprimere la cartella, fare clic con il tasto destro sul file ttf e selezionare installa:

In questo modo potremo utilizzare gli stessi font del blog o del sito per creare ebook o grafica secondo lo stile web.

Prima di tutto, dovresti controllare se il tema del nostro sito web integra già Google Fonts, poiché gli ultimi temi premium sono già configurati per ospitarli. Altrimenti possiamo installare un plugin come Easy Google Fonts o Google Fonts Typography per introdurli.

Se non vogliamo installare un altro plugin possiamo ricorrere alla chiamata through l'API di Google Fonts . In questo caso è necessario aggiungere un collegamento tra il foglio HTML e il foglio di stile.

La piattaforma ci fornisce il codice appropriato da incorporare nel file della pagina HTML per semplificare il recupero dei caratteri selezionati sul nostro sito.

Come aggiungere caratteri Google a WordPress

È bene sapere che esistono due metodi principali per includere Google Fonts direttamente nei tuoi progetti, nello specifico per uno stile WordPress, devi installare un determinato plugin dove c'è la possibilità di delegare il lavoro o l'altra opzione per aggiungere un carattere prevede la procedura manuale.

Innanzitutto, se il lavoro viene svolto utilizzando l'ambiente WP, bisogna analizzare che il tema non include contemporaneamente Google Fonts per impostazione predefinita. Per verificare questo aspetto basta controllare le prestazioni nel pannello di configurazione corrispondente. Se questo modulo non è presente c'è un'altra opzione ovvero scaricare dei plugin come Google Font Typography o Easy Google Fonts, installandolo direttamente nel pannello, a questo punto potete proseguire con la scelta del font che più attira la vostra attenzione.

Inoltre, se vuoi utilizzare le API di Google Fonts per inserire i font direttamente sui siti web tramite la procedura manuale, non dovrai fare alcuna programmazione perché ti basterà semplicemente integrare un apposito link al foglio di stile nel documento HTML . Pertanto è necessario citare la fonte in stile CSS. Semplicemente, per effettuare questo passaggio in modo rapido e tranquillo, ti basterà copiare e incollare il codice indicato nell'etichetta del collegamento che si trova appositamente nella cartella denominata intestazione del sito. Infine, è essenziale utilizzare il CSS risultante per applicare la regola ai componenti HTML.

Conclusioni

Ormai avrai sicuramente capito cosa sono i Google Fonts e come è necessario installarli sul tuo sito web, pagina o blog per poterli utilizzare.

I font rappresentano una parte importante nel mondo della grafica e dei siti web dove rendono unico e speciale lo stile della piattaforma. Scegliere i Google Fonts è sicuramente un passo importante poiché definiranno visivamente lo stile. Dagli studi effettuati dal web design è emerso che in questo settore è necessario seguire alcune regole per avere un risultato perfetto secondo le proprie preferenze ed esigenze, in particolare queste ultime si riferiscono specificatamente a colori, forme e font.

Per quanto riguarda i font, questi ultimi devono essere: di facile lettura e comprensione, se il font scelto non è di facile lettura si consiglia di utilizzarlo graficamente in alcune immagini tramite elementi grafici, eseguire uno dei controlli di compatibilità cross browser, utilizzare Da uno a un massimo di tre font con stili diversi, utilizzare font classici utilizzando un font serif per titoli e intestazioni e sans-serif invece per i testi.

Hai bisogno di aggiornare il tuo sito web?

Hai bisogno di uno dei nostri servizi di web design? In IndianWebs Abbiamo una vasta esperienza e un team di programmatori e web designer in diverse specialità, siamo in grado di offrire una vasta gamma di servizi nella creazione di pagine web personalizzate. Qualunque sia il tuo progetto, lo affronteremo.