Watch the text, not the picture

The server is not slow. A script on this page waits about two seconds before it gives each image its source, to simulate a slow network. Both images are the same file; only the right one has width and height attributes.

Loading the image sizes…

Without width and height

<img src="…" alt="…">

Mount Hood rises above the lake at dusk, and the trail around the shore takes about an hour. This text starts at the top of the card, because the browser has no idea how tall the picture will be.

When the file arrives, everything below it moves down. If you were about to tap a link here, you would now tap something else.

With width and height

<img src="…" alt="…" width="…" height="…">

Mount Hood rises above the lake at dusk, and the trail around the shore takes about an hour. This text starts below an empty box, because the attributes gave the browser the picture's aspect ratio.

When the file arrives, it fills the box it was promised. Nothing below it moves.