ТАк правильно ! Или указывать ширину дива - обертки. Для мобильников самое лучшее решение . width: 100% - еще лучше. Блок вокруг растянется , а картинка займет всю ширину , если прописать пропорции у <img
А вот то, что у вас картинки фиксированного размера - не есть гуд.
У меня на сайте современный формат изображений (webp), который требует Google. Конвертирую png и jpg в webp и вес изображения реально уменьшается. Несмотря на то, что по Google Speed сайт в зелёной зоне 100/100, то Google в подсказках говорит, что я должен уменьшить вес всех изображений webp. Вес каждого изображения 25 КБ, и требует изменить хотя бы до 14 КБ. Для этого нужно уменьшить размер изображения с 500px до 390px. Но, в этом случае полностью теряется качество (резкость) изображения. И Google уже не ругается, но будет ругаться пользователи, если увидят не качественные изображения. Я перебровал всех программы и сервисы по сжатию и оптимизации картинок. Картинка все равно теряет качество.
Скорее всего , у вас на мобильниках показываются изображения размером больше , чем экран . ( Допустим, размер выводимой картинки 500px , а экран 300px/ )
picture в помощь или scrset/ а вообще, я бы забила )))
К сожалению, ссылку не скопировала. Присела в шоке, успела только догадаться принт срин сделать.
Здравствуйте. Как запретить продажу оружия на своем сайте !!!!!!!!!!!!!!!!!!?????????????????????
С ЯНДЕКС МАРКЕТА !
У меня мин СРМ блока стоит 13 руб. в статистике по блоку за сегодня - СРМ - 10 рублей. В общей статистике - какой то адский обвал.
А вы включите в иструментарии хрома мобильник .
Ставьте размер width / height самого img . А в стилях ставите , допустим
@media (max-width: 424px) {picture img, img {width: 100%; height: auto;}}
У меня та же проблема, что и у ТС, единственное ранее CLS хромал, я специально нанял программиста, чтобы подтянул все основные показатели по скорости, и сейчас если смотреть по https://developers.google.com/speed/pagespeed/insights/?hl=ru то все зеленое, CLS для мобильной версии 0,001. Но гугл серч консоль после того как я отправил страницы на проверку опять говорит, что у меня ошибка. Почитав Вашу эту тему на форуме поставил на хром расширение https://chrome.google.com/webstore/detail/web-vitals/ahfhijdlegdabablpippeagghigmibma и оно действительно показывает на многих страницах что CLS все еще красный, хотя данные по самой гугловской проверки другие. Интересно насколько вообще это расширение правдивое и почему такое расхождение с https://developers.google.com/speed/pagespeed/insights/?hl=ru.?
И как таки поправить , CLS, чтобы гугл серч консольне выдавал ошибки.
pagespeed проверяет только начальный экран. Чтобы серч не матерился, нужно чтобы на всей странице не было сдвигов.
Похоже , теперь и при скролле сдвиг суммируется. Теперь надо отложенную загрузку латать.