Ed eccoci qui a parlare di “SEO Tecnico” affrontando la compressione del file CSS in ottica SEO. Cosa intendiamo per compressione file CSS in ottica SEO? Intendiamo un trattamento specifico che viene riservato al nostro file css affinché non pesi troppo e dunque non rallenti il caricamento del sito. 

Perché interveniamo in ottica SEO sui CSS del nostro sito?

Quando il browser richiama la lettura di un file lo fa in un lasso di tempo, parliamo di frazioni di secondo, qualora dovesse richiamare anche il file css, dunque nella tipica forma “separata” al file index ecco che il browser chiamerebbe due file, e dunque il tempo di caricamento di una pagina inevitabilmente raddoppierebbe.

Approfondimento: tempo caricamento di una pagina e di un sito web

Compressione file CSS

Possiamo ridurre il CSS all’interno del file HTML o PHP index del nostro sito in modo da eliminare il singolo file specificatamente dedicato al CSS, attenzione, questo non vuol dire metterlo inline dunque intersecato nell’HTML, che è invece pratica altamente sconsigliata, vuol dire agire in questo modo, guardate bene:

<style id="critical-path-css" type="text/css">
			body,html{width:100%;height:100%;
margin:0;padding:0}.page-preloader
{top:0;left:0;z-index:999;position:fixed;height:100%;width:100%;
text-align:center} </style>

Come vedete nell’immagine qui sopra, andiamo a racchiudere le proprietà del CSS comprimendole all’interno del tag  “Style” senza richiamare il CSS in un file separato.

Questa pratica seppur corretta può creare comunque un certo tipo di fastidio a livello di ordine del foglio (immaginate un css complesso  lunghissimo, mettiamola così). Un’ottima via di mezzo è dunque creare comunque un file css separato ma con tutto il codice compresso come nell’esempio appena citato.

Pratiche sconsigliate in ottica SEO per i CSS

Ci sono pratiche sconsigliate quando si impostano i CSS di un sito, pratiche che vanno a danneggiare il nostro sito web? Sì ci sono, eccone alcune:

• inserire le proprietà del nostro CSS inline nell’HTML come prima accennato
• abusare dello spazio all’interno del nostro foglio CSS, tutto il codice deve essere scritto in ordine e compattato il più possibile
• duplicare tag già dichiarati.
• utilizzare i colori non in esadecimale (HEX) bensì in RGB

Tutto ciò non favorisce la velocità di caricamento del nostro sito e quindi può essere dannoso in ottica SEO.

Consulenza SEO? Chiedici un preventivo!

Compressione File CSS, ci aiutano alcuni programmi free

E’ possibile inoltre usare alcuni servizi online o plugin dedicati alla compressione del file css:

• CSS Minifier
• CSS Compressor
• Free CSS Toolbox

Soluzione WP

 Qualora invece utilizzassimo WordPress? Anche su WP ovviamente come in tutte le cose ci sono soluzioni di rilievo…

WP Super Minfy può essere un’ottima soluzione, è un plugin gratuito che vale sicuramente la pena utilizzare!