Vad är lazy loading?

Kortfattat: Lazy loading gör att bilder och andra resurser laddas först när de närmar sig den synliga delen av sidan.

Varför lazy loading används

Besökaren behöver inte ladda alla bilder direkt. Det minskar den första datamängden och kan göra sidan snabbare, särskilt på mobil.

Inbyggt stöd i webbläsaren

Bilder kan använda attributet loading="lazy". WordPress lägger ofta till detta automatiskt på bilder längre ned i innehållet.

När lazy loading bör undvikas

Bilder högst upp på sidan, särskilt hero- och LCP-bilder, bör vanligtvis laddas direkt eftersom fördröjning kan försämra upplevelsen.

Kontrollera resultatet

Testa sidan på mobil och med långsammare uppkoppling. En aggressiv inställning kan annars göra att bilder blinkar in för sent.

Hitta flaskhalsen innan du optimerar

Mät först med PageSpeed Insights och webbläsarens utvecklarverktyg. Stora bilder, långsam server, JavaScript, typsnitt och tredjepartsskript påverkar på olika sätt. Att installera flera cache- och optimeringsplugins samtidigt kan ge konflikter och gör det svårare att förstå vad som faktiskt förbättrade resultatet.

Praktiska nästa steg

Lazy loading gör att bilder och andra resurser laddas först när de närmar sig den synliga delen av sidan. Börja med att beskriva nuläget, målet och vilka delar av webbplatsen som påverkas. Genomför sedan förändringen i små steg, dokumentera inställningar och kontrollera resultatet på mobil och dator. För en företagswebbplats bör funktion, tydlighet, säkerhet och möjlighet till framtida underhåll vägas samman.

Prioritera verkliga besökare

Testa mobil och långsammare anslutning, och följ fältdata när den finns. En bättre poäng är bra, men målet är att sidan ska bli snabbare att förstå och använda. Kontrollera därför även menyer, formulär, knappar och layoutförskjutningar efter varje optimering.

Fördjupa dig i relaterade guider

Ämnet hänger ihop med flera delar av en modern företagshemsida. Läs vidare om Vad är Core Web Vitals?, Vad är cache?, Hur testar man hemsidans hastighet?. Genom att kontrollera helheten minskar risken att en isolerad ändring skapar problem för indexering, säkerhet, e-post eller prestanda.

Sammanfattning

Lazy loading gör att bilder och andra resurser laddas först när de närmar sig den synliga delen av sidan. Arbeta stegvis, dokumentera nuläget och kontrollera resultatet efter varje förändring. För företag är en hållbar lösning en som både fungerar för besökaren i dag och är enkel att underhålla när webbplatsen utvecklas vidare.