Explicit image sizes
Silktide checks that the images on your page declare their size, so the browser can reserve the right amount of space for each one before it downloads. Images without a declared size cause the page to jump around as they arrive.
<!-- Problem: no size, the browser reserves no space -->
<img src="hero.jpg" alt="Spring collection">
<!-- Fixed: the browser reserves an 1200x600 slot immediately -->
<img src="hero.jpg" alt="Spring collection" width="1200" height="600">
Why this matters
Until an image file arrives, a browser has no way to know how big the image will be unless the page says so. Without that information it renders the page with no gap, then pushes everything down when each image loads - so text leaps mid-sentence and visitors tap the wrong thing as targets move at the last moment.
This jumping is measured as layout shift, part of Google's , which also feed into search ranking. Unsized images are its single most common cause.
How to fix it
- Add
widthandheightattributes to every image and video, matching the file's real proportions. The browser uses them to reserve space at the correct aspect ratio even when scales the image responsively. - For responsive images, keep the attributes and let CSS such as
max-width: 100%; height: auto;do the scaling - the reserved space scales with it. - If you cannot add attributes, reserve space in CSS instead with the
aspect-ratioproperty on the image or its container. - Check your : most insert dimensions automatically when images are added through the editor, so missing sizes often come from hand-written , templates, or embedded content.
How Silktide tests this
- Load the page in a real browser, using the device type, connection speed, and test location configured for your speed tests.
- Find every image rendered without an explicit size - no usable width/height attributes and no CSS that fixes its dimensions.
- Report each unsized image, with its location on the page.
Troubleshooting
The page looks fine when I load it
With cached images or a fast connection, images can arrive so quickly that nothing visibly jumps. Visitors on slower networks see the same page assemble piece by piece. Reserved space costs nothing when the image loads fast, and prevents the jump when it doesn't.
Won't fixed sizes break my responsive design?
No. Modern browsers treat the width and height attributes as the image's aspect ratio, not a fixed size, so CSS can still scale the image to fit any screen. The attributes and CSS work together.