Фон вместо встроенных изображений для мобильной оптимизации с помощью медиа-запросов?

Ive Mobile оптимизировал мой сайт с помощью медиа-запросов. Все выглядит так, как хотелось бы, но загружаются ненужные изображения (так как они скрыты с помощью css), что замедляет загрузку страницы.

Самым простым решением этой проблемы, по-видимому, является замена как можно большего количества встроенных изображений на блоки с фоновыми изображениями. Затем я могу скрыть div с медиа-запросом css для мобильной версии.

Я знаю, что у этого есть потенциальные недостатки, которые хорошо описаны в этом сообщении: Когда использовать IMG вместо фонового изображения CSS?

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

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

Обратите внимание, я провел несколько экспериментов с iPhone и Android (я жду, чтобы получить Blackberry), и я знаю, что для остановки загрузки фоновых изображений мне нужно установить display none для родительского элемента div, а не для самого div с фоновым изображением.

Примечание2, в идеальном мире сайты, вероятно, сначала создавались бы как мобильные, но в этой ситуации (и часто в других) существует предел того, насколько исходный сайт может быть изменен.

Спасибо

14
задан Community 23 May 2017 в 12:16
поделиться