Zum Inhalt springen

Set image width and height

Etwa 10 Min.

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.

Wir merken uns das in diesem Browser, damit die nächste Anleitung denselben Stack verwendet.

At a glance

Time~10 min
CategoryPerformance
Steps2
StacksWordPress, Shopify, Webflow, Next.js, HTML, more

Schritte

  1. Add width and height that match the image’s display box.

  2. 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.