Tell the browser an image’s intrinsic dimensions:

<img
  src="bicycle.jpg"
  alt="A red bicycle parked beside a canal"
  width="1200"
  height="800"
>

The values are unitless pixel dimensions of the source image. They give the browser an aspect ratio before the file finishes downloading.

That lets the browser reserve space. Without it, content below the image can jump when the image appears.

CSS can still display the image at another size. The attributes describe the source and reserve the right shape; CSS controls the layout.

Images below the first screen can use native lazy loading:

<img
  src="gallery-12.jpg"
  alt="Cyclists crossing the harbor bridge"
  width="1200"
  height="800"
  loading="lazy"
>

The browser delays the request until the image is near the viewport. Do not lazy-load the main image visible at the top of the page, because delaying it can make the page feel slower.

Quick check

Result

You got of right.