Что такое srcset — адаптивные картинки в HTML
Что такое srcset: как браузер выбирает файл из нескольких URL и как достать эти ссылки со страницы.
srcset перечисляет варианты одного <img> или <source>, обычно с шириной (800w) или плотностью (2x). Браузер берёт один файл под вёрстку и DPR экрана.
В src может быть маленький превью, а крупный файл — только в srcset. Парсер картинок в ToolsHelper читает оба, плюс data-srcset у ленивой загрузки.
srcset перечисляет адреса картинок и ширину или плотность. Браузер выбирает один по ширине вёрстки и плотности экрана. Дескриптор w — ширина в пикселях, например 800w. Дескриптор x — плотность, например 2x. Иногда один и тот же снимок указан трижды; качать все три — лишний трафик. Здесь определение атрибута. Парсер как раз выписывает эти адреса со страницы.
Частые вопросы
srcset это то же, что src?
src — запасной URL. srcset — список размеров, из которого браузер выбирает.
Почему превью мелкое, а ссылка большая?
В галерее может быть миниатюра, а скопированный URL — кандидат 2x или 1200w.