Le prove dimostrano in modo conclusivo che un sito con una velocità ottimizzata del sito Web sarà uguale a un maggior numero di entrate
Non è un segreto che con l'aumento della prevalenza di piattaforme mobili e app web progettate specificamente per l'usabilità al volo, le persone si aspettano sempre più un'esperienza utente veloce.
Il caso innegabile per la velocità ottimale del sito
Un sacco di grandi aziende e ampi progetti di ricerca confermano quanto i consumatori apprezzino un sito veloce.
- Ad esempio, grandi nomi come Firefox, Netflix, e persino la campagna di Obama trovato che l'ottimizzazione della velocità del web si traduce in tassi di conversione più elevati e vendite migliori.
- Recentemente trovato uno studio di Brian Dean per Backlink velocità ottimale del sito web essere uno dei fattori più importanti nel determinare una posizione di alto posizionamento di Google.
- Roxanna Elliot di Performance Metrics riporta che il 9,6% dei visitatori rimbalzerà quando una pagina impiega solo due secondi per caricarsi, mentre un enorme 32,3% dei visitatori rimbalzare dopo 7 secondi.
- Ciò riflette un comportamento simile a un recente rapporto di Google: che il 53% dei visitatori di siti mobili lascerà un sito se impiega più tempo del tre secondi per caricare.
Le prove dimostrano in modo conclusivo che un sito con una velocità ottimizzata del sito Web sarà uguale a un maggior numero di entrate. Eppure, nonostante il consenso universale, la velocità media del sito per dispositivi mobili è laboriosa oltre ogni aspettativa.
Il tempo medio di caricamento della pagina su dispositivo mobile è di 22 secondi.
Questo è un enorme 19 secondi più lento del tempo di velocità consigliato – tre secondi o meno – e descrive un ecosistema digitale pieno di siti laboriosamente lenti.
Alla fine questa svista ricade sulle spalle dell'OCM, che non può più ignorare i segni. Con la maturazione della ricerca mobile e dell'IoT che collega un numero sempre maggiore di dispositivi, è chiaro che i consumatori desiderano un'esperienza di navigazione rapida e senza intoppi in qualsiasi momento, sia oggi che in futuro.
I marketer devono trovare un modo per battere la media, rimuovere gli attriti e rendere il loro sito di caricamento veloce un vantaggio competitivo per i loro clienti target. Google ha pubblicato molto materiale sui vantaggi di un sito veloce, ma nessuno ha più influenza del suo strumento PageSpeed Insights.
Che cos'è lo strumento PageSpeed Insights?
Lo strumento GoogleSpeed Insights fa parte della famiglia di strumenti gratuiti PageSpeed di Google progettati per ottimizzare le prestazioni del sito web.
Lo strumento genererà una serie di metriche prestazionali, tra cui un punteggio di ottimizzazione personalizzato e un elenco di suggerimenti prioritari per contribuire a migliorare la velocità di esecuzione di una pagina Web – per dispositivi mobili e desktop – rendendola una risorsa aggiuntiva molto utile per studiare e ottimizzare la presenza digitale.
La linea di fondo è che è gratuito, facile da usare e assolutamente dovrebbe essere sfruttato.
L'unico problema è che se non sei uno sviluppatore professionista, le regole possono essere difficili da interpretare.
Questo articolo è stato progettato per aiutarti a comprendere alcuni aspetti cruciali della velocità della pagina che ti aiuteranno a demistificare i trigger di un sito a caricamento lento. Quindi, andremo a delineare alcune strategie accessibili per affrontare tali flag in modo da poter comunicare in modo più chiaro con i team di progettazione e sviluppo: le persone che eseguono strategie e gestiscono il sito giorno per giorno.
Ecco alcuni dei principali suggerimenti da tenere presenti quando utilizzi lo strumento Google PageSpeed Insight.
Da asporto 1. Progetta il tuo sito per essere reattivo
Google vuole che tutti i siti siano responsive design perché hanno dimostrato di fornire un'esperienza utente migliore. In effetti, ci sono pochissimi casi in cui un design del sito reattivo non è la scelta giusta. Tuttavia, è più difficile da configurare e gestire rispetto ad altri approcci di progettazione, e quindi, è tutto fuorché un tipo di progetto "set-it-and-forget-it".
The Trigger = "Migliora il tempo di risposta del server"
Il primo trigger che Google ti avvisa è il tempo di risposta del server del tuo sito. Il tempo di risposta del server è in pratica il tempo necessario a Google per caricare il codice HTML dal tuo server.
Questo consiglio si innesca quando il tempo di risposta del server è superiore a 200 ms, il che significa che è un problema molto comune.
La correzione
Quando viene visualizzato questo trigger, devi prima scoprire che cosa esattamente sta causando il problema, quindi puoi procedere a personalizzare una strategia di soluzione mirata.
- Per restringere ulteriormente il / i problema / i, potresti provare a utilizzare uno strumento online come Pingdom, che potrebbe aiutarti a individuare esattamente che cosa sta causando il caricamento lento del sito.
- Una volta identificati i problemi, è possibile scegliere i passaggi appropriati per porre rimedio al problema.
Tenere presente che a volte, affrontare velocità di caricamento lente richiede un approccio completo.
Alcuni suggerimenti generali per migliorare la velocità di caricamento del contenuto includono:
- Passa a un hosting e hardware di qualità superiore
- Migliora la configurazione del server web
- Consolidare qualsiasi codice esterno
The Trigger: "Sfrutta il caching del browser"
Un altro trigger per i tempi di caricamento lenti è rappresentato dai problemi di memorizzazione nella cache del browser. Il caching consente a un browser di ricordare le cose che sono già state caricate in modo che il browser non debba scorrere il server più del necessario.
Il caching improprio causa basse velocità di caricamento e potenziali ritardi e utilizza anche una maggiore quantità di dati dell'utente.
PageSpeed Insights attiverà questo avviso quando non sono presenti meccanismi di memorizzazione nella cache o se sono impostati per essere applicati solo per periodi di tempo brevi.
La correzione:
Ogni risorsa dovrebbe specificare una politica di caching esplicita. Questo significa rispondere a queste domande:
- Una risorsa può essere memorizzata nella cache?
- Se sì, per quanto tempo?
- Chi può usarlo?
- Come verrà ripristinata la politica una volta scaduta?
Google consiglia di impostare il tempo minimo di cache su una settimana, ma può essere impostato su un anno per le risorse statiche.
The Trigger: "Evita reindirizzamenti delle pagine di destinazione"
I reindirizzamenti delle pagine di destinazione rappresentano un altro ostacolo comune all'esecuzione di un sito di risposta. Nel migliore dei casi, reindirizza il trigger e il ciclo di richiesta HTTP non necessario. Nel peggiore dei casi, attivano più rotatorie per eseguire la ricerca DNS, l'handshake TCP e la negoziazione TLS.
Il punto è che i reindirizzamenti eccessivi causano spesso ritardi e velocità di caricamento più lente, e questo influenzerà negativamente l'esperienza dell'utente.
Nel frattempo, l'uso minimo dei reindirizzamenti migliorerà le prestazioni della tua pagina.
La correzione:
Il modo più semplice per risolvere questo problema è evitare completamente i reindirizzamenti.
Detto questo, ci sono casi in cui questo semplicemente non è possibile. In questo caso, assicurati di scegliere il reindirizzamento giusto in base alle tue esigenze.
Ad esempio, i reindirizzamenti 301 sono permanenti e si adattano meglio alle istanze in cui non è necessario eliminare il vecchio contenuto. Nel frattempo, 302 reindirizzamenti sono temporanei e dovrebbero essere utilizzati nei casi in cui i contenuti devono essere occasionalmente aggiornati o modificati.
Da asporto 2. Prenditi il tempo necessario per ottimizzare correttamente le tue immagini
Le immagini rappresentano gran parte delle dimensioni totali di una pagina.
Prendendo il tempo per ottimizzare correttamente le immagini, si riduce il carico di dati del cliente, migliorando al contempo la velocità di download del contenuto.
I processi di ottimizzazione riducono le dimensioni dell'immagine senza produrre una notevole riduzione della qualità.
The Trigger: "Ottimizza le immagini"
Lo strumento PageSpeed Insights attiverà questo avviso quando rileva un'immagine che può essere ottimizzata. A titolo di esempio, ecco i suggerimenti di immagine per il sito di Climbing Trees:
La correzione:
L'ottimizzazione delle immagini richiede di tenere conto di una miriade di fattori e variabili, e per i non programmatori, il processo può sembrare un po 'intimidatorio.
Tuttavia, un modo semplice per eseguire alcune tecniche di ottimizzazione di base consiste nell'utilizzare alcune risorse online prontamente disponibili:
- Per assicurarti di utilizzare immagini reattive, puoi implementare la funzione "salva per web" di Photoshop all'interno della tua organizzazione. Ciò salverà le immagini nei formati web con una compressione ottimale.
- Compressori di immagini basate sul Web, come SmushIt, solo per nominare uno strumento popolare, può aiutare a comprimere ulteriormente un'immagine.
Se questo non risolve il problema, Google fornisce ulteriori informazioni su tecniche di ottimizzazione più complete.
Da asporto 3. Presta attenzione alla qualità del codice.
Se il codice è ben scritto, è molto più probabile che una pagina venga caricata più velocemente. Al contrario, il codice obsoleto, errato o semplicemente sciatto può causare problemi di latenza e inghiottire dati non necessari.
Alcune regole di Speed Insight sono progettate per identificare problemi nel codice che influenzano le prestazioni del sito e le velocità di caricamento.
Indipendentemente da ciò, non preoccuparti se il tuo codice non è completamente funzionante. Di solito non è necessario iniziare dal punto di partenza. Piuttosto, alcuni utili trucchi di ottimizzazione di solito sono tutto ciò che serve per affrontare i problemi relativi al codice disordinato o eccessivo.
The Trigger: "Ottimizza la consegna CSS"
Questo trigger verrà visualizzato quando Speed Insights rileva script CSS esterni che ritardano il rendering della pagina.
Mentre i CSS sono necessari per creare un sito visivamente accattivante, i fogli di stile esterni richiedono al browser di andare avanti e indietro sul server e rallentare il sito.
La correzione:
Esistono due modi per ridurre la quantità di codice CSS utilizzato dal tuo sito:
- Riduci al minimo la quantità di codice CSS che il tuo sito deve avere per apparire attraente.
- Usa la formattazione in linea quando possibile.
Per ridurre ulteriormente le dimensioni del file CSS, riduci e comprimi il codice come suggerito di seguito.
The Trigger: "Rimuovi JavaScript di blocco del rendering"
Questo trigger si verifica quando un file JavaScript nella parte above-the-fold della pagina influisce sul modo in cui una pagina carica o impedisce il caricamento di una pagina.
La correzione:
Il modo migliore per risolvere questo problema è di non consentire JavaScript fino a dopo il caricamento della pagina.
Sfortunatamente, questo non è sempre possibile perché a volte alcuni script devono esistere above-the-fold. In questo caso, puoi sempre provare a scrivere script critici in codice inline e rinviare tutti gli altri script non critici.
Da asporto 4. Quando si tratta di design e funzionalità di siti Web di alta qualità, less is more
Un altro elemento cruciale di un sito agile è il design semplice e pulito. Il fatto è che a volte anche se un sito è correttamente codificato, potrebbe comunque utilizzare dati e spazio file non necessari.
Dopo aver ottimizzato il funzionamento del sito in generale e ripulito il codice, Speed Insight Tools ti aiuterà a individuare i modi per ridurre al minimo lo spazio che i tuoi file utilizzano per aiutarti a migliorare l'esperienza dell'utente.
Trigger: "Minify Resources"
La prima avvertenza è di rimuovere il codice eccessivo. Non è raro che una pagina includa più comandi per eseguire la stessa attività. In questo caso, il codice ridondante causerà il caricamento lento di una pagina.
Questo trigger contrassegna quando uno qualsiasi dei codici risorsa (HTML, CSS o JavaScript) può essere ridotto di dimensioni attraverso i processi di minification.
La correzione:
Per i non sviluppatori, questo problema viene affrontato più facilmente con l'aiuto di uno strumento di minificazione:
- HTML Minifier per HTML
- CSSNano per CSS
- UglifyJS per Javascript
Trigger: "Abilita compressione"
Un'altra svista comune nell'ordinamento dei file è la compressione, o la mancanza di compressione, per essere specifici. Non c'è davvero nessuna buona ragione per non comprimere il tuo codice. I file HTML e CSS possono essere compressi per ridurre del 90% lo spazio per i file e questo si traduce in tempi di caricamento più rapidi.
Questo trigger verrà contrassegnato quando i file comprimibili non sono compressi.
The Fix: Usa Gzip per comprimere il tuo codice in file .zip.
Questo processo di utilizzo di Gzip può sembrare un po 'intimidatorio per i non sviluppatori. Se sei interessato a saperne di più, puoi trovare istruzioni dettagliate su come usare Gzip Qui.
Da asporto 5. Assegna la priorità ai tuoi contenuti
Essenzialmente, più i tuoi contenuti above the fold sono congestionati, più saranno necessari viaggi di andata e ritorno tra il server e l'utente per caricare la pagina. Ciò aumenterà sia la velocità di caricamento della pagina che la tua latenza.
Gli aumenti della latenza saranno particolarmente evidenti per gli utenti di telefoni cellulari.
Ad esempio, uno studio in corso del team SEO Power Suite ha trovato a Correlazione dello 0,97% tra il punteggio di ottimizzazione di una pagina e quanto alto è classificato nelle SERP mobili. Ciò significa che è molto più probabile che un sito veloce con bassa latenza abbia un alto ranking SEO sui dispositivi mobili.
Man mano che i dispositivi mobili diventano sempre più popolari, è particolarmente importante gestire efficacemente i problemi di latenza.
The Trigger: "Prioritize Content Visible"
Volete il contenuto effettivo della vostra home page per caricare il più veloce di tutti – eppure è spesso la pagina caricata con il materiale più multimediale. L'avviso "priorità del contenuto visibile" verrà visualizzato quando il contenuto above the fold supera la finestra di compressione iniziale di 14,6 kb.
La correzione:
Innanzitutto, riduci le dimensioni dei tuoi dati seguendo i suggerimenti sopra riportati.
Quindi, strutturare il codice HTML per caricare prima i contenuti above the fold più importanti e ridurre il materiale non necessario.
La velocità ottimale del sito web richiede un approccio olistico
Come ogni esperto di marketing sa, l'ottimizzazione del sito richiede un approccio olistico a ogni pezzo del puzzle che compone il sito. Dovrebbero anche sapere che l'ottimizzazione della velocità web è un progetto in corso. Mettere sei mesi di focus sulla velocità della pagina non è sufficiente per tenere il passo con il tasso di cambiamento nel comportamento dei consumatori e le best practice sullo sviluppo web.
È qui che lo strumento PageSpeed può aiutarti. Utilizza le regole di cui sopra come linea guida e punto di partenza per familiarizzare con lo strumento e inizia a definire obiettivi chiari su come intendi utilizzarlo per informare la tua strategia di marketing dei contenuti a lungo termine.