QAQAСЛОВАРЬ / Интерфейсы и медиа
Адаптивные изображения
Набор вариантов одной картинки и подсказки браузеру, позволяющие подобрать файл под размер экрана и плотность пикселей.
Также: srcset, sizes, адаптивное изображение
Как это выглядит на практике
Для фотографии шириной 320 пикселей на телефоне с двойной плотностью может пригодиться вариант в 640 пикселей вместо оригинала на 2400.
Что проверить
Проверьте, какой файл реально скачан. Ошибка в размерах сетки может заставить браузер выбрать слишком большой вариант.
Попробуйте на примере
Покажи HTML для фото с вариантами 320, 640 и 960 пикселей. На телефоне оно занимает почти весь экран, на компьютере — 320 пикселей. Объясни роль sizes.
Вставьте пример в чат и сравните результат со своим вариантом.
Рядом в словаре
Дальше по теме: MDN · Элемент img