Cos’è il Lazy Load per immagini e video, come si attiva su WordPress

Postato in data 9 Aprile 2020 da Riccardo Esposito

Il Lazy Load è una tecnica usata sulle pagine web per velocizzarne il caricamento. Questa soluzione si basa su un principio: ottenere il contenuto più pesante come le immagini e i video quando servono. Senza appesantire i tempi necessari per mostrare la prima parte della pagina.

lazy load

Una pagina che può pesare tanto proprio a causa di questi contenuti e tu sai bene che la velocità di upload è un parametro fondamentale sia per l’ottimizzazione SEO che per l’usabilità da desktop e mobile. Hai già scelto un hosting di qualità con dischi SSD per ottimizzare questo punto, ora è arrivato il momento di puntare sul caricamento differito.

Cos’è il Lazy Load e a cosa serve

Si tratta di un’impostazione per le pagine web che consente di caricare i contenuti ma ritardare il download e il rendering in modo da non precludere la visualizzazione di ciò che vede l’utente appena arriva sulla pagina web.

In pratica, con il caricamento differito o ritardato (la traduzione dall’inglese è pigro) impegni l’upload solo per ciò che serve. Evitando ciò che si trova fuori schermo, un’opzione che viene identificata anche da strumenti come Lighthouse. Seguire queste indicazioni vuol dire rispondere ai suggerimenti di Google e far felice l’utente perché il caricamento della pagina guadagna secondi preziosi. Questo, comunque, si manifesta anche con il lavoro di ottimizzazione delle immagini WordPress.

Da leggere: come rinominare le foto per la SEO

Tutti hanno bisogno Lazy Load?

Anche se è una soluzione valida in ogni situazione, possiamo dire che questa tecnica è valida soprattutto per i progetti web che pubblicano pagine ricche di immagini, grafiche e video.

Ad esempio se hai la necessità di mostrare tanti screenshot, o se magari gestisci un blog di cucina con tutorial ricette, il caricamento ritardato può fare la differenza. Chiaramente bisogna precisare un punto: il Lazy Load non ottimizza l’immagine ma gestisce il caricamento.

Per la precisione solo il caricamento. Cosa significa tutto questo? Webmaster e blogger devono caricare sempre una foto leggera, ridotta in termini di peso e dimensioni.

Come funziona il caricamento?

Anche se non sei interessato ai tecnicismi, è utile capire le logiche che si nascondono dietro ai processi di ottimizzazione dei tempi di caricamento. Quindi, come funziona il Lazy Load?

  • Il browser crea il modello della pagina (DOM).
  • Javascript carica ciò che è subito visibile.
  • Il resto viene ritardato fino al prossimo scrolling.

Chiaramente tutto questo diventa un percorso da attivare con le giuste attenzioni. Le voci di corridoio suggeriscono che nelle prossime versioni di WordPress ci sarà il Lazy Load di default.

In altre condizioni, invece, questa funzione è prevista dai template. Comunque ci sono diverse alternative tra le estensioni dedicate a questo CMS. Ecco quelle che preferisco, sempre.

Attivare Lazy Load su WordPress

Il modo migliore per avere il caricamento differito su blog o sito web? Se usi questo CMS la risposta è chiara: aggiungi un plugin dedicato. C’è da dire, però, che la scelta è ampia.

Ci sono tante estensioni per il Lazy Loading delle immagini, anche per il caricamento dei video, di conseguenza è sempre utile avere una selezione di fiducia. Ecco cosa suggerisco.

a3 Lazy Load

Ecco un plug-in semplice da usare ma efficace nell’attivare il processo di caricamento differito su siti e blog WordPress. Obiettivo: migliorare sensibilmente la velocità di caricamento della pagina web. Ovviamente maggiore è il numero di visual del tuo sito, migliore sarà il rendimento del plugin che funziona anche per lo scrolling orizzontale. Come funziona il plugin?

lazy load

Dal pannello di amministrazione di a3 Lazy Load devi attivare il caricamento differito delle immagini ed è tutto subito attivo. Poi hai la possibilità di scegliere e ottimizzare se avere questa funzione per i post, le pagine, alcuni tipi di di contenuti, widget, footer, miniature e avatar.

Lazy Load – Optimize Images

L’estensione di WP Rocket permette di visualizzare immagini (tutte, comprese avatar e icone) su una pagina web solo quando sono visibili all’utente. Ciò riduce, come già indicato, le richieste necessarie per avere la prima visualizzazione e migliora il tempo di caricamento.

Questo plugin non utilizza libreria JavaScript, si applica anche agli iframe di YouTube e puoi sostituirli con una miniatura dell’anteprima per accelerare ulteriormente il tempo di caricamento.

Smush – Compress, Optimize and Lazy Load

Che dire, questo è uno dei migliori plugin per ottimizzare le immagini. Lo suggerisco a chi vuole un unico strumento per fare tutto: puoi ridurre il tempo di caricamento delle pagine con una compressione più o meno avanzata del visual ma anche grazie al percorso di Lazy Load.

Di sicuro è la soluzione che suggerisco a chi ha bisogno di un tool capace di fare tutto il necessario per migliorare il caricamento delle immagini su siti web che hanno tante foto.

WP YouTube Lite

La maggior parte dei plugin in questione gestisce il Lazy Load anche per i video, ma se cerchi qualcosa di specifico ecco la soluzione ideale: WP YouTube Lite è pensato per applicare il caricamento differito agli iframe dei tuoi contenuti multimediali.

Da leggere:  25 utility per ottimizzare le immagini

Caricamento differito: tu lo usi?

E in che modo? Quali sono le possibilità che hai riscontrato dopo aver installato un plugin per il Lazy Load? Ti trovi bene? Ci sono problemi? Lascia la tua idea nei commenti, come sempre.

Clicca per votare questo articolo!
[Voti totali: 0 Media: 0]

Discussione

3 commenti presenti
  • Angelo ha commentato il 2020-05-05 20:11:20

    Ciao Riccardo e grazie per le info che condividi! Ti fornisco volentieri un input per modificare un articolo :-) tutto sommato i lazy load funzionano bene nella mia esperienza amatoriale, sia impostandolo da tema che da plugin.

    Il punto è il lazy load dei widget dei podcast. Gli ho anche scritto (non faccio nomi non vorrei qualcuno mi dicesse faccio pubblicità negativa, ma sono una grossa piattaforma anglo-italiana :-)) il loro plugin wordpress non ha il lazy load: quindi puoi avere 20 tracce (il mega widget non mi piace) distinte in 20 widget (uno per ogni traccia) e la pagina è lentissima a caricarsi

    Cosa che come sai non succede con i video youtube.

    Ciao e grazie per l’attenzione!


  • Gianluca ha commentato il 2020-06-27 12:54:02

    Per attivare il lazy load sui miei siti web utilizzo la funzione integrata nel plugin Autoptimize.
    Semplice da attivare e funziona benissimo.


    • Riccardo Esposito ha commentato il 2020-07-03 14:13:50

      Ciao Gianluca, ottimo. Hai avuto risultati migliori con il Lazy Load? Come si carica ora il tuo sito web?


    Lascia un commento

    Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *