L'ottimizzazione del tempo di caricamento del tuo sito Web è un approccio vantaggioso per tutti per mantenere felici i visitatori del tuo sito e aumentare i ricavi generati dal tuo business online.

Per far luce su tutti quei problemi che rallentano il tuo sito web, abbiamo invitato Stavros Papadakis a definire il suo processo per velocizzare i siti web lenti.

Cosa rende lento il tuo sito web?

Dovresti assolutamente controllare il mio post precedente con 16 modi per velocizzare il tuo sito Web WordPress.

Sebbene questo post abbia fornito un rapido elenco di controllo con le migliori modifiche per ottimizzare il tempo di caricamento del tuo sito Web WordPress, ci sono ancora molti problemi che possono rallentare il tuo sito Web.

Se hai abilitato la compressione sul tuo file htaccess, combinato i file CSS, spostato i file Javascript nel footer ma non sei ancora soddisfatto del tempo di caricamento del tuo sito, controlla questi 18 problemi comuni che rallentano il tuo sito web.

1. Siti web super pesanti

Non c'è dubbio che una pagina da 3 MB che effettua 180 richieste HTTP sarà più lenta di un sito da 1 MB con 60 richieste HTTP.

Vuoi ottimizzare i tempi di caricamento del tuo sito?

Uno dei modi migliori per farlo è ridurre al minimo le dimensioni di ogni pagina del tuo sito.

Sebbene tu possa ottimizzare le tue immagini, combinare file CSS, minimizzare i file Javascript e applicare molte modifiche all'ottimizzazione front-end, avere un sito da 3 MB renderà il tuo sito lento e gli utenti del tuo sito insoddisfatti.

21 MB sono un carico enorme per il tuo server e il tuo browser.

Mentre stai progettando o riprogettando il tuo sito, dovresti fare del tuo meglio per caricare solo ciò di cui hai bisogno e nient'altro.

In altre parole, dovresti sempre chiederti:

Ho davvero bisogno di 8 grandi immagini nella mia presentazione sulla home page?

Devo visualizzare 20 elementi del portfolio sulla home page?

Devo mostrare 12 testimonianze di utenti felici sulla home page o anche 3 testimonianze faranno il trucco?

Il caricamento di tutti questi dati rende il tuo sito bello ma anche il tuo sito sarà più lento a causa di tutti questi dati.

Vuoi avere un sito a caricamento lento? In caso contrario, riduci al minimo i dati caricati per pagina del tuo sito web.

2. Immagini non ottimizzate

Sai che l'80% del tempo necessario per caricare un sito web è controllato dalla struttura front-end?

Questo è un fatto sorprendente dell'ottimizzazione delle prestazioni web.

L'80% del tempo di risposta dell'utente finale viene dedicato al front-end. Concentrati su quello.

Puoi provare a ottimizzare il tuo database o il codice PHP, ma se ignori questo fatto di fondamentale importanza, il tuo sito web sarà lento.

Un file PNG da 460 KB può diventare 90 KB ottimizzandolo.

Se nel tuo sito sono presenti 10 immagini non ottimizzate, puoi aggiungere 2-3 MB di caricamento della pagina in più.

Se non ottimizzi le tue immagini, il tempo di caricamento del tuo sito può essere gravemente influenzato.

La buona notizia è che la maggior parte delle immagini JPG e PNG può diventare più piccola del 40% o addirittura dell'80% senza perdere la qualità dell'immagine ottimizzandole utilizzando Photoshop, ImageOptim o uno strumento di terze parti come Kraken.

3. Utilizzo eccessivo degli annunci

Google Adsense e altri servizi simili possono essere un'ulteriore fonte di reddito per te, ma possono anche rallentare il tuo sito.

Un sito Web che carica annunci nell'intestazione, nella barra laterale destra, nel corpo del post e in fondo alla pagina utilizzando 2 o 3 diversi servizi pubblicitari, sarà molto più lento di un sito Web con un solo annuncio nella barra laterale destra o nel corpo del palo.

Non solo gli annunci sono fastidiosi per la maggior parte degli utenti, ma rallenteranno anche il tuo sito.

Si prega di controllare il seguente screenshot dal sito Web di un cliente.

Hai davvero bisogno di tutti questi fastidiosi annunci?

Che ci crediate o no, ci sono 4 annunci diversi, un annuncio nella parte superiore dello screenshot, il video che è un annuncio, un annuncio nella barra laterale destra e un altro annuncio nella parte inferiore della pagina! Inutile dire che quegli annunci sono fastidiosi per la maggior parte degli utenti e rallentano anche il tempo di caricamento del tuo sito.

