Для изображений не задано явным образом атрибуты width и height

#1

При проверки скорости загрузки страницы есть пункт “Для изображений не задано явным образом атрибуты width и height”. В админке указан размер фото для страницы категории 189*189 px.

Если указать этот размер в коде, то как тогда браузер будет отрисовывать страницу категории, на планшете или мобильном телефоне, когда произойдет адаптация размера картинки?

Там же размер фото уменьшиться автомтически и подстроится под размер экрана телефона…
Screenshot_2

Или как правильно поступить в этой ситуации, чтобы и исправить проблему и размер автоматически менялся? Может в коде как-то можно указать чтобы размер фото автоматически менялся? Или это и так будет происходить автоматически?

Подскажите, пожалуйста

#2

Неужели никто не делал такого? ((

#3

Для каких изображений у вас не заданы эти атрибуты? Из вашего вопроса это совершенно невозможно понять.

Сделать эти атрибуты переменными в зависимости от устройства не получится.

#4

Думал, что будет не понятно по тексту вопроса… Изображения на странице категории.

Не знаю как обьяснить… Может это и не нужно делать. Не могу понять… Если указать в коде четкую высоту и ширину для фото, как указано в настройках админки - 189px*189 px, то при отрисковке страницы браузером на компьютере будет все ок, так как он зарезервирует под фото такой же размер и после загрузки страницы там появится фото.

А если открывать страницу с телефона, то браузер же тоже, как я понимаю, зарезервирует под фото место размером 189px189 px, но после загрузки страницы - фото по факту станет 141px141 px и получится сдвиг макета…

Или не так работает оно?

#5

Вот что я вижу у меня на странице категории:

<img class="ty-pict cm-image ls-is-cached lazyloaded" 
alt="Китель повара женский белый FJ6820-TRENDLITE-00/82 в интернет-магазине sww.com.ru"
title="Китель повара женский белый FJ6820-TRENDLITE-00/82 в интернет-магазине sww.com.ru"
srcset="https://sww.com.ru/images/ab__webp/thumbnails/540/540/detailed/12/UJ6820_00_82_ru7y-bu_jpg.webp 2x"
src="https://sww.com.ru/images/ab__webp/thumbnails/270/270/detailed/12/UJ6820_00_82_ru7y-bu_jpg.webp" 
data-srcset="https://sww.com.ru/images/ab__webp/thumbnails/540/540/detailed/12/UJ6820_00_82_ru7y-bu_jpg.webp 2x" 
id="det_img_3557desktop" width="270" height="270" 
data-src="https://sww.com.ru/images/ab__webp/thumbnails/270/270/detailed/12/UJ6820_00_82_ru7y-bu_jpg.webp">

Явно указаны: width=“270” height="270"

Что касается страницы на мобильном, то, как вы можете видеть, картинка грузится только тогда, когда до нее дошло дело: img class=“ty-pict cm-image ls-is-cached lazyloaded” — это раз, а для разных мобилок у неё будет разный размер. Например для Iphone SE 144 пиксела, для Iphone 12 Pro — 151 пиксел.

И что, для всех разрешений будет формироваться разная страница?

Думаю, не стоит париться. Никакого глубокого смысла в этом нет :slight_smile:

#6

Ясно. Спасибо

#7

Тема какая у вас? Насколько понимаю это сообщение о явном указании размера картинок выдает pagespeed при анализе. В теме Uni от AB атрибуты у картинок есть и такого сообщения pagespeed не выдает. Но в их же теме yuoupi атрибутов нет и pagespeed ругается. Вот и вся “проблема” зависит от темы

#8

У меня Unitheme 1 версия. В ней как раз и не заданы размеры изображений…

#9

Во второй версии уже заданы вроде.