Come comprimere e minimizzare un file CSS

Per ottimizzare un sito web, lavorando sui tempi di caricamento delle pagine, è determinante utilizzare un tool di compressione dei file CSS.

Comprimendo i file CSS presenti nel nostro sito possiamo non solo migliorarne le prestazioni ma ridurre anche le dimensioni del file stesso, togliendo tutti quei caratteri e spazi bianchi superflui per il funzionamento del foglio di stile.

Comprimere un CSS

Uno dei servizi più affidabili che può venirci incontro per tale scopo è CSS Compressor & Minifier. Si tratta di uno strumento online in inglese gratuito e di facile intuizione.

Come Comprimere un file CSS

Nella prima pagina viene spiegato in inglese, il funzionamento del tool e specificato come esso può essere utilizzato sia da esperti che da principianti.

Colleghiamoci alla pagina e come possiamo vedere lo strumento è costituito da 5 riquadri:

  • CSS Input, dove copiare il codice css da comprire. In questa sezione è possibile inserire anche l’URL del file CSS.
  • Code Layout, il tipo di compressione che vogliamo applicare (Highest, High, Standard, Low, Custom).
  • Options, le opzioni che possiamo applicare alla compressione (ON/OFF).
  • Messages, le operazioni che vengono effettuate durante la compressione.
  • Input, il risultato della compressione da copiare e incollare nel nuovo file CSS.

Css Compressor & Minifier

Per lavorare sul tipo di compressione è possibile nel riquadro Code Layout, scegliere tra:

  • Highest: il file sarà molto leggero e illeggibile.
  • High: il file sarà molto leggero e poco leggibile.
  • Standard: il file sarà leggero e quasi leggibile.
  • Low: alta leggibilità.
  • Custom: occorre inserire nel campo Custom Template, un file che si compone di più stringhe singoli, che sono separati dal carattere “|” senza virgolette.

Per avere un file leggero e che aiuterà ad ottimizzare il caricamento delle nostre pagine web, consigliamo la massima compressione del CSS.

Incolliamo il contenuto da comprimere del file CSS e clicchiamo su Process CSS.

Input in CSS Compressor & Minifier

Al termine dell’elaborazione nel riquadro Input, apparirà il contenuto compresso da copiare e incollare nel file CSS da caricare nel sito.

Come Decomprimere un file CSS

Nel caso in cui abbiamo perso il file CSS originale e non compresso, CSS Compressor & Minifier dà la possibilità attraverso la voce Low (alta leggibilità) di decomprimere il file CSS ritornando allo stato originario. Basterà copiare e incollare il contenuto del file css compresso nella Text-area del CSS Input e nel Code Layout selezionare la voce Low,. cliccare su Process CSS e tutto tornerà come prima.

Un consiglio: conservate sempre tenendoli aggiornati il file CSS originale e quello compresso.

Ecco altri servizi di compressione di file css:

Fabrizio Cannatelli

Autore e Founder di Informarea, sono un appassionato di informatica e tecnologia da sempre. La voglia di comunicare e di condividere sul Web le mie curiosità e le mie conoscenze, mi ha spinto a lanciarmi nel progetto di questo sito. Nato un po' per gioco e un po' per passione, oggi è diventato una grande realtà.

Fabrizio Cannatelli

Approfondimenti