Per riassumere, gli annunci dovrebbero essere sempre usati con cautela. Finché un annuncio non genera denaro, dovrebbe essere rimosso.

4. Dimensioni errate per le tue immagini

Non dovresti ridimensionare le immagini in HTML, dovresti ridimensionare un'immagine di grandi dimensioni e utilizzare invece l'immagine ridimensionata.

Ad esempio, supponiamo di avere un'immagine di 1200px x 600px e di volerne utilizzare una versione "più piccola", ad esempio 400px x 200px.

In tal caso, non utilizzare l'immagine originale e ridimensionarla modificando le dimensioni di larghezza e altezza in HTML.

È necessario creare una nuova immagine in miniatura ridimensionando l'immagine originale da 1200px x 600px a 400px x 200px e utilizzare la nuova immagine che è più piccola e si caricherà più velocemente.

Mi sono imbattuto in molti siti che caricavano un'immagine facebook 256 x 256 di 150 KB invece di un'icona facebook 32 x 32 di 2 KB!

5. Reindirizzamenti inutili

Ho un quiz veloce per te.

Quale delle seguenti immagini si carica più velocemente, A, B, C o D?

R. http://www.domain.com/image.jpg
B. http://dominio.com/image.jpg
C. https://www.domain.com/image.jpg
D. https://dominio.com/image.jpg

Hai scelto A? Sbagliato.
Hai scelto B? Sbagliato.
Hai scelto C? Sbagliato.
Hai scelto D? Sbagliato di nuovo!

La risposta giusta è che dipende dal tuo sito!

Se il tuo sito è https://www.domain.com, chiamando la versione non HTTPS dell'immagine (http://www.domain.com/image.jpg), ci sarà un reindirizzamento aggiuntivo da http: //www.domain.com/image.jpg a https://www.domain.com/image.jpg dal browser per caricare l'immagine.

