7 modi per rendere il tuo sito Web o blog più veloce per i visitatori
La lentezza della velocità di caricamento delle pagine è uno dei motivi principali per cui il tuo sito web non ottiene i risultati che merita.
Poiché l'attenzione del pubblico è ai minimi storici, ecco alcuni suggerimenti per accelerare il tuo sito per assicurarti che i tuoi visitatori restino fedeli.
1. Diminuisci le dimensioni reali del tuo sito web
Se il tuo sito web viene caricato più lentamente di tre secondi, è probabile che le persone lo abbandonino anche prima che venga caricata la home page. Usare il formato sbagliato per le tue immagini può facilmente gonfiare il tuo sito web e rovinare un'esperienza di navigazione altrimenti eccezionale.
Oltre il 70% delle pagine Web mobili supera 1 MB e il 12% supera i 4 MB! Tieni presente che ci vuole sette secondi per scaricare 1.5 MB su una buona connessione 3G. La migliore pratica è di mantenere ogni pagina inferiore a 0,5 MB.
Scopri la differenza tra JPG, PNG e GIF e assicurati di utilizzare la risoluzione di cui hai bisogno.
Secondo GlobalStats, queste sono le risoluzioni dello schermo più utilizzate per il 2018:
- Il 22,55% usa una risoluzione di 360 x 640 (mobile)
- 11,73% usa una risoluzione di 1366 x 768
- 8,26% usa una risoluzione di 1920 x 1080
- Il 4,91% usa una risoluzione di 375 x 667 (mobile)
- 2.94% usa una risoluzione di 1440 x 900
Questo è oltre il 50% di tutti gli utenti, quindi prendilo in considerazione quando aggiungi foto al tuo sito web.
2. Progetta il tuo sito web per dispositivi mobili
Secondo una ricerca fatta da Google lo scorso anno sulla velocità della pagina mobile:
Il tempo medio necessario per caricare completamente una pagina di destinazione mobile è di 22 secondi, secondo una nuova analisi. Tuttavia, il 53% dei visitatori del sito mobile lascia una pagina che impiega più di tre secondi per caricarsi. Questo è un grosso problema.
Oltre il 75% dei siti mobili impiega 10 o più secondi per caricare su 3G. Oltre la metà di tutto il traffico avviene tramite dispositivi mobili e non è probabile che vada giù. Quindi mantieni un ingombro ridotto per rendere felici gli utenti di Internet mobile e assicurati che restino fedeli!
Se usi un CMS come WordPress, Joomla o Drupal Drupal vs. Wordpress: Qual è il miglior CMS Open-Source? Drupal vs. Wordpress: Qual è il miglior CMS Open-Source? Stai pianificando la creazione di un sito web ma non puoi scegliere il CMS open source giusto? Ecco come scegliere tra WordPress e Drupal. Per saperne di più, ci sono plugin per rendere il tuo sito web più mobile-friendly.
In alternativa, puoi usare strumenti come bMobilized o Duda Mobile per convertire il tuo sito web desktop in mobile. Detto questo, spesso è meglio progettare un sito Web separato per garantire la migliore esperienza per i tuoi utenti mobili.
Dovresti anche considerare di offrire una versione semplificata del tuo sito web usando il progetto AMP (Accelerated Mobile Pages). L'uso delle pagine AMP migliorerà la velocità di caricamento della pagina sui dispositivi mobili. Esistono linee guida rigorose per JavaScript e CSS, ma i benefici sono misurabili.
Indipendentemente dal percorso che decidi di disattivare, assicurati che il tuo sito Web mobile sia una soluzione leggera. Prova a rispettare i 0,5 MB di consigli per pagina.
3. Assicurati che il tuo sito Web sia stato modificato
Se stai scrivendo il tuo sito web da zero, modificalo regolarmente. Man mano che il tuo progetto si sviluppa, probabilmente imparerai modi più efficienti di fare le cose, quindi assicurati di tornare indietro nel tuo codice man mano che migliori.
Minimizza e combina CSS, HTML e JavaScript. Ad esempio, se si utilizza un CDN come Cloudflare, è disponibile una scheda specifica per i miglioramenti della velocità, in cui la prima opzione è Auto Minify. Se usi un costruttore di siti web (come Squarespace o Weebly), questo è probabilmente fatto per te per impostazione predefinita.
Assicurati di testare il tuo sito Web dopo aver attivato tutto ciò che combina o minimizza le risorse del tuo sito web. Sperimenta le diverse opzioni per vedere cosa è meglio per il tuo sito web, in quanto alcune funzionalità possono rompere con Minify abilitato.
4. Evita di caricare script quando non necessario
Dovendo caricare diversi file JavaScript prima che siano necessari rallenterà la velocità dell'intera pagina inutilmente. Evita di caricare script da server di terze parti, se puoi.
La richiesta di questi rallenterà ulteriormente la velocità di caricamento e potrebbe potenzialmente rappresentare un rischio per la sicurezza. Tenerli sul server del tuo sito Web quando possibile.
Puoi usare differire o async per ritardare il caricamento di specifici file JavaScript per ridurre la tensione sui dispositivi dei visitatori e migliorare la velocità di caricamento delle pagine. In alternativa, per i piccoli script, puoi in linea il JavaScript direttamente nel documento HTML.
Async dirà al browser di continuare a analizzare l'HTML nello stesso momento in cui vengono scaricati i file JavaScript. La pausa avverrà dopo che il file è stato scaricato completamente.
Nel frattempo, il differimento dirà al browser di eseguire i file JavaScript dopo il browser ha terminato l'analisi dell'intero documento HTML.
Per impostazione predefinita, un browser interrompe l'analisi dei file HTML mentre vengono recuperati ed eseguiti i file JavaScript.
Inlining JavaScript nel documento HTML aiuterà riducendo il numero di file che un browser deve scaricare prima di visualizzare una pagina. È possibile integrare JavaScript aggiungendo il contenuto di qualsiasi file JavaScript esterno tra tag di script.
Puoi tranquillamente utilizzare il differimento e l'asincronizzazione su Google Analytics, Facebook Pixel e altri strumenti di analisi e segnalazione degli errori senza influire sulla funzionalità della pagina.
Infine, considera se sono necessari i codici di monitoraggio, l'analisi, le funzionalità extra e gli annunci che hai in esecuzione sul tuo sito web. Usa le opzioni più leggere quando possibile, e cancellale se non aggiungono nulla di valore a te o ai tuoi visitatori.
5. Utilizzare la cache e un CDN
Una Content Delivery Network (CDN) copierà il tuo sito su server in tutto il mondo e ridurrà il tempo di viaggio dei dati collegando i visitatori a un server geograficamente più vicino a loro. Il contenuto statico verrà inoltre memorizzato nella cache e consegnato dai server della CDN.
Cloudflare è probabilmente il CDN che conosci meglio, ma Akamai e Amazon CloudFront sono alternative consolidate.
Assicurati di sfruttare anche la memorizzazione nella cache del browser Ecco come il tuo browser compromette la tua privacy Ecco come il tuo browser compromette la tua privacy Il tuo browser web rivela un sacco di informazioni su chi sei, dove vai e cosa ti piace. Ecco i dettagli che perde quando vai online. Leggi altro per migliorare la velocità di caricamento del tuo sito web per i visitatori abituali. Il caching del browser funziona scaricando questi file dal server sul dispositivo dell'utente.
In altre visualizzazioni di pagina o visite, questi file verranno caricati localmente dal dispositivo dell'utente invece di richiederli dal server esterno (in base alla data di scadenza dei file).
6. Sbarazzarsi di plugin non essenziali
I plugin dovrebbero essere usati solo se necessario. Questo è vero sia che tu usi Wix, Weebly, WordPress o Squarespace Squarespace vs Wordpress: 7 differenze che potrebbero sorprenderti rispetto a Wordpress: 7 differenze che potrebbero sorprenderti Nel mondo del web hosting e della costruzione di siti, pochi nomi sono più grandi di WordPress e Squarespace. Ma come decidi quale usare? Leggi di più o qualsiasi altra cosa. Qualsiasi funzionalità che puoi fare aggiungendo semplici CSS piuttosto che un plugin, dovresti. Usa Code Injection su Squarespace, usa il CSS Customizer in WordPress e Custom CSS su Wix.
I plug-in possono causare un sovraccarico della CPU o della memoria sul server e questo può rallentare o addirittura impedire il caricamento del sito Web.
Se usi WordPress, è probabile che tu non stia utilizzando tutte le sue funzionalità integrate. Disabilitalo con un plugin come Clearfy.
Considera sempre i plug-in che stai utilizzando. Se stai utilizzando alcune funzionalità in plugin come JetPack, prendi in considerazione la possibilità di rimuoverli del tutto e sostituirli con plugin più leggeri che fanno lo stesso lavoro.
7. Impostazioni del server per accelerare il tuo sito web
Il ritardo del server avrà un grande impatto negativo sulla velocità di caricamento della pagina e sul tuo PageRank.
Google raccomanda che il Time to First Byte (TTFB) sia 1,3 secondi o meno. Questo è il ritardo più lungo prima che un dispositivo inizi a scaricare una pagina dopo aver inizialmente contattato il server. Detto questo, la pagina media ha un TTFB di oltre 2 secondi, ben al di sopra della loro raccomandazione.
Generalmente gli host condivisi sono la ragione per questo, ma ci sono alcune impostazioni che è possibile configurare per migliorare il tempo di risposta del server.
- Utilizza l'ultima versione di PHP compatibile con il tuo sito web. L'ultima versione (PHP 7.2) ha enormi miglioramenti di velocità.
- Accendere “Keep-Alive”
- Abilita HTTP / 2
- Approfitta di HTTP Strict Transport Security (HSTS)
- Imposta i backup per completare la notte
Se il tuo sito Web è realizzato in WordPress, assicurati di utilizzare un host specializzato in hosting WordPress, come Bluehost. Ciò assicurerà che le impostazioni del server siano configurate specificamente per le prestazioni di WordPress.
Finito di modificare? Ora prova il tuo sito
Ora che conosci il tempo di caricamento della pagina ideale, la dimensione e il Time to First Byte (TTFB) a cui dovresti mirare, come fai a sapere qual è il tuo?
Ecco alcuni dei nostri strumenti online preferiti per testare il tuo sito:
- varvy.com: questi strumenti testeranno la velocità e le prestazioni della tua pagina desktop e mobile e ti forniranno preziose guide su come migliorare il tuo sito web
- Google PageSpeed Insight: aggiornato di recente, lo strumento Google PageSpeed metterà alla prova la tua velocità e ti fornirà suggerimenti di miglioramento
- GTmetrix: un ottimo strumento con consigli attuabili
- WebPageTest: verifica il tuo sito Web su diversi dispositivi, sistemi operativi e posizioni
- Pingdom: uno strumento molto popolare, simile a WebPageTest con un'interfaccia più gradevole
Puoi testare il tuo sito mobile con i link sopra, e anche con ThinkWithGoogle Mobile Test (powered by WebPageTest). I risultati ti forniranno suggerimenti specifici su cosa puoi migliorare, con una riduzione dei tempi di caricamento stimata se segui i suggerimenti.
Le best practice consigliate cambiano continuamente, quindi continua a controllare regolarmente la velocità della tua pagina man mano che apporti miglioramenti.
Per ulteriori informazioni preziose sul rendimento del tuo sito web, ricorda di verificare il tuo dominio su Google e Bing. I 5 principali vantaggi di verificare il tuo dominio su Google e Bing I 5 principali vantaggi di verificare il tuo dominio su Google e Bing Se hai il tuo sito web, ecco perché dovresti verificare il tuo dominio su Google e Bing con i loro strumenti per i webmaster. Leggi di più
Scopri di più su: Sviluppo Web.