Hvordan utsette bilder utenfor skjermen i WordPress

Vi vet alle at hastighet er veldig viktig for SEO og konvertering. Å gjøre et nettsted raskt kan hjelpe nettstedet til å rangere høyere på Google. Og det kan også glede leserne dine. Hvem liker ikke en rask nettside?

Men når du prøver å optimalisere et nettsted for hastighet, kan det være tidkrevende med så mange ting å gjøre. Jeg prøver vanligvis nå og da å teste nettsiden min og sikre at den ikke gir dårlige resultater. Du vet aldri hva som er nytt der ute. I SEO-verdenen endrer ting seg veldig ofte.

Hvis du har sjekket nettsiden din gjennom verktøy for hastighetstesting som Google PageSpeed ​​Insight eller Web.dev, en av advarslene du kan få er å "utsette bilder utenfor skjermen."

I denne artikkelen vil jeg forklare hva det betyr, fortelle deg hvordan du fikser det, og anbefale plugins du kan bruke for å fikse det.

Du bør imidlertid vite at hvorfor utsettelse av bilder utenfor skjermen kan øke mobilhastigheten din, de viktigste faktorene som påvirker hastigheten din er hosting og tema. Her på BloggingTools bruker vi Cloudways fordi det er den raskeste WordPress-hostingen. Hvis du ikke har råd til Cloudways, er Bluehost eller Hostinger gode alternativer. For tema bruker vi det raskeste WordPress-temaet kjent som generere Press.

Hva betyr utsett bilder utenfor skjermen?

Å utsette bilder utenfor skjermen betyr å utsette lasting av bilder som ikke er synlige for brukeren ennå. Dette vil få nettleseren til å fokusere på å laste kun det som er nødvendig og til slutt gjøre nettstedet raskere.

Hvis du har mange bilder på innleggene eller hjemmesiden din, når en bruker besøker nettstedet ditt, begynner nettleseren umiddelbart å laste inn alt. Hvis bildene er mange, kan det ta mye tid å gjengi siden til brukeren.

Men når du utsetter bilder utenfor skjermen, vil bildene bare lastes når brukeren ruller til dem.

Vær oppmerksom på at det ikke bare er bilder du kan utsette, men de fleste av nettstedets eiendeler kan også utsettes til de trengs.

Hvordan utsette bilder utenfor skjermen i WordPress

Du kan utsette bilder utenfor skjermen ved å laste inn bilder. Lazy lasting vil sikre at bilder bare lastes når de er nødvendige. Dette vil igjen gjøre nettsiden raskere.

Når du er i stand til å lade inn bilder og andre eiendeler som hindrer siden din fra å laste raskt. «Defer offscreen-bildene» fra Google PageSpeed ​​Insight og andre testverktøy forsvinner.

Følg disse trinnene for å utsette bilder utenfor skjermen i WordPress:

1. Installer en Lazy loading-plugin

Det er mange plugins for lat lasting som er tilgjengelige gratis i WordPress-plugin-katalogen. Du kan gå til Plugin, legge til ny og deretter skrive lazy loading. Installer alle med gode anmeldelser.

Men du trenger ikke installere noen plugin hvis du allerede har plugins som kan håndtere lat lasting. De fleste caching-plugins har lat lasting. Sjekk caching-plugin-modulen for late lastingsalternativer. Bildeoptimaliseringsplugins har for det meste lat lastealternativ.

Også hvis du bruker Jetpack og autoptimiserer, har de late lastealternativer.

2. Aktiver lat lastealternativer

Når du har installert programtillegget, sørg for at du aktiverer alternativet for lat lasting. Hvis du har en cache-plugin med en lazy loading-funksjon, sørg for at du aktiverer det alternativet.

3. Tøm hurtigbufferen.

Når lat lasting er aktivert, tøm hurtigbufferen, og det er alt!

Du kan teste nettstedet ditt igjen, advarselen bør være borte!

Utsett bilder utenfor skjermen WordPress-plugin

Defer off-screen bilder-plugins er de samme som lazy loading plugins. Her er noen nedenfor:

1. jetpack

jetpack er en av de mest populære WordPress-pluginene med over 5 millioner aktive installasjoner. Hvis du allerede har Jetpack installert, trenger du ikke å installere en ekstra plugin for lat lasting.

Bare aktiver lat lasting i Jetpack. For å aktivere gå til Jetpack-innstillinger og deretter under ytelsesfanen, bla ned og aktiver lat lasting.

2. Autooptimaliser

Autoptimize er en veldig populær ytelsesplugin. Hvis du bruker Autoptimize, er det ikke nødvendig å installere en plugin for lazy loading siden Autoptimize har samme funksjon.

Gå til Autoptimize-innstillinger, klikk deretter på bilder-fanen og aktiver Lazy loading.

3. WP Rocket

WP Rocket er den mest populære premium WordPress caching-plugin. Hvis du bruker WP Rocket, trenger du ikke noe annet plugin, de har lazy loading aktivert.

Gå til WP Rocket-innstillinger og klikk deretter på media, derfra kan du aktivere lat lasting.

4. LiteSpeed ​​Cache

Hvis du bruker LiteSpeed ​​Cache-plugin, Den har en ladefunksjon. For å aktivere, naviger ganske enkelt til mediedelen, og der kan du aktivere lat lasting.

5. a3 Lazy Load

Hvis du bare trenger en plugin for Lazy loading alene da a3 Lat last er en god plugin for det. Bare gå til plugin> legg til ny. Søk etter a3 Lazy Load. Installer og aktiver. Gå deretter til plugin-innstillingene og aktiver lat lasting.

Vanligvis kommer noen temaer, noen cache-plugin-moduler og noen bildeoptimaliserings-plugins med lazy loading-funksjon.

Ofte stilte spørsmål (FAQ)