Utilizza i caratteri variabili

I caratteri variabili sono una tecnologia avanzata che consente a un singolo file di caratteri di contenere più stili e variazioni, come diversi spessori, larghezze e dimensioni ottiche. A differenza dei caratteri tradizionali, che richiedono file separati per ogni stile (ad esempio, grassetto, corsivo, condensato), un carattere variabile può regolare dinamicamente queste caratteristiche all’interno di un singolo file.

I caratteri variabili presentano diversi vantaggi rispetto ai caratteri tradizionali:

• Controllo: con i caratteri tradizionali, sei limitato a caratteristiche predeterminate. Ad esempio, potresti dover scegliere tra uno spessore di 400 o 600. Con i caratteri variabili hai il controllo completo, permettendoti di scegliere uno spessore di 475 se è la soluzione migliore per il tuo design.
• Prestazioni: utilizzando un singolo file di caratteri che include tutte le variazioni, i caratteri variabili possono ridurre il numero di richieste HTTP e la dimensione complessiva del file necessaria per caricare diversi stili di caratteri, migliorando le prestazioni del sito web.
• Tipografia reattiva: i caratteri variabili consentono regolazioni dinamiche alla tipografia in base alle dimensioni dello schermo, alla risoluzione o alle preferenze dell’utente. Ad esempio, un carattere potrebbe diventare più condensato su schermi più piccoli per risparmiare spazio o aumentare il contrasto a dimensioni più piccole per una migliore leggibilità.
• Integrazione CSS: i caratteri variabili possono essere controllati tramite CSS. Proprietà come `font-weight`, `font-stretch` e `font-style` possono essere regolate con valori oltre il solito set fisso, fornendo un controllo più granulare. Ciò significa anche che puoi aggiungere animazioni ai caratteri variabili.

Aggiungi caratteri variabili

Prima di utilizzare i caratteri variabili, devi importarli utilizzando l’amministrazione di WP. 

Nota: i caratteri variabili hanno diverse variabili che puoi utilizzare per regolarli. Larghezza e spessore sono i due più comunemente usati e questi due sono supportati in Elementor.  

Per aggiungere un carattere variabile:

1. Individua un carattere variabile che desideri utilizzare e scaricalo sul tuo PC. Potrebbe essere necessario decomprimere il file.
   I caratteri variabili sono disponibili presso numerosi fornitori, tra cui Google Fonts. In Google Fonts puoi controllare il peso e la larghezza minimi e massimi facendo clic su Type Tester e utilizzando i cursori per calcolare i valori minimi e massimi.
   
   Registra il peso e la larghezza minimi e massimi del carattere. Ti servirà in seguito.
   
2. Vai all’amministrazione di WP e vai su Elementor>Caratteri personalizzati.
   Viene visualizzata la schermata Caratteri personalizzati.
   
3. Fai clic su Aggiungi nuovo.
   
4. Fai clic su Aggiungi carattere variabile.
   Viene visualizzata la schermata di caricamento.
   
5. Fai clic su Carica e vai alla posizione del file del carattere.
   
6. Seleziona il file del carattere variabile e, in basso a destra, fai clic su Seleziona file ttf.
   
7. Nella casella di testo Inserisci famiglia di caratteri, dai un nome al carattere.
   
8. Seleziona Larghezza e inserisci la larghezza minima e massima del tuo carattere. Queste informazioni sono disponibili dal creatore del carattere.
9. Seleziona Spessore e inserisci lo spessore minimo e massimo del tuo carattere. Queste informazioni sono disponibili dal creatore del carattere.
   
   Note

   È necessario impostare uno spessore e/o una larghezza minimi e massimi affinché il carattere si comporti correttamente. Non tutti i caratteri contengono sia la variabile larghezza che quella spessore. In questi casi, seleziona semplicemente la variabile pertinente.
   
   
10. Fai clic su Pubblica/Aggiorna.
    Ora puoi utilizzare questo carattere nell’editor di Elementor.

Utilizza i caratteri variabili nell’editor di Elementor

Dopo aver installato i caratteri variabili, puoi utilizzarli in qualsiasi widget che abbia un’opzione di tipografia. Nell’esempio seguente utilizzeremo un carattere variabile nel widget Titolo.

Per utilizzare i caratteri variabili in un widget:

1. Trascina un widget che contiene testo nell’area di disegno.
   
2. Nel pannello, seleziona l’opzione Tipografia. Questa opzione si trova solitamente nella scheda Stile.
3. Fai clic sull’icona a forma di matita .
   Viene visualizzato un elenco di caratteri e opzioni di carattere.
   
4. Seleziona un carattere variabile. Questi caratteri si trovano nella parte superiore dell’elenco dei caratteri in una sezione etichettata come Caratteri variabili.
   
5. Utilizza i cursori Larghezza e/o Spessore per determinare l’aspetto del carattere.
   Ora il tuo testo appare esattamente come lo desideri.