Tip:
Highlight text to annotate it
X
MAILE OHYE: Salve.
Sono Maile Ohye.
Lavoro per Google come responsabile tecnico dei programmi per sviluppatori
nel nostro team di assistenza per i webmaster.
Questo video riguarda la ricerca di rapide correzioni
che voi o un membro del vostro staff tecnico
potete implementare facilmente per migliorare il rendimento
del vostro sito per cellulari.
Ma prima di parlare di come velocizzare le cose,
diamo un'occhiata alle statistiche.
È un dato di fatto che il rendimento può incidere sui profitti.
In un esperimento svolto da Strangeloop
è stato aggiunto un secondo di ulteriore latenza
alle pagine pubblicate per gli utenti di smartphone.
Con un solo secondo di ritardo è stato rilevato
un calo di oltre il 9% nelle visualizzazioni di pagina,
per non parlare dell'aumento della frequenza di rimbalzo superiore all'8%
e di una diminuzione delle conversioni pari al 3,5%.
Infine, come se non bastasse, anche dopo la conclusione
dell'esperimento, la probabilità che gli acquirenti tornassero sul sito
era notevolmente diminuita.
Quindi qual è lo stato attuale degli utenti
e la velocità delle pagine per cellulari?
Bene, gli studi rivelano che esiste un limite di un secondo prima che un utente
si distragga.
Ma attualmente il tempo di caricamento medio delle pagine sui dispositivi mobili
è di sette secondi.
Ciò significa che abbiamo a disposizione sei secondi extra
per provare un altro sito web, dimenticarci
completamente dell'attività in corso o addirittura provare frustrazione.
Lasciate che vi spieghi un po' meglio il motivo per cui
il Web mobile è più lento del Web desktop.
Possiamo confrontare la potenziale latenza dei siti per cellulari e desktop.
Consideriamo un utente di laptop che sta per eseguire una ricerca
su google.com.
Una volta che l'utente inserisce la query, il processo totale per
la connessione del browser dell'utente a Google,
l'elaborazione della query da parte dei server di Google e per la restituzione
dei risultati e la loro visualizzazione nel browser
del portatile può avvenire in meno di mezzo secondo.
In realtà questo è il rendimento a cui si sono
abituati molti di noi.
Sugli smartphone, però, è probabilmente impossibile
che questo processo completo avvenga in meno di mezzo secondo.
Questo perché quando un utente inserisce
una query sul suo smartphone, il client
deve connettersi alla rete del telefono cellulare
prima di poter contattare il server.
Le reti dei cellulari, 3G o 4G, sono configurate
in modo che uno smartphone abbia
bisogno ancora almeno di 0,5 secondi per collegarsi
a un server come Google.
Dopo il collegamento al server una volta trascorso mezzo secondo,
Google deve ancora elaborare la query, restituire i risultati
e fare in modo che la pagina venga visualizzata sullo smartphone.
Il concetto chiave è che i potenziali visitatori da smartphone
dovranno aspettare almeno 0,5 secondi soltanto per
la connessione al vostro server.
Poi, circa 0,6 secondi dopo, quando il tempo trascorso
supera un secondo, è già possibile che il vostro
visitatore si sia distratto.
Ora parliamo di come è possibile velocizzare le cose.
In questo video presenterò le idee usando Google Analytics
con il sito di e-commerce, il Google Store,
su www.googlestore.com.
Iniziamo in Google Analytics e creiamo un segmento per
il traffico da cellulari.
Iniziamo con Crea nuovo segmento.
Proprio il mese scorso, i miei colleghi del team di Page Speed
hanno lanciato in Google Analytics una nuova funzione chiamata Velocità sito.
Esaminiamo la sezione Tempi pagine per velocità sito.
Con il segmento impostato su Traffico da cellulari,
selezioniamo la scheda Distribuzione.
Viene fornita una visione dettagliata
del rendimento di un sito.
Possiamo notare che sui cellulari il tempo di caricamento medio
delle pagine del mio sito, il Google Store,
supera i sei secondi.
Notiamo inoltre che per il caricamento sui cellulari
del 46% delle pagine del mio sito sono necessari da tre a sette secondi.
La buona notizia è che abbiamo un ampio margine di miglioramento.
Sempre nella sezione Tempi pagine per velocità sito,
facciamo clic sulla scheda Explorer.
In questa pagina, nell'ordinamento predefinito per visualizzazioni di pagina
in cui vengono visualizzate le pagine più visitate del nostro sito,
è possibile conoscere la velocità relativa di ogni pagina.
Risulta che la nostra terza pagina più visitata, quella della categoria
YouTube, in cui vengono venduti articoli quali bottiglie d'acqua e
calamite di YouTube, è terribilmente lenta, il 350% più lenta rispetto
a una nostra pagina per cellulari media che, come abbiamo visto prima,
non era così veloce da visualizzare.
Possiamo usare questa funzione per creare un elenco da esaminare
con le pagine più visitate ma lente.
Ora passiamo a Suggerimenti velocità del sito
per sapere quali miglioramenti apportare.
Notiamo che per la pagina di YouTube sono elencati
nove suggerimenti per la velocità della pagina.
Se facciamo clic sui suggerimenti viene aperta la pagina Informazioni
velocità pagina in una nuova finestra.
È come assistere in diretta alla correzione del vostro test.
Al termine diamo un'occhiata a Rendimento su cellulari.
La nostra pagina YouTube totalizza, prevedibilmente,
un punteggio di 55 su 100 in relazione alle best practice
sul rendimento.
Questo punteggio equivale a una F. Poiché questo video
riguarda le rapide correzioni da apportare per il rendimento sui cellulari,
ci concentreremo sui suggerimenti più semplici identificati da un punto
esclamativo rosso.
Alcuni di questi suggerimenti potrebbero essere familiari, altri meno.
ma per avere ulteriori informazioni è possibile espandere i suggerimenti.
Vorrei davvero farvi comprendere
quanto possa essere facile e, magari, redditizio
implementare questi suggerimenti per il rendimento.
Ho creato un grafico di due diapositive che
spero metta in evidenza i suggerimenti facili relativi al rendimento
e fornisca il contesto di quelli un po' più complessi.
Potete tranquillamente mettere in pausa il video se desiderate esaminarlo meglio.
La parte superiore del grafico riguarda le operazioni facili da eseguire, che
possono essere svolte in poche ore
da uno sviluppatore o da qualcuno con competenze più tecniche.
La prima è l'attivazione della compressione.
Attivare la compressione significa "zippare" le risorse,
in modo da trasferire meno dati tra il server web
e il client.
Basta una semplice modifica alle impostazioni del file di configurazione
del vostro server.
La minimizzazione delle risorse può essere eseguita facilmente
tramite strumenti di dominio pubblico.
Gli script asincroni consentono
di copiare e incollare nuovi snippet di codice
per sostituire versioni precedenti.
Per sfruttare la memorizzazione nella cache del browser basta
aggiungere le intestazioni HTTP appropriate alle vostre risorse.
L'ultimo suggerimento piuttosto semplice relativo alla velocità
è evitare i reindirizzamenti nelle pagine di destinazione.
Nel caso di pagine in una catena di reindirizzamento,
significa correggere l'URL di origine in modo che rimandi direttamente
alla pagina di destinazione anziché a pagine intermedie.
Possiamo notare l'utilità della correzione dei reindirizzamenti
estranei sempre esaminando la latenza sugli smartphone.
Per ogni reindirizzamento l'utente di cellulari deve
aspettare almeno 0,5 secondi in più per il caricamento della pagina.
Tornando a un altro consiglio di bassa difficoltà,
per attivare la compressione è sufficiente copiare il codice
in un file di configurazione del server.
Esistono già file di configurazione principali di origine aperti a cui
potete fare riferimento (vale a dire che potete copiare)
per applicare le impostazioni di sicurezza
e rendimento corrette per il vostro server.
I suggerimenti per la velocità nella seconda pagina del grafico
comportano una maggiore difficoltà per gli sviluppatori.
Molti di questi non saranno correzioni
che è possbile apportare in poche ore.
Richiedono miglioramenti che implicano maggiore riflessione ed elaborazione.
Vorrei comunque parlare un attimo
del consiglio relativo all'ottimizzazione delle immagini.
L'ottimizzazione delle immagini include una serie di
miglioramenti, dalla compressione senza perdita
alla creazione e ritaglio di immagini in modo specifico
per il sito per cellulari.
L'ottimizzazione delle immagini non è così semplice come
alcuni altri suggerimenti per la velocità riportati
nella diapositiva precedente.
Ma può avere un forte impatto.
Le immagini rappresentano il 65% dei dati del Web mobile.
L'ottimizzazione di queste risorse può ridurre i tempi di download
e, fondamentalmente, velocizzare il caricamento delle pagine.
Il concetto principale da ricordare di tutto questo
è che, se avete una pagina per cellulari con traffico intenso per
cui sono riportati suggerimenti per la velocità con punto esclamativo rosso
di bassa difficoltà per gli sviluppatori, sarebbe meglio applicarli per il bene
dei vostri visitatori e della vostra azienda.
Ma per trovare altre ispirazioni, visitiamo
il sito WebPageTest.org.
Con Web Page Test possiamo inserire una pagina,
ad esempio la pagina della categoria YouTube, e farne analizzare la velocità.
Selezioniamo uno user-agent per cellulari, ad esempio un iPhone o
uno smartphone Android.
Al termine del test della pagina lenta
scopriamo il problema.
Ho esaminato la pagina con il mio collega, Ilya Grigorik,
che si occupa principalmente del rendimento.
La sua risposta: accidenti.
Questa non è una bella cascata.
La cascata rappresenta visivamente
il motivo per cui i tempi di caricamento della pagina sono superiori a 15 secondi.
Le barre blu indicano i download di contenuti
necessari per caricare la pagina.
Per l'inizio della visualizzazione della pagina sono stati
necessari quasi sette secondi.
Con questo rendimento, un acquirente di YouTube sul mio sito
deve sostanzialmente attendere sette secondi per
ricevere feedback visivi e più di
15 secondi per il caricamento dell'intera pagina.
Se non avete ancora intenzione di apportare
alcuni di questi rapidi miglioramenti,
tenete presente che, secondo "What Users Want
From Mobile Sites Today", il 61% degli utenti ha
dichiarato che se non trovassero subito ciò che cercano
su un sito per cellulari, passerebbero
velocemente a un altro sito.
Ecco perché è divertente confrontare la propria pagina e
le informazioni sulla relativa velocità con la pagina equivalente di un concorrente.
Avendo sempre praticato sport nella mia vita
ed essendo la più giovane di tre figli,
trovo piuttosto motivante apportare miglioramenti
se vengo superata dalla concorrenza.
Sempre su Web Page Test potete scaricare una visualizzazione filmato
del rendering della vostra pagina per cellulari.
Confrontate liberamente il filmato della visualizzazione della vostra pagina
con le pagine di altri siti del vostro settore.
Volevo concludere con delle indicazioni a risorse eccezionali.
Esiste Page Speed con strumenti come informazioni e articoli su
Page Speed.
Sono inoltre disponibili video straordinari di Ilya
e dei membri del team di Page Speed.
Infine ringraziamo WebPageTest.org.
Grazie per l'attenzione.