srcset
srcset is an HTML attribute that offers the browser several sizes of an image, so each screen downloads one that fits.
srcset is an attribute on an HTML image that gives the browser a list of versions of the same picture at different sizes. The browser picks the one that suits the screen, so a phone downloads a small file and a large monitor gets a sharp one. MDN explains how it works in its guide to responsive images.
For a marketer, srcset is a page speed fix you ask a developer for. Images are often the heaviest thing on a page, and sending a huge photo to a small phone wastes time your visitors won't wait for.
What it looks like
<img src="beans-800.jpg"
srcset="beans-400.jpg 400w, beans-800.jpg 800w, beans-1600.jpg 1600w"
sizes="(max-width: 600px) 100vw, 50vw"
alt="Bag of Fernhill Coffee house blend beans">The srcset lists the files and their widths. The sizes tells the browser how wide the image will be shown, so it can choose. The src is the fallback, and the alt text describes the picture for screen readers and search engines.
For example, if Fernhill Coffee's product photos are all 3,000 pixels wide, every phone visitor downloads several megabytes per photo. With srcset, a phone might get a 400-pixel file a fraction of the size, and the page shows up much sooner.
Why it matters for search
Page speed on phones is part of how Google measures page experience, and the largest image on a page is often what decides how quickly its main content appears. A faster page is also easier for any bot to fetch.
In AnswerOrbit
The Pages tab in Website shows each page's health on a phone, from how quickly its main content shows to how much it weighs, banded by Google's Core Web Vitals thresholds. See Website and AI traffic.