Мобильный Интернет: обнаружение, когда изображения были отключены

Question

Я столкнулся с очень раздражающей проблемой для мобильного Интернета.Веб-сайт, который у меня есть, использует изображения для большинства своих кнопок, <a href="..."><img> и <input type='image'>.Следовательно, если пользователь отключает изображения, веб-сайт не только не очень хорошо выглядит, но и теряет все возможности навигации по сайту.В частности, Android не отображает alt информацию об изображениях, поэтому на самом деле нет ничего намекающего на то, что изображения не отображаются.

Есть ли способ определить, отключил ли браузер изображения без использования JavaScript?Я хотел бы отобразить более общий текст оптимизированный сайт, если они отключили его.

Answer 1

Без использования какого-либо JavaScript вообще? Боюсь, что это невозможно, по крайней мере, на стороне клиента.

В HTML есть теги NOFRAME и NOSCRIPT, но нет эквивалентных тегов для изображений, содержимое которых будет отображаться только в том случае, если изображения отключены или не поддерживаются.

Тогда для ваших тегов A, обертывающих изображение, возможно, вы могли бы сделать тег A вместо его изображения ответственным за отображение всплывающей подсказки и за обработку событий.

Кроме того, чтобы макет не сломался, если изображения не загружаются, вы можете присвоить тегу A нормальную высоту и ширину его изображения. То же самое будет работать и для тегов <input type='image'>, обернув их в тег span и присвоив ему правильные значения атрибутов.

Например:

<a href="..." style="height: 25px"; width: 80px;" title="Some tooltip text">
    <img...>
</a>

<span onclick="some action" style="height: 30px"; width: 70px;" title="Some other tooltip text">
    <input type='image'...>
</span>