@MyQuestion
Начинающий Frontend

Оптимизация изображений под разные устройства: работать с одним изображением фиксированного размера или с несколькими изображениям?

Добрый день!

До недавнего времени, мне казалось хорошей идеей, использовать всего одно изображение для всех устройств. И с помощью css (object-fit, background), манипулировать его размерами, и плавно изменять его на любых экранах.
Видимо я был не совсем прав, так?
Похоже, что хорошим решением, в данной ситуации было бы использование тега picture и атрибут srcset. И грузить изображения разных размеров, под разные устройства, с помощью брейк поинтов атрибута srcset. Так ли это?

Раньше, я использовал picture, только ради того, что бы выводить туда webp, и если браузер не может webp, грузить всё остальное...

Как решение использования тега picture повлияет на inline svg? Могу ли я инлайнить svg в srcset? Или лучше, просто давать ссылку на svg файл?

Ну и бонусом...
Как поменять цвет svg, если он подгружается через background css?) Например при состояние ховер? Свойства fill, будут работать? Или в ховер кидать новый background и в коде svg уже менять его цвет?
  • Вопрос задан
  • 126 просмотров
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы