Set image width and height
Width and height (or CSS aspect-ratio) stop layout shift while images load. Follow the steps below on your stack, then re-check the live URL.
Width and height (or CSS aspect-ratio) stop layout shift while images load.
We remember this on this browser so the next guide opens with the same CMS.
At a glance
| Time | ~10 min |
|---|---|
| Category | Performance |
| Steps | 2 |
| Stacks | WordPress, Shopify, Webflow, Next.js, HTML, more |
Steps
Add width and height that match the image’s display box.
Don’t serve a 3000px file for a 300px slot.
In HTML / static
Add alt="…" on each <img>, plus width and height when you know them.
Snippet
<img src="/photo.jpg" alt="Description" width="800" height="600">
FAQ
- What does “Set image width and height” fix?
- Width and height (or CSS aspect-ratio) stop layout shift while images load.
- How long does this usually take?
- About 10 minutes on most CMS and code stacks when you already have access to edit the page.
- Where do I start?
- Start with: Add width and height that match the image’s display box. Then use the platform picker on this page for placement notes.