Minifica CSS
Incolla il tuo foglio di stile: commenti, spazi e a-capo superflui spariscono in un clic, con la percentuale di byte risparmiati.
Perché minificare il CSS?
Ogni spazio, a-capo e commento in un foglio di stile sono byte che il browser scarica ma non usa: sulla maggior parte dei CSS scritti a mano la minificazione taglia il 15–30% del peso. Un file più leggero significa First Contentful Paint più rapido, un punteggio migliore nei Core Web Vitals e meno dati consumati da chi naviga da mobile. È una delle ottimizzazioni più semplici e senza controindicazioni: il CSS minificato è identico per il browser.
Cosa rimuove (e cosa non tocca) questo strumento
Vengono eliminati i commenti /* … */, gli a-capo, i rientri, gli spazi attorno
a parentesi graffe, due punti, virgole e combinatori, e il punto e virgola finale prima di
}. Le stringhe tra apici e i contenuti di url(…) vengono protetti e
restituiti intatti: un content: "a b" o un percorso con spazi non vengono
alterati. Selettori, proprietà e valori restano esattamente come li hai scritti.
La compressione del server fa già metà del lavoro
Quasi tutti i server inviano il CSS compresso con gzip o brotli, e quegli algoritmi sono bravissimi proprio con il testo ripetitivo: spazi, rientri e nomi di proprietà che tornano mille volte si comprimono benissimo. Su un foglio già compresso, la minificazione guadagna molto meno di quanto suggerisca il calo di caratteri.
Il guadagno resta comunque reale per due motivi: il file occupa meno memoria dopo la decompressione e il browser lo analizza più in fretta. Su un sito piccolo si parla di pochi kilobyte, su un progetto con dieci fogli di stile la somma comincia a contare.
Quello che un minificatore non deve toccare
Dentro le stringhe e gli URL gli spazi sono contenuto, non formattazione: togliere uno spazio dentro content: "a b" cambia quello che si vede sulla pagina. Lo stesso vale per il contenuto dei data: incorporati, dove un carattere in meno rompe l'immagine.
L'altro punto delicato sono i calcoli e i selettori: dentro calc() gli spazi attorno a più e meno sono obbligatori per la sintassi, e nel selettore a > b lo spazio si può togliere mentre in a b no, perché lì lo spazio È l'operatore di discendenza.
Il file minificato non si modifica
Un CSS minificato è un file generato, non un sorgente: si modifica l'originale e si rigenera. Correggere direttamente il file minificato porta a due versioni divergenti, e la prima volta che qualcuno rigenera, la correzione sparisce senza lasciare traccia.
Per lo stesso motivo il minificato non si mette sotto controllo di versione se il progetto ha già una fase di costruzione: sono migliaia di righe che cambiano tutte a ogni build e rendono illeggibile la storia. Se invece il sito è fatto a mano, tenere entrambi i file è l'unica strada, e allora vale la regola di sopra.
Strumenti vicini
Per il JSON c'è Formatta e valida JSON, e se il CSS è illeggibile perché è già minificato, il verso opposto è dentro lo stesso strumento. Per generare le regole invece che ripulirle, guarda Generatore gradienti CSS.