Se stai usando la versione non www per il tuo sito (http://domain.com/), dovresti sempre usare la versione non www anche per le tue immagini (es. http://domain.com/image. jpg invece di http://www.domain.com/image.jpg).

Ai browser non piace questo tipo di reindirizzamenti inutili.

Reindirizzamenti inutili rallenteranno il tuo sito

Utilizzando URL relativi per i tuoi file (ad es. <img src=”//eadn-wc04-1126528.nxedge.io/image.jpg” />), puoi facilmente eliminare questo problema comune che rallenta il tempo di caricamento di il tuo sito.

6. Posizione del server errata

Se il traffico del tuo sito proviene principalmente dagli Stati Uniti o dal Regno Unito, il tuo sito dovrebbe essere ospitato da una società di hosting situata rispettivamente negli Stati Uniti o nel Regno Unito.

Più il server è vicino ai visitatori del tuo sito, più veloce sarà il tuo sito web.

Inutile dire che se ricevi traffico da tutto il mondo, ti consiglio vivamente di utilizzare una rete di distribuzione dei contenuti o CloudFlare in modo che immagini, file CSS e Javascript vengano caricati da un server più vicino alla posizione di ciascun utente.

7. Piani di hosting condiviso ambigui

Nessuno vuole pagare $$$ per l'hosting di un sito, ma servire un sito WooCommerce con 40 plugin attivi o un sito Magento con 5000 prodotti tramite un piano di hosting condiviso che costa $ 5 al mese è una ricetta per il disastro.

Dovresti sempre investire in una buona società di hosting per ottenere il miglior tempo di caricamento per il tuo sito.

Se il tuo sito non è disponibile o è lento, potresti risparmiare qualche dollaro al mese utilizzando un piano di hosting condiviso ma perderai molto di più perdendo i tuoi clienti (un utente che visita un sito a caricamento lento non visiterà nuovamente questo sito).

Se hai un sito WordPress pesante che utilizza Woocommerce o molti plugin attivi, consiglio vivamente WP Engine e FlyWheel (link di affiliazione).

Non dovresti aspettarti di ricevere 200.000 visite uniche al mese per l'aggiornamento a un VPS, questo non accadrà mai mentre stai ospitando il tuo sito sullo stesso server sovraccarico con centinaia di siti su di esso.

8. Uso eccessivo degli script dei social media

Gli script dei social media (Facebook, Twitter, Pinterest ecc.) aggiungono una ricerca DNS, un insieme di file Javascript e alcune immagini ogni volta che vengono aggiunti in una pagina.

Sebbene molte di queste opzioni di condivisione dovrebbero essere disponibili alla fine dei tuoi post in modo che i tuoi utenti possano condividere facilmente i tuoi post, non ha senso caricare tutte quelle opzioni di condivisione in ogni singola pagina.

Qual è lo scopo di caricare quelle icone dei social media in ogni singola pagina, ad esempio nella pagina dei contatti o nelle pagine delle tue categorie?

Mostrare 5 diversi conteggi dei social media per ogni post sulla home page o sulle pagine delle categorie aggiunge molto carico al tuo sito. Quanto è importante mostrare i conteggi su queste pagine? Hai bisogno di mostrare anche Facebook, Twitter, Pinterest, Google Plus e LinkedIn?

Troppi script di social media possono compromettere le prestazioni del tuo sito

Faresti meglio a mostrare solo 1 o 2 che si comportano bene per te? Se non ottieni molte condivisioni, ha molto senso mostrarne qualcuna?

Dovresti sempre pensarci due volte prima di aggiungere qualsiasi opzione di social media in una pagina del tuo sito.

9. Tipo di file errato per le tue immagini

Se hai bisogno di trasparenza per le tue immagini, non puoi evitare il tipo di file PNG MA se non hai bisogno di trasparenza, non dovresti mai salvare le tue immagini come file PNG perché sono molto più grandi come file molto più lenti delle immagini JPG.

Riduci al minimo o addirittura elimina i file GIF pesanti perché possono rallentare drasticamente il tempo di caricamento del tuo sito.

Dovresti anche cercare di evitare di salvare le immagini con il testo come contenuto perché può essere un processo dispendioso in termini di tempo modificare il testo sulle immagini e anche le immagini generate sono molto più pesanti.

Usa JPG come impostazione predefinita. È il tipo di file di caricamento più piccolo e veloce per la maggior parte dei file.

10. Non usufruire di servizi dedicati

Esiste un gran numero di servizi popolari che possono ridurre il carico del tuo server.

Hai video sul tuo sito? Dovresti usare Youtube, Wistia o Vimeo.

Hai molti commenti sul tuo sito? Dovresti usare Disqus, IntenseDebate o
Discorso.

Usi jQuery, jQuery UI, AngularJS o Mootools? Dovresti caricarli tramite le librerie ospitate da Google.

Utilizzi WordPress e visualizzi post popolari? Dovresti usare Jetpack che lo fa automaticamente per te.

Puoi anche utilizzare una rete di distribuzione dei contenuti (CDN) per pubblicare le tue immagini da essa anziché dal tuo sito.

Se il tuo sito riceve un traffico significativo e carichi molte immagini e video, il tempo di caricamento del tuo sito può essere ottimizzato drasticamente bilanciando il carico di lavoro del tuo sito con i trucchi sopra menzionati.

11. 404 errori

Se provi a caricare un file che non esiste o il browser non riesce a trovarlo, il tempo di caricamento del tuo sito sarà influenzato da questo errore HTTP 404.

Dovresti sempre controllare eventuali errori 404 durante il rendering delle tue pagine per ottenere il tempo di caricamento più veloce. Puoi farlo controllando la cascata generata del tuo sito utilizzando Webpagetest e GTMetrix o utilizzando la scheda di rete di browser come Chrome e Firefox.

Se Webpagetest mostra delle linee rosse sulla cascata, dovresti immediatamente risolvere e correggere quegli errori 404.

Gli errori 404 possono rovinare il tempo di caricamento

Questo tipo di errori può davvero rovinare il tempo di caricamento del tuo sito web, soprattutto se servi il tuo sito tramite un piano di hosting condiviso.

12. Non memorizzare nella cache il tuo sito

Tutti i sistemi di gestione dei contenuti (WordPress, Joomla, Drupal, Magento) utilizzano un database per salvare un grande set di dati su di esso.

Anche se questo è ottimo per la gestione del tuo sito, significa anche che aggiunge un carico extra sul tuo server per generare ogni pagina ogni volta che viene richiesta.

Puoi risolvere questo problema usando la memorizzazione nella cache.

Se usi WordPress, puoi utilizzare un plug-in di memorizzazione nella cache come
W3 Total Cache o WP Super Cache o ZenCache o utilizzare una società di hosting di server gestiti come WP Engine e FlyWheel (link di affiliazione) che si occupano della memorizzazione nella cache.

Inutile dire che Joomla, Drupal e Magento offrono anche opzioni di memorizzazione nella cache che possono aiutare molto fornendo versioni memorizzate nella cache del tuo sito per i successivi visitatori del sito invece di generare ogni pagina più e più volte.

La memorizzazione nella cache delle tue pagine può velocizzare drasticamente il tuo sito

La memorizzazione nella cache è un gioco da ragazzi per qualsiasi sito Web basato su database. Anche un periodo di memorizzazione nella cache di 10 minuti può ottimizzare drasticamente il tempo di caricamento del tuo sito web.

13. Centinaia di richieste HTTP

Ogni file CSS, file Javascript o immagine caricata sul tuo sito è una richiesta HTTP. Più richieste HTTP ha il tuo sito, più lento sarà il tuo sito.

Sebbene tu possa provare a combinare file CSS e Javascript, per inline file CSS e per usare sprite CSS per piccole immagini, se implementi queste modifiche e hai ancora 150 richieste HTTP, allora dovresti ovviamente provare a riordinare il tuo sito rimuovendo il contenuto da esso.

246 richieste HTTP rallenteranno il tuo sito, non importa quanto sia ottimizzato

So che è allettante visualizzare molti contenuti in ogni pagina del tuo sito, ma tieni presente che "less is more", quindi cerca di non caricare così tante immagini o script.

14. Configurazione del server errata

Se utilizzi un piano di hosting condiviso, è abbastanza comune che facciano del loro meglio per servire il maggior numero possibile di siti per server.

Di solito lo fanno disabilitando funzionalità come compressione e KeepAlive tra le altre.

L'abilitazione di HTTP Keep-Alive consente alla stessa connessione TCP di inviare e ricevere più richieste HTTP, riducendo così la latenza per le richieste successive.

La compressione riduce la dimensione dei file inviati dal tuo server per aumentare la velocità con cui vengono trasferiti al browser.

Se utilizzi un piano di hosting condiviso e la tua società di hosting ha disabilitato la compressione e Keep-Alive, dovresti cambiare società di hosting il prima possibile.

Keep-Alive e la compressione dovrebbero essere abilitati sul tuo server

15. Importazioni CSS

Le importazioni CSS sono un bel modo per importare file CSS sopra un nuovo file CSS, ad esempio importando un file di ripristino CSS, ma aggiungono anche ulteriori ritardi durante il caricamento di una pagina web.

Dovresti evitare le importazioni CSS, quando possibile.

16. Caricamento di file non necessari su ogni pagina

Dovresti caricare i file CSS e Javascript solo quando sono richiesti in una pagina del tuo sito.

Ad esempio, se uno specifico file Javascript è necessario solo su una singola pagina, in tal caso, dovresti caricare quel file Javascript solo su questo URL invece di caricarlo su ogni singola pagina del tuo sito.

Se non segui questa semplice regola, puoi finire per caricare 30 file CSS e 40 Javascript su una pagina che richiede solo 3 file CSS e 4 Javascript, quindi stai facendo 63 richieste HTTP extra e aggiungendo molte centinaia di kilobyte sulla pagina dimensione.

17. Caricamento di file pesanti in background

Molti siti caricavano grandi immagini di sfondo appena visibili.

Hai davvero bisogno di un'immagine da 500 KB caricata in background? Dovresti provare a usare CSS3, quando possibile o usare invece un colore di sfondo.

È anche una cattiva pratica caricare file audio in background durante il caricamento del sito.

La maggior parte di queste tecniche stanno rallentando il tuo sito e dovrebbero essere evitate.

18. Non utilizzare un esperto

Il mio obiettivo era darti informazioni sufficienti per iniziare a correggere le pagine a caricamento lento del tuo sito.

L'ottimizzazione del tempo di caricamento del tuo sito è una situazione vantaggiosa per te e per tutti coloro che visitano il tuo sito web. Siti più veloci significano conversioni più elevate, migliori posizionamenti sui motori di ricerca e un'esperienza utente più piacevole.

È meglio assumere un esperto quando si desidera che un lavoro venga svolto bene.

I dilettanti possono seguire le migliori pratiche ma non sanno da dove cominciare.

Un esperto risolverà i problemi reali che rallentano il tuo sito.

Ogni volta che un dilettante non conosce i veri problemi del tuo sito Web, ti consiglierà una soluzione temporanea inutile come spostare gli host, cambiare tema, installare un plug-in di memorizzazione nella cache diverso o persino cambiare CMS.

Molti dei miei clienti hanno sprecato tempo e denaro per dilettanti che avevano appena installato un plug-in di memorizzazione nella cache senza risolvere i problemi reali del loro sito.

Dovresti sempre tenere presente che ogni sito Web è unico, quindi è necessario applicare modifiche all'ottimizzazione della velocità diverse per sito.

Per riassumere, l'ottimizzazione del tempo di caricamento del tuo sito dovrebbe essere sempre eseguita da un esperto che eseguirà le modifiche all'ottimizzazione della velocità con precisione chirurgica.

Immagina quanto saranno felici i tuoi utenti di vedere tempi di caricamento super veloci!

Se vuoi assumermi, sono felice di aiutarti. Guarda il mio portfolio e contattami su AwesomeWeb oggi!