An image without width and height attributes takes no space until it has downloaded, so the content below it jumps down when it appears. That jump is a layout shift, which hurts your Cumulative Layout Shift score and annoys visitors. Lighthouse reports it as “Image elements do not have explicit width and height”.
It is one of the most common issues we see: 17 of the 24 sites SignalCrawler audited in September and October 2026 had images without dimensions.
Why it works even in a responsive layout
Modern browsers use the two attributes to calculate the image's aspect ratio before it loads, and reserve the right amount of space at whatever width CSS gives it. You keep a fluid layout:
<img src="photo.jpg" width="1200" height="800" alt="A red running shoe, side view">
img { max-width: 100%; height: auto; }
The attributes say “this image is 3:2”; CSS says “fit the column”. The browser reserves a 3:2 box at the column's width.
How to add them
Plain HTML. Use the image file's real pixel size, or any numbers with the same ratio. They must match the real proportions, or the image will be stretched; if the box and the image differ on purpose, add object-fit: cover.
CSS backgrounds and containers. For elements that are not <img>, use aspect-ratio:
.card__thumb { aspect-ratio: 16 / 9; }
WordPress. Images inserted through the block editor get dimensions automatically. Missing ones usually come from a theme or plugin that writes <img> tags by hand, from images pasted as raw HTML, or from SVG logos. Fix the template or the plugin settings rather than individual posts.
Next.js. The next/image component requires width and height (or fill with a sized parent) and sets them for you.
Lazy-loaded images need dimensions most of all, since they load while the visitor is reading.
Do not lazy-load the main image
While you are there: the largest image at the top of the page should not have loading="lazy". Lazy-loading it delays Largest Contentful Paint. Load it normally, and consider fetchpriority="high".
How to check that it worked
- Lighthouse no longer lists images without explicit dimensions.
- With Chrome DevTools' Rendering → Layout Shift Regions enabled, nothing flashes as images appear.
- Images are not stretched at any screen width.
What SignalCrawler checks here
The audit reports images without width and height on every crawled page, grouped by template, flags a lazy-loaded largest image, measures layout shift in a real browser, and finds pictures that are stretched out of their proportions.