При использовании lazyload - картинка заглушка в шаблоне подставляется в атрибут src.
А нужно помещать в srcset.
Так как Google не индексирует изображения в атрибуте data-src - как это делает yandex.
Для google важно ставить ссылку на изображение в атрибут SRC.
А в SRCSET должны быть изображения для браузера.
Можете исправить?
Сейчас при включении lazylod - картинки выводятся вот таким кодом:
<img src="" data-src="image_url.970.jpg" class="c-product-thumb__image c-product__image c-lazy-image" alt="Image Description" data-contain="1" data-rjs="2" data-sizes="thumbs"/>
То есть атрибут SRC пустой.
Google не сможет скачать эту картинку и использовать его как фактор ранжирования.
Этот пример надо сделать вот так:
<img src="image_url.jpg" srcset="ссылка на заглушку(например изображение размером в 1 пиксель)" data-srcset="image_url.jpg" class="c-product-thumb__image c-product__image c-lazy-image" alt="Image Description" data-contain="1" data-rjs="2" data-sizes="thumbs"/>
То есть атрибут src должен быть заполнен изначально тем изображением - которое должно быть.
А в srcset поместить заглушку(например изображение размером в 1 пиксель) и туда подгружать картинку из Data-src. Или добавить новый атрибут Data-srcset - где будет ссылка на подгружаемое изображение. А можно переименовать Data-src - так как в данном случае Яндекс уже будет брать ссылку на изображения из самого SRC.
И браузеры будут подгружать в первую очередь картинку из SRCSET! А SRC - это ссылка на изображение для поисковиков.
Можете показать проблему на пример на демо-сайт - http://plugins.bodysite.ru/?
Там у вас все реализовано через тег <span></span>. И это очень плохо! Так как картинки поисковиками в таком случае не индексируются и не учитываются в ранжировании страницы. Например на странице http://plugins.bodysite.ru/category/kompyutery/mo/:
<span class="c-product-thumb__image c-product__image c-lazy-image-provider" data-src="/wa-data/public/shop/products/45/00/45/images/254/254.383.jpg" data-alt="Монитор Philips 200V4LAB/00" data-contain="1" data-rjs="2" data-sizes="m-thumbs"></span>
Но если в Тонких настройках темы дизайна отключить пункт "Не использовать тег img для Lazy Loading изображений до их попадания в область видимости" - то изображения будут выводиться так - как я написал выше.
Но если в Тонких настройках темы дизайна отключить пункт "Не использовать тег img для Lazy Loading изображений до их попадания в область видимости" - то изображения будут выводиться так - как я написал выше.
Указано в опции, что тег src будет пустой, если опция отключена — https://yadi.sk/i/kNlPpAdTOSW_cA
Там у вас все реализовано через тег . И это очень плохо! Так как картинки поисковиками в таком случае не индексируются и не учитываются в ранжировании страницы. Например на странице http://plugins.bodysite.ru/category/kompyutery/mo/:
Картинка есть чуть ниже — https://yadi.sk/i/mpsyJgz7lt97YA
Только вот Google картинку в теге noscript может игнорировать и не скачивать. Или может даже посчитать за спам дублирование картинки и описания к картинке.(на зарубежных форумах писали об этом в 2018 годах).
И зачем вообще через noscript увеличивать размер страницы и объем структуры DOM?
Когда можно всё реализовать через <img src srcset data-srcset> ?
И этот noscript он практически бесполезен. Так как надо постараться найти того посетителя - который вырубит у себя Javascript )
Если уж кому-то так нужен noscript - то эту настройку можно отдельно в настройках темы.