Non c’è dubbio: un sito web è un sito piacevole. In questa piccola guida, vi introdurrò ai segreti per velocizzare sito web.
Google PageSpeed Insights
Da qualche anno a questa parte, Google ha rilasciato uno strumento, denominato PageSpeed Insights, che viene spesso aggiornato con nuove funzionalità e metodi di analisi per velocizzare sito web.
Si tratta di un sistema che ci consente di capire, attraverso vari livelli di test e punteggi, quanto una specifica pagina del nostro sito è di qualità in termini di performance e funzionalità.
È uno strumento che può essere utilizzato in maniera semplice ed intuitiva nella sua versione web accedendovi direttamente da Google.
È rilasciato anche come modulo per Apache o per la controparte Nginx, quindi può essere installato direttamente nel server che eroga agli utenti le pagine web di un sito. In questo caso, le indicazioni che ci vengono date dalla parte web solamente a titolo informativo (e che poi dobbiamo effettivamente mettere in pratica) vengono direttamente applicate dal modulo, quindi il sito esce con le risorse già minimizzate, con le immagini già compresse e così via.
Indicazioni su risorse e come migliorare il codice
Se utilizziamo la componente web (la più utilizzata), questa ci dice come la nostra pagina si comporta nelle sue declinazioni principali, desktop e mobile. Lato mobile, ad esempio, ci dice se è sufficientemente responsive e se il codice genera degli elementi che sono fruibili a diverse risoluzioni (proprio perchè la vasta gamma di cellulari e smatrphone manca di standard di settore).
Ci spiega anche se dobbiamo fare delle modifiche al codice per migliorare la fluidità e la velocità.
CSS, Javascript e altro
Ruolo fondamentale rivestono tutte le risorse che vengono integrate. Per riassumere velocemente ciò di cui PageSpeed Insights tiene conto, possiamo dire che:
- Tutti i file CSS e JS che vengono inclusi in una pagina devono essere minimizzati per ridurne la dimensione
- Tutte le immagini che vengono incorporate in una pagina devono essere della giusta dimensione e compresse
Relativamente al primo caso, esistono plugin e servizi online che se ne occupano, oltre al fatto che i principali framework e librerie nascono già in versione minimizzata.
Nel secondo caso, è inutile incorporare in una pagina una foto da 4MB e risoluzione da “reflex” se poi la dobbiamo utilizzare alla dimensione di 640×480…
I livelli: buono, allerta e critico
Per fornire una sintesi esaustiva della tipologia di risultato che abbiamo ottenuto nei nostri test, Google fa uso di due sistemi: un punteggio in una scala in centesimi e un livello “colorato” che va dal rosso (dove dovrai sicuramente agire), al giallo (dove potresti agire per migliorare), al verde (anche se ti segnalo qualcosa, potresti anche lasciare così).