Best practice per la velocità di caricamento del sito Web e suggerimenti per il miglioramento

Pubblicato: 2019-01-30

Quando si tratta di utenti online oggi, vogliono quello che vogliono e lo vogliono ora. Siamo stati tutti in una situazione in cui una risorsa online ha una velocità di caricamento del sito Web troppo lenta e abbiamo semplicemente cliccato via. Grazie ai social media, alla TV e a tutte le altre tecnologie moderne, gli umani di oggi non sono esattamente conosciuti per la loro pazienza e concentrazione.

immagine principale della velocità di caricamento del sito web

La velocità è il killer silenzioso dei siti web. Quasi la metà di tutti gli utenti del sito Web si aspetta che il tuo sito Web venga caricato in 2 secondi o meno. Potrebbe sembrare assurdo, ma è vero che anche pochi secondi di caricamento lento spaventeranno gli utenti senza pensarci due volte. La realtà è che hai bisogno che il tuo sito web si carichi correttamente e rapidamente.

Best practice per la velocità di caricamento del sito web

Potresti non renderti conto di quanto sia lento il tuo sito web a meno che non lo provi tu stesso. Fortunatamente, puoi farlo gratuitamente su Google PageSpeed. È uno strumento basato sul web per individuare i tempi di caricamento e trovare le aree problematiche. Come si accumula il tempo di caricamento del tuo sito web? Se hai bisogno di un po' di lavoro, non preoccuparti. È più facile di quanto pensi migliorare il tempo di caricamento del tuo sito web in pochi clic. Ecco alcuni suggerimenti aggiuntivi per iniziare.

strumento di approfondimento sulla velocità della pagina google

Usa la compressione Gzip per una migliore velocità di caricamento del sito web

La compressione Gzip è un potente strumento che riduce la dimensione della risposta di circa il 70%, il che è impressionante. Gzip è qualcosa che viene fatto attraverso il tuo host, quindi dovrai chiedere al tuo host web se usano questa compressione sui loro server. Con Gzip riduci i tempi di risposta senza compromettere la qualità dei tuoi video, immagini o altri elementi.

Puoi eseguire un test per vedere se il tuo sito web è GZIPPED ed eseguire un test di compressione Zip. Il funzionamento di Gzipping consiste nel ridurre la dimensione della risposta HTTP. Alla fine cambia il peso della pagina.

Memorizza i tuoi file nella cache

La memorizzazione nella cache è quando una versione del tuo sito web è memorizzata nei browser dei tuoi utenti. In questo modo, quando visitano di nuovo il tuo sito web, c'è una versione precedente che verrà caricata fino a quando non sarà possibile aggiornare la nuova versione. La memorizzazione nella cache può ridurre il tempo di caricamento da oltre 2 secondi a meno di 1 secondo. È un grande salto di cui dovresti preoccuparti. Fortunatamente, è facile impostare la memorizzazione nella cache con il tuo sito web. Se utilizzi WordPress, puoi utilizzare il plugin gratuito W3 Total Cache. La memorizzazione nella cache è un must oggi per aggiungere quella spinta in più alle prestazioni di caricamento del tuo sito web.

Oltre alla memorizzazione nella cache lato server, dovresti anche abilitare la memorizzazione nella cache del browser. Questo è essenzialmente un modo per istruire i browser a memorizzare una copia di file statici come immagini, CSS e file JS nel browser in modo che i visitatori non debbano aspettare che questi file vengano scaricati di nuovo quando visitano nuovamente il tuo sito web. Puoi leggere di più in questa raccolta di informazioni su WordPress sfrutta la memorizzazione nella cache del browser.

Aggiorna l'host del tuo sito web

Avere l'host giusto per il tuo sito web può influire sulle prestazioni della tua pagina. Puoi apportare tutte le modifiche che desideri al tuo sito web, ma se non vedi molti miglioramenti, la colpa potrebbe essere del tuo host. Si è tentati di scegliere l'opzione di hosting più economica quando si avvia per la prima volta il proprio sito web. Anche se questo potrebbe andare bene per un po', probabilmente lo supererai se stai ospitando molti file o se stai riscontrando un traffico maggiore.

