Does lazy loading affect SEO? Yes, but in both directions, and which one you get depends on what you defer. Deferring offscreen images reduces the work a browser does on first load, which helps page speed. Deferring the wrong image slows down the part of the page users and Core Web Vitals care about most.
The old fear, that search engines cannot see lazy-loaded images at all, dates from a time when every implementation was a custom script. Browsers now support lazy loading natively, and that changes the risk profile completely. The question is no longer whether to lazy-load, but which method and which elements.
What lazy loading does
Lazy loading tells the browser not to fetch a resource until it is likely to be needed, usually as it approaches the viewport. Without it, a long page with dozens of images requests all of them at once, even the ones a reader may never scroll to.
The browser-level version is a single attribute. As the web.dev guide to browser-level image lazy loading explains, the loading attribute takes two values: lazy defers offscreen images, and eager is the default behaviour, loading the image straight away.
Native lazy loading is supported in modern browsers, including Chrome, Edge, Firefox and Safari. A browser that ignores the attribute simply loads the image normally, so there is no failure case. Setting width and height keeps the layout stable while the image waits to load.
The pages that gain most are the long ones: image galleries, product listings, recipe posts with a photo for every step, and long-form guides with charts throughout. On a short page with one or two images, lazy loading changes very little, and the effort is better spent elsewhere. Before adding it, check whether your CMS or theme already applies the attribute for you. Many do, and that is exactly how the problem in the next section usually starts.
Does lazy loading affect SEO through page speed?
This is where most of the real impact sits. The web.dev guidance is direct: “Don’t lazy-load images that are likely to be in-viewport when the page loads, especially LCP images.” The Largest Contentful Paint element is often a hero image. Mark it lazy and the browser deliberately delays fetching the very thing that defines how fast the page appears to load.
The pattern is common because lazy loading is often applied site-wide by a plugin or a theme setting. Every image gets the attribute, including the one at the top. The fix is to exempt above-the-fold images, either by template or by position, and leave them eager.
If a page is failing on LCP, check this before anything else. It is one of the cheapest fixes available. Our guide to a failed Core Web Vitals assessment covers the other usual causes and how to confirm which one applies.
Lazy loading SEO risks: what can go wrong
The method matters more than the idea. Here is how the common approaches compare.
| Approach | What happens | SEO risk |
|---|---|---|
loading="lazy" on offscreen images | Browser defers them until needed | Low; the image is still in the HTML |
loading="lazy" on the LCP or hero image | Browser delays the most important image | Slower LCP; a page experience problem |
loading="eager" or no attribute | Default behaviour, loads immediately | None; right for in-viewport images |
| Custom JavaScript triggered by scroll events | Content appears only after a user scrolls | Content may not be seen when crawled |
The last row is the one that genuinely threatens indexing. Content must be discoverable without user interaction. A crawler rendering a page does not behave like a reader working down it, so text, links or images that load only in response to scroll events may never appear in the rendered version that gets indexed.
Infinite scroll on category or blog listing pages is the classic case. If older items only load as you scroll, and there is no paginated URL for them, those items can end up with no crawlable path at all. Give them real links to real pages. Our wider guide to JavaScript SEO covers rendering in more depth.
The same applies to tabs, accordions and “load more” buttons that fetch text from the server only when clicked. If the content is not in the page until someone acts, assume a crawler may never see it.
How to check lazy-loaded content is being seen
You do not need to guess. Search Console’s URL Inspection tool shows the rendered HTML and a screenshot of how Google processed the page.
- Inspect a representative URL. Pick a long page with images far down, and a listing page if you use infinite scroll.
- Run a live test and view the rendered HTML. Search for an image file name or a sentence from the bottom of the page.
- Check the image tags. The real image URL should be in the
srcattribute, not only in a data attribute waiting for a script to swap it in. - Check the top of the page. Confirm the hero image is not marked
loading="lazy".
Image search deserves a separate thought. If image traffic matters to you, the image needs a real URL in the markup and descriptive alt text, lazy or not. Our post on image alt text for SEO covers the second half.
Is lazy loading bad for SEO? The verdict
The received wisdom swings between two wrong positions: that lazy loading hides content from Google, and that lazy-loading everything is a free speed win. The first is mostly out of date for native lazy loading. The second is how sites end up slowing their own LCP.
The workable rule is short. Use the native loading attribute rather than a custom script. Apply it to images below the fold, gallery pages and long articles. Leave anything visible on load eager, especially the LCP image. Never make content depend on a scroll event to exist, and give every item on a listing page a crawlable link.
One limitation is worth stating. Where the fold falls depends on the device and the viewport, so an image that is offscreen on desktop may be in view on a phone, or the reverse. No single template rule is right for every screen. Test the page at mobile and desktop widths, decide which images are genuinely first-screen on each, and treat borderline cases as eager. More technical guides sit in our strategy archive.
Frequently asked questions
Does lazy loading affect SEO?
Native lazy loading on offscreen images is safe and can improve speed. Lazy-loading the LCP image slows it down, and content that loads only on scroll may not be seen when crawled.
Should I lazy-load my hero image?
No. Images likely to be in the viewport on load, especially the LCP image, should load eagerly. Lazy-loading them delays the most visible part of the page.
Is the loading attribute supported by all browsers?
It is supported in modern browsers including Chrome, Edge, Firefox and Safari. Browsers that ignore it load the image normally, so nothing breaks.
Is infinite scroll bad for SEO?
It can be, if older items load only on scroll with no paginated URLs. Give each set of items a real, linked page so crawlers can reach them.
The takeaway Lazy loading is safe for SEO when it is native and applied below the fold. Keep the LCP image eager and never make content depend on a scroll to exist.
