Полезные элементы HTML: picture
работаем с адаптивными картинками в HTML
HTML-элемент picture - контейнер для вложенных элементов source. Он необходим для загрузки адаптивных изображений, оптимизированных в соответствии с выбранными размерами и разрешениями экрана.
picture позволяет определить несколько источников изображения source и выбрать лучший, исходя из возможностей устройства.
Например:
<picture>
<source media="(min-width: 800px)" srcset="large.jpg">
<source media="(min-width: 400px)" srcset="medium.jpg">
<img src="small.jpg" alt="Responsive Image">
</picture>
Таким образом, picture сокращает время загрузки картинки, повышает удобство работы пользователя, предоставляя наиболее подходящее изображение.
Спасибо за внимание.