È probabile che vengano condivisi piani più economici e questo significa che eventuali problemi sui siti Web dei tuoi vicini influenzeranno anche i tuoi. Avere un server dedicato ti consente di evitare tutti i problemi che possono verificarsi se sei su un server condiviso. Avrai anche più opzioni di servizio clienti se hai bisogno di assistenza con il tuo tempo di risposta.

Acquista hosting

Controlla il tema del tuo sito web

Il modo in cui è progettato il tuo sito web influirà anche su quanto bene e rapidamente il tuo sito web apparirà ai visitatori. Il cambio di temi potrebbe essere tutto ciò che serve per liberare alcuni secondi preziosi nel tempo di caricamento del tuo sito web.

Immagine principale di Simple Website Builder

L'utilizzo di un generatore di pagine o di un tema di un sito Web professionale assicurerà che il tuo sito Web non sia gonfio di codice inutile e disordinato. Ecco perché è essenziale esaminare qualcosa di più dell'estetica del modello, del tema o del costruttore del tuo sito web. Inoltre, prendi in considerazione l'accesso al tuo sito web o alla tua app web. La registrazione del sito Web ti aiuta a scoprire i problemi prima che si verifichino e può impedire al tuo sito Web di riscontrare problemi. In alternativa, puoi inviare messaggi di registro direttamente con uno strumento come Papertrail App.

Riduci i tuoi file Java e CSS

La maggior parte dei siti Web oggi utilizza molti file Javascript e CSS e questi file potrebbero essere trattati individualmente nei browser degli utenti. Avere troppe richieste contemporaneamente ridurrà la velocità di caricamento del tuo sito web. Se riesci a minimizzare tutti questi file, non aggiungerai tanto peso al tempo di caricamento del tuo sito web.

Avere i tuoi file Java e CSS caricati esternamente invece di restringere ogni pagina è un'idea intelligente. Quindi, gli utenti devono solo caricare i file così come appaiono, non ogni volta che qualcuno visita una nuova pagina del tuo sito web. Non sconvolgere i browser dei tuoi utenti con troppi file.

Porta il tuo carico sulla rete

Immagine account carattere cloud AWS - networking

Se stai riscontrando un traffico elevato, devi fare sul serio con la tua rete. Un servizio Content Delivery Network (CDN) porta i file direttamente ai tuoi utenti utilizzando server in molte aree geografiche diverse. Ciò significa che c'è meno tempo tra i luoghi in modo che il tuo sito possa caricarsi più velocemente. Il CDN più noto è Amazon CloudFront ed è facile integrarlo con il tuo sito web attuale.

Prova le piattaforme di hosting esterno

Simile a CDN, puoi ospitare i tuoi file su piattaforme di hosting esterne per evitare di rallentare il tempo di caricamento. Questo è più comune per i file video. I video sono piuttosto voluminosi e caricarli direttamente sul tuo sito Web richiederà molto spazio. Possono facilmente superare i 100 MB, quindi non è una mossa intelligente ospitare video o altri file di grandi dimensioni sul tuo server.

È un'idea migliore per ospitare questi file esternamente. YouTube e Vimeo sono ottime opzioni per i file video. Da lì, puoi incorporare il video sul tuo sito web. Risparmia spazio e non rallenta il tempo di caricamento. È anche molto più facile!

L'utilizzo di YouTube, in particolare, apre i tuoi contenuti a un pubblico completamente nuovo. In effetti, YouTube è considerato uno dei più grandi motori di ricerca in circolazione e attira oltre un miliardo di utenti mensili. È gratuito e puoi caricare video fino a 15 minuti (o più se invii una richiesta). Semplicemente non puoi sbagliare.

Controlla le tue richieste HTTP

Richieste HTTP che controllano l'immagine

Yahoo afferma che l'80% del tempo di caricamento di un sito Web deriva dal download di tutte le diverse parti di una pagina. Mentre abbiamo già discusso delle migliori pratiche quando si tratta di file Java e CSS, che dire di tutto il resto? Più elementi sulla pagina devono essere caricati, più tempo ci vorrà perché la pagina appaia completamente.

Puoi controllare quante di queste richieste stanno accadendo andando sul tuo browser. Google Chrome è dotato di strumenti per sviluppatori che si concentrano sulle richieste HTTP. Per accedere a questi strumenti, fai clic con il pulsante destro del mouse sulla tua pagina in Google Chrome, fai clic su Ispeziona, quindi vai alla scheda Rete.

