Приветствую.
На сайте есть несколько изображений, но так как их много, было принято решение загружать их только по наведению на определенную область. В общем, это слайдер с картинками, предварительно загружаются три картинки (основная, предыдущая и следующая) и при интересе человека полистать этот слайдер, скрытые картинки будут загружаться.
Код этих картинок банален:
<img data-src="image.png" alt="some">
Так сделано по рекомендации из справки Яндекса, процитирую ее:
Картинки скачиваются по ссылкам из атрибута src тега img, а также атрибутов data-src и data-original (в этом случае наличие ссылки на изображение в атрибуте src не обязательно).
При проверке валидатором разметки, валидатор ругается, пишет, ошибка у вас:
Error: Element img is missing required attribute src.
Вариант с использованием loading="lazy" не подходит из-за того, что картинок много, слайдер листают не часто, грузить их все смысла нет.
Если прописать пустой атрибут src="", то валидатор будет ругаться, но уже на пустой атрибут изображения.
Вот как в таком случае быть, что делать, практики какие-то на эту ситуацию знаете?