Quick answer

Give important images stable intrinsic dimensions or an aspect ratio so the browser can reserve space before the image arrives. This reduces avoidable layout movement, but the correct dimensions must reflect the rendered asset and responsive design.

What the issue means

An image without width and height information may leave the browser guessing how much space to allocate. When the image loads, surrounding content can move. CSS aspect-ratio can also provide a reservation when used consistently.

Why it matters for SEO

Layout stability affects usability and can contribute to performance metrics. The finding does not prove a specific Core Web Vital score or mean every image needs hard-coded desktop dimensions.

How NOTABIS detects it

The image-missing-dimensions rule examines measured image markup for dimensions. It does not fully evaluate CSS layout, art direction, lazy-loading strategy, or the final rendered size on every device.

How to check it yourself

Inspect image elements and compare their declared ratio with the actual asset. Test narrow and wide viewports, slow loading, responsive sources, and images inside changing containers.

How to fix it

Add accurate width and height attributes or a suitable CSS aspect ratio. Keep the image responsive with max-width: 100% or the framework equivalent, and avoid distorting the asset.

When it may be intentional

Decorative backgrounds, dynamically sized canvases, or images whose dimensions are controlled reliably by a component may need a different implementation. Verify actual layout behaviour before changing them.

Related issues

Review legacy formats, missing alt text, large HTML, and real performance measurements.

Run a NOTABIS audit

NOTABIS highlights image markup that deserves inspection; validate the fix with a responsive browser test.