Explain the srcset and sizes attributes for <img>.?

They help browsers pick the best image for the user’s device and screen size.

Follow me on LinkedIn:

Example:

<img

src="small.jpg"

srcset="medium.jpg 768w, large.jpg 1200w"

sizes="(max-width: 768px) 100vw, 50vw"

alt="Landscape">

• srcset defines available image files and their widths.
• sizes tells the browser how much space the image will take on different screens.

Key Takeaway:

srcset + sizes = responsive images that load efficiently across devices.