<htmlstart/>

Images

Add images to your page with the img element.

The Image Element

Use <img> to embed images. It is a self-closing tag.

<img src="photo.jpg" alt="A sunset over the mountains">

Important Attributes

AttributePurpose
srcPath or URL to the image file
altText description for screen readers and when image fails to load
width / heightReserve space to prevent layout shift
loading="lazy"Defer loading until image is near viewport
<!-- Best practice -->
<img
  src="photo.webp"
  alt="Team photo at the office"
  width="800"
  height="400"
  loading="lazy"
>
Always write a meaningful alt text. Describe what is in the image, not "image of..." — screen readers already say "image".
🧩

Test Yourself

4 questions
Q1.Which tag embeds an image in HTML?
Q2.Which attribute specifies the image file path?
Q3.Why is the alt attribute important?
Q4.Which two attributes control image display size?