Ora puoi vedere quanto tempo impiega ogni file a caricarsi nella sezione "Tempo". Nell'angolo vedrai anche il numero totale di richieste. Ridurre le richieste che richiedono più tempo è un modo semplice per accelerare il tempo di caricamento del tuo sito web. Continua a leggere per imparare il modo migliore per combinare i file nel prossimo suggerimento.

Combina e minimizza i file HTML

Quando minimizzi un file, elimini qualsiasi spazio bianco o codice non necessario. Tutte queste piccole cose potrebbero non sembrare significative, ma ciò aumenta il tempo di caricamento. L'obiettivo è avere file HTML il più snelli possibile.

Rivedi il tuo sito web per vedere se ci sono pagine non necessarie che non utilizzi più. Ci sono posti in cui puoi eliminare gli spazi bianchi o il codice non necessario? Infine, combina i file HTML per assicurarti di non impantanare il tempo di caricamento del tuo sito web.

Usa CSS esterno

CSS è il modo in cui includi lo stile e gli elementi di design per la tua pagina. Il tuo sito web può accedere a un file esterno che viene caricato prima della tua pagina o accedere allo stile in linea. Includere il tuo CSS nel tuo documento HTML stesso aggiunge molto codice. Come abbiamo detto prima, non va bene.

Invece, dovresti usare un CSS esterno che viene caricato nella testa del tuo HTML. Non inserire alcun CSS nel tuo HTML se puoi evitarlo. Ciò significa in particolare div o intestazioni. È molto più pulito e snello se usi un foglio di stile esterno. È anche molto più facile da modificare.

Se non sei sicuro dello stato del tuo CSS, usa gli strumenti di consegna CSS per vedere come si accumulano i tuoi file CSS. Questo ti farà sapere dove si trova il tuo file esterno e se hai elementi in linea nel tuo HTML. Quando possibile, usa solo un file CSS esterno. Probabilmente puoi combinare i file se ne hai più di uno.

Rimanda il caricamento di Javascript

Quando rinvii un file, come JavaScript, ti assicuri che il resto del tuo sito web venga caricato correttamente prima di caricare gli elementi Java aggiuntivi. A volte rinviare Java è semplice come usare un plugin. Altre volte, dovrai aggiungere manualmente uno script HTML per far sapere al sito web che vuoi caricare Java per ultimo.

Questo script richiede un file JavaScript esterno. C'è un tutorial completo qui per posticipare il tuo Java. Anche se non è una grande differenza, questo può far sembrare che il tuo pape si carichi più velocemente.

Rivedi il tuo tempo al primo byte

Il tuo tempo al primo byte (TTFB) è il tempo che un browser attende prima di iniziare a caricare il suo primo byte di dati. Secondo Google, il tuo TTFB dovrebbe essere inferiore a 200 ms. Tuttavia, questa è una preoccupazione lato server, quindi è facile che più sviluppatori web trascurino.

Quando gli utenti visitano il tuo sito web, il caricamento non si avvia automaticamente. Sebbene possa sembrare un processo istantaneo, ci sono 3 passaggi che si verificano prima. Il tuo browser invia una richiesta HTTP iniziale al server che ospita il sito Web e da lì i passaggi sono la ricerca DNS, l'elaborazione del server e la risposta.

Ancora una volta, i tuoi strumenti per sviluppatori di Chrome mostreranno quanto tempo richiede questo processo sulla tua pagina web. Ciò dipenderà molto anche dalla potenza della connessione Internet. Una connessione lenta ha un TTFB più lento. Controlla il tuo TTFB per assicurarti che sia inferiore a 200 ms. In caso contrario, è il momento di parlare con il tuo host della soluzione giusta. Potresti non avere abbastanza spazio o potresti riscontrare troppo traffico.

Prima i contenuti above the fold

A volte hai pagine lunghe che richiedono un po' di tempo per essere caricate. Questa è una realtà. Tuttavia, assicurarsi che le informazioni above the fold vengano caricate per prime può farti risparmiare alcuni visitatori. Migliora la tua esperienza utente assicurandoti che tutto il contenuto della parte superiore della pagina venga visualizzato rapidamente.

Questo è un processo chiamato "carico pigro" e il nome ha senso. È come caricare lentamente la pagina, ma inizia dalla parte superiore, dove i tuoi utenti sono più concentrati. Con il caricamento lento, i tuoi utenti possono vedere il contenuto principale e aumentare la velocità di caricamento del sito Web senza dover attendere il caricamento del resto della pagina. Questa è un'ottima idea perché immagina di avere più di 10 foto in tutta la pagina. Non vorresti che i tuoi visitatori aspettassero il caricamento di tutte quelle immagini per iniziare a leggere.

Il caricamento lento utilizza jQuery.sonar per caricare solo le immagini visibili. Esistono molti plug-in che semplificano l'aggiunta di un caricamento lento alle pagine, ma ecco un tutorial completo per farlo manualmente. I tuoi utenti saranno felici di non dover più aspettare i contenuti above the fold.

Controlla le dimensioni dell'immagine

riduzione delle dimensioni dell'immagine e ritaglio dell'immagine

È facile caricare immagini senza controllare la dimensione del file. Questo potrebbe andare bene ogni tanto, ma può facilmente rallentare il tuo sito web se non stai attento. Quando salvi le tue immagini, prova a salvarle con l'opzione "Salva per web". Questo è disponibile con strumenti come Photoshop o Fireworks. Con "Salva per web", la dimensione dell'immagine può essere ridotta senza perdere la nitidezza dell'immagine.

In generale, evita file di dimensioni maggiori. PNG quando si salvano le immagini. Puoi controllare le proprietà dell'immagine per vedere se stanno per raggiungere dimensioni maggiori. Infine, se hai già immagini di grandi dimensioni sul tuo sito web, utilizza un plug-in o comprimi manualmente quei file per migliorare la velocità di caricamento del tuo sito web.

Elimina gli extra non necessari per una migliore velocità di caricamento del sito web

A volte aggiungiamo nuove cose ai nostri siti Web e ce ne dimentichiamo. O passiamo a qualcos'altro o non abbiamo più bisogno di una soluzione passata. Qualunque sia la ragione, assicurati di controllare frequentemente il tuo sito web per assicurarti di non sprecare spazio su nulla che non stai utilizzando. Questo vale per tutti i seguenti:

  • Immagini;
  • Plugin;
  • Elementi di navigazione;
  • Elementi di design;
  • pagine;
  • Post del blog archiviati.

Non importa quanto piccoli, questi influenzeranno negativamente la velocità di caricamento del tuo sito web. Inoltre, possono creare aree deboli nella sicurezza del tuo sito web, in particolare con i plugin. Questi sono facilmente danneggiati e questo può ridurre la tua sicurezza. Prendi l'abitudine di rivedere regolarmente il tuo sito web per gli extra obsoleti.

Limita i tuoi pulsanti di condivisione social

I pulsanti di condivisione social sono un ottimo modo per incoraggiare il coinvolgimento sui social media. Tuttavia, ci deve essere un limite. Questi pulsanti a volte sono molto efficaci. Tuttavia, possono anche essere un busto. Quello su cui possiamo essere d'accordo è che questi pulsanti di condivisione social utilizzano diversi JavaScript esterni e rallentano il tuo sito web.

Facebook, in particolare, è stato uno dei principali responsabili di questo. Gli script di Facebook possono rallentare le prestazioni del sito Web con i pulsanti di condivisione. Considera se questi pulsanti di condivisione valgono davvero la seccatura. Puoi ancora tenerli, ma mantieni solo quelli che hanno dimostrato di essere i migliori.

Consegna asincrona

Parlando di codici di terze parti, ci sono molte cose che possono andare storte. Se la terza parte subisce un'interruzione o viene improvvisamente rallentata, la tua pagina può facilmente rimanere bloccata nel tentativo di caricare quella risorsa, sia che si tratti di un pulsante di condivisione sociale o di uno script di analisi di rete.

La consegna asincrona è la soluzione a questo rallentamento. Con questo abilitato, se la tua rete di terze parti subisce un'interruzione, il tuo sito web non sarà interessato. Puoi abilitare la consegna asincrona in diversi modi, tutti descritti qui.

Installa Google Page Speed

Immagine di Google Page Speed

Google PageSpeed ​​è un modulo server open source che ottimizza la velocità di caricamento del tuo sito web. È progettato da Google per rendere il tuo sito web più veloce ed è facile da usare. Fondamentalmente, apporta diverse modifiche sia al tuo server che ai file del tuo sito web. Non devi fare nulla manualmente e il tuo sito web funzionerà meglio.

È quanto di più vicino a una soluzione valida per tutti troverai quando si tratta delle prestazioni del tuo sito web. Puoi installare Google PageSpeed ​​sul tuo file manager da solo oppure puoi chiedere al tuo host o sviluppatore di aiutarti con l'installazione. Puoi impostarlo e dimenticarlo.

Combina immagini di sfondo

Molti temi utilizzano diverse immagini di sfondo per creare un'unica immagine completa. Anche se questo potrebbe sembrare fantastico e simultaneo, potrebbe rallentare le prestazioni del tuo sito web. Poiché i browser degli utenti dovranno effettuare diverse richieste per caricare le foto di sfondo, questo richiede tempo per il processo di caricamento.

Invece, combina le tue immagini in una singola per aumentare la velocità di caricamento del tuo sito web. In questo modo, i tuoi utenti devono solo effettuare una singola richiesta anziché molte. Il tuo sito web sarà più veloce poiché non ci sono più diverse richieste di andata e ritorno per il caricamento corretto dello sfondo.

Interrompi il collegamento alle immagini

L'hotlinking è la pratica di incorporare una foto da un altro sito Web sul proprio senza caricarla sul proprio server. Questo è semplice con un po' di codice, ma è una cattiva pratica che può portare, tra le altre cose, a un rallentamento del sito web.

L'hotlinking non solo danneggia il tuo sito Web, ma è tecnicamente un furto se lo fai senza permesso. I proprietari di siti Web pagano per lo spazio per ospitare questi file e quando inserisci lo stesso file sul tuo sito Web tramite un codice di incorporamento, stai prendendo le loro risorse senza permesso.

Sebbene ci siano alcuni siti Web che ti consentono di caricare immagini direttamente con l'intenzione di condividerle, questa non è ancora una buona idea. Quando questi siti Web sono lenti o registrano un traffico elevato, possono rallentare la velocità di caricamento del sito Web se li stai incorporando. Inoltre, a meno che tu non stia pagando per lo spazio, questi file possono essere eliminati in qualsiasi momento senza preavviso.

Sì, l'hotlinking potrebbe farti risparmiare un po' di larghezza di banda, ma è più probabile che rallenti il ​​tuo sito web a lungo termine. Ospita sempre le tue immagini sul tuo server invece di eseguire l'hotlinking. In caso di dubbio, è meglio acquistare più spazio sul proprio server in modo da poterli caricare. Dovresti comunque usare piccoli file di immagine, quindi non dovrebbe essere un problema.

Aumenta la velocità di caricamento del tuo sito web oggi stesso

Sei pronto a portare il tuo sito web a nuovi livelli? È tempo di aumentare la velocità di caricamento del tuo sito web. Se la velocità di caricamento del sito Web è lenta, è facile perdere visitatori involontariamente. Pensa a quanto hai trovato frustrante quando un sito web impiega troppo tempo a caricarsi. Un ritardo di un secondo nel tempo di caricamento del sito Web comporterà una diminuzione del 7% delle conversioni e dell'11% delle visualizzazioni di pagina. Non farlo ai tuoi utenti prendendo sul serio questi suggerimenti sopra.

Velocizzare il tuo sito web non è complicato, costoso o confuso. È uno dei modi più semplici e veloci per migliorare la tua SEO e avere un impatto positivo sui tuoi utenti. Se vuoi che il tuo sito web funzioni meglio e impressioni i tuoi utenti, vale la pena investire nei suggerimenti di cui sopra.

Dall'evitare hotlink e collegamenti interrotti all'aggiornamento del tuo web hosting, anche i piccoli passaggi precedenti hanno un grande impatto. Se sei sopraffatto, inizia semplicemente testando la velocità di caricamento del tuo sito web. Da lì, avrai una buona idea di quanto miglioramento devi fare per assicurarti che il tuo sito web funzioni al massimo livello di prestazioni. Il tuo sito web potrebbe richiedere solo alcune modifiche per renderlo conforme agli standard di Google. I tuoi utenti sono stanchi di aspettare, quindi è ora di mettersi al lavoro.

Vettore di velocità di caricamento del sito web creato da ibrandify