Most website flaws are quiet. A broken link only reveals itself when someone clicks. A missing meta description only shows up out in the search results. A broken image is different. It sits right there on the page, a gray rectangle with a little torn-photo icon where your hero shot, your product photo, or your team picture was supposed to be. Every visitor sees it immediately, and every visitor draws the same conclusion: this site isn't being looked after.
The cruel part is that you're the least likely person to notice. Your browser cached that image weeks ago, so it still loads perfectly for you while it's 404ing for everyone arriving fresh. You can scroll past the exact spot a hundred times and never see the hole your visitors can't stop seeing. This guide covers how to find broken or missing images across your whole site, so the gray box gets caught by you and not by a customer.
What counts as a broken or missing image
A broken image is any <img> whose source file fails to load, so the browser shows its fallback placeholder instead of a picture. The usual causes:
- The image file was deleted, moved, or renamed, but the page still points to the old path.
- A CMS or platform migration broke the image URLs, a classic and widespread culprit.
- The image lives on a third-party host or CDN that went down, changed, or removed it.
- A typo in the file path, easy to make in hand-coded HTML.
- A hotlinked image from another site that blocked hotlinking or took the file offline.
The result is the same in every case: a 404 where a picture should be, and a visitor staring at a placeholder.
Why broken images matter more than they look
They're the most visible signal of neglect
A visitor can forgive a lot they don't notice. A broken image is impossible not to notice. It's a literal hole in the page, and on a product page, a portfolio, or a landing page meant to convert, it reads as carelessness at exactly the moment you're asking someone to trust you. Few things undercut a polished design faster than one missing photo in the middle of it.
They cost you SEO and image search
An image that returns a 404 can't be indexed, so it can't show up in image search, and any ranking it once had disappears. Broken images also drag on the page experience signals search engines care about, and they often travel with broken links, which waste crawl budget. A page riddled with 404ing assets tells a crawler the same thing it tells a visitor: this isn't maintained.
They break the experience you designed
Images aren't decoration. They carry information, set tone, and guide the eye. When one fails, the layout can collapse, text can reflow awkwardly, and the story the page was telling falls apart. A missing diagram on an explainer or a missing product shot on a store page doesn't just look bad, it removes the thing the page needed to do its job.
How to find broken or missing images
There are a few ways to track these down, from manual checks to scanning the whole site at once. Which fits depends on how big your site is and how often you need to check.
1. Eyeball it, with cache disabled (free, unreliable)
You can click through your pages looking for placeholders, but do it in a private window or with the cache disabled in your browser's dev tools, otherwise your cached copies will load and hide the very images that are broken for everyone else. This works for a quick look at a handful of pages, but it's slow, easy to miss things, and hopeless across a large site.
2. Browser dev tools console (free, page-level)
Open the developer console on a page and failed image requests show up as errors, usually a 404 next to the file path. More reliable than eyeballing because it catches images even if you scrolled past them, but it's still one page at a time and assumes you're comfortable reading a console.
3. An on-demand quality controller (the whole site, at once)
This is the approach that matches the actual problem: scan every page in one pass and get back a list of exactly which images, on which pages, are failing to load, with no cache games and no console-reading.
Steterly does this directly. It crawls every page, requests every image, and flags the ones returning a 404 or otherwise failing to load, telling you which page each dead image lives on so you can go straight to the fix. You can start with a free scan of up to 50 pages, no credit card required, with dead-image checks included.
Because it requests each asset fresh from a headless browser rather than serving you a cached copy, Steterly sees exactly what a first-time visitor sees, so the images that load fine for you but 404 for everyone else don't slip through. And since it's already crawling everything, the same scan surfaces what tends to break alongside images: broken links, images missing alt text, missing meta descriptions, typos, placeholder text, and Core Web Vitals issues. One scan, the whole picture.
How to fix broken images once you find them
What you do depends on why the image broke.
- File deleted or moved: re-upload it to your media library and update the page to point at the correct path, or restore it to its original location if it was removed by mistake.
- Migration broke the URLs: this is usually a pattern, not a one-off. Find the common cause (an old domain, a changed folder structure) and fix it at the source rather than image by image.
- Third-party or hotlinked image gone: stop relying on someone else's server. Download a properly licensed copy, host it yourself, and update the reference.
- Typo in the path: correct the
srcattribute. While you're in there, confirm the image actually exists at the corrected path. - While you're fixing it: check the alt text too. Broken images and missing alt text travel together, and you're already in the right place to fix both.
How to stop images from breaking again
Fixing them once feels good. Doing it repeatedly after every migration does not. A few habits keep the gray boxes away:
- Host your own images. The more you rely on third-party servers and hotlinked files, the more breakage you inherit when those sources change. Keep your important visuals on infrastructure you control.
- Set up redirects or update paths during migrations. Image URLs are among the most common casualties of a redesign or CMS move. Map them deliberately rather than hoping they survive.
- Scan at the moments that matter. Before a launch, right after a migration, and on a regular cadence. For the full routine, see our pre-launch website audit checklist.
- Don't delete assets that are still referenced. Before removing an image from your media library, confirm no live page still points to it.
Frequently asked questions
Why do my images look fine to me but broken to visitors?
Your browser cached the images when they still worked, so it keeps showing you the old copies even after the files are gone or moved. New visitors get the live version, which 404s. Always check in a private window or with the cache disabled, or use a tool that requests each image fresh the way a first-time visitor would.
How do I find all broken images across my whole site at once?
Eyeballing pages and reading the dev console only cover one page at a time. To check an entire site, use a crawler that requests every image on every page. Steterly scans your whole site in one pass and flags each image that returns a 404 or fails to load, with the page it's on.
Do broken images hurt SEO?
Yes, in a few ways. A 404ing image can't be indexed or rank in image search, broken assets drag on page experience signals, and they often accompany broken links that waste crawl budget. No single broken image will sink your rankings, but a site full of them signals poor maintenance to both visitors and search engines.
What causes images to break after a website migration?
Migrations frequently change the domain or folder structure where images live, while pages keep pointing at the old paths. The references no longer resolve, so the images 404. Because it's usually a systematic pattern, the fix is to correct the underlying path or set up redirects, not to repair each image individually.
What's the difference between a broken image and a broken link?
Both are 404s, but a broken link is an anchor that leads nowhere when clicked, while a broken image is an embedded file that fails to display, leaving a placeholder in the layout. A broken link is invisible until someone clicks; a broken image is visible the moment the page loads. A good scan catches both.
Can I find broken images for free?
For a few pages, the browser dev console works at no cost. For a whole site, that doesn't scale. Steterly offers a free scan of up to 50 pages with no credit card, with dead-image checks included, so you get a clear list of every broken image across your site.
Catch the slips before your visitors do
A broken image is the one flaw you can't hide behind a clean layout. It sits in plain sight, telling every visitor the site isn't being watched, while your cached browser quietly keeps you from ever seeing it. The fastest way to close that gap is to scan the whole site the way a first-time visitor sees it, and fix whatever comes back.
Steterly is the quality controller for that job. Start with a free scan (no credit card required) and get a clear list of every broken or missing image, alongside the broken links, typos, and missing tags across your site, so you can fix the gray boxes before a single visitor lands on one.