Tipografia variabile sui sitiaziendali: quando vale la pena.

Un font non è mai solo un font. È un file che viaggia sulla rete, un pezzo di identità che arriva prima delle parole e, sempre più spesso, una voce nel bilancio delle performance del sito.

Negli ultimi anni la tipografia variabile è passata dall'essere una curiosità per designer a diventare una scelta tecnica che riguarda direttamente chi gestisce un sito aziendale. Un solo file al posto di quattro, sei, otto pesi diversi. Interpolazioni fluide tra regular e bold, tra condensed ed extended. Sulla carta, un compromesso perfetto tra chi difende l'identità visiva e chi ogni mese guarda i Core Web Vitals di Google. Nella pratica, come sempre, dipende. Vale la pena capire quando la scelta ha senso e quando è puro esercizio di stile.

1. cos'è davvero un font variabile (senza tecnicismi inutili)

Un font tradizionale è un insieme di file separati: uno per il regular, uno per il bold, uno per l'italic, uno per il light. Ogni peso o stile è una richiesta HTTP aggiuntiva e un file da scaricare. Un font variabile, invece, è un unico file che contiene tutte le variazioni possibili lungo uno o più assi: peso, larghezza, inclinazione, a volte anche parametri ottici che adattano il disegno alla dimensione del corpo.

Il risultato pratico è duplice. Da un lato si ottiene molta più flessibilità tipografica: si possono usare pesi intermedi che prima non esistevano, animare transizioni, adattare il testo al contesto. Dall'altro, si potrebbe ridurre il peso complessivo dei font caricati. Il condizionale è d'obbligo, e vedremo perché.

2. l'impatto sui core web vitals, senza narrazioni ottimistiche

Qui si separa il marketing dalla realtà tecnica. Un font variabile con più assi può pesare tra i 100 e i 300 KB, contro i 30-50 KB di un singolo peso statico. Se un sito usa un solo peso, il variabile è quasi sempre uno svantaggio. Se ne usa quattro o cinque, il calcolo cambia radicalmente.

Sui Core Web Vitals, l'effetto principale si vede su due metriche. Il Largest Contentful Paint migliora quando il testo principale è già in un font subsettato e caricato con \`font-display: swap\` o meglio con preload strategici. Il Cumulative Layout Shift beneficia dell'uso di un unico file, perché riduce i "salti" causati da pesi che arrivano in tempi diversi. Sull'INP l'impatto è marginale, salvo animazioni tipografiche pesanti.

*Il font variabile non è automaticamente più veloce: è più veloce se il progetto lo sfrutta davvero.*

3. cosa cambia nella percezione di brand

La tipografia è il tratto identitario più sottovalutato dei brand italiani, soprattutto nelle PMI. Molti siti aziendali usano ancora combinazioni generiche — Roboto, Open Sans, Lato — perché "erano già nel tema WordPress". Un font variabile, se ben scelto, permette di distinguersi senza appesantire.

La percezione cambia soprattutto su tre livelli. La coerenza: transizioni tipografiche fluide tra desktop e mobile, tra titolo e sottotitolo, che restituiscono un'idea di cura. La personalità: assi come la larghezza o l'inclinazione permettono espressività prima riservata a materiali stampati. La reattività: la tipografia può rispondere al contesto, adattarsi alla dimensione della finestra, cambiare peso in dark mode.

Per un brand B2B che vende ingegneria, macchinari o consulenza, questo si traduce in un sito che comunica precisione senza urlarlo. Per un brand consumer, in un tono di voce visivo più riconoscibile.

4. quando ha senso passare, quando no

La scelta non è ideologica. È una questione di casi d'uso reali.

Ha senso passare a un font variabile quando: - Il sito usa già tre o più pesi dello stesso font - Il brand ha investito in un design system e vuole coerenza tra web, app e materiali digitali - Ci sono animazioni tipografiche, hover complessi, transizioni di peso - Si sta pianificando un rebranding e la tipografia è un asset strategico

Non ha senso quando: - Il sito è un one-page istituzionale con un solo peso di testo - Il traffico è prevalentemente da mobile su reti lente e ogni KB pesa - Il font variabile scelto ha assi che non verranno mai usati (si pagherebbe il peso senza il beneficio) - Non c'è un design system a monte, e il variabile diventerebbe una feature tecnica senza direzione

5. l'errore che vediamo più spesso nei siti pmi

Nei progetti che analizziamo, tra Lombardia e Marche, l'errore ricorrente è lo stesso: si carica un font variabile completo — con tutti gli assi disponibili — ma poi in CSS si usano solo due pesi. È come comprare un'auto a sette posti per andare da soli al lavoro.

La soluzione tecnica esiste: si chiama subsetting. Significa generare una versione del font variabile che contenga solo gli assi effettivamente usati, solo i glifi effettivamente necessari (spesso basta il set latin esteso), e caricarla in formato WOFF2. Il risparmio può essere del 40-60% sul peso finale.

Il problema è che questa ottimizzazione richiede competenze specifiche e tempo di setup. Molti temi e template la ignorano. È qui che la differenza tra un sito "fatto bene" e un sito "messo online" diventa misurabile in secondi di caricamento.

6. la domanda giusta da porsi

Prima di chiedersi "conviene il font variabile?", vale la pena chiedersi altre due cose. La prima: quanti pesi diversi usa davvero il sito, oggi, in produzione? Basta aprire il DevTools e contare. La seconda: la tipografia è un elemento strategico del brand, o è un dettaglio funzionale?

Se la risposta alla prima è "uno o due" e alla seconda è "funzionale", allora un font statico ben ottimizzato è la scelta razionale. Se la risposta è "quattro o più" e "strategico", allora il variabile diventa non solo giustificabile, ma probabilmente inevitabile.

*La tipografia variabile non è una moda tecnica né una scorciatoia per performance migliori. È uno strumento che ripaga solo quando c'è un progetto tipografico dietro. Sui siti aziendali dove la scelta del font è stata fatta con criterio, il variabile è quasi sempre la mossa giusta. Su quelli dove la tipografia è un ripensamento, resta un peso in più — letteralmente — senza un ritorno.*