Изображения для мобильного

Итак, я немного почитал, но я очень смущен. Я новичок в мобильных устройствах, и я в основном использовал css для достижения внешнего вида моего мобильного приложения. Единственное изображение, которое используется в приложении, — это логотип, который появляется на боковой панели.

Я читал о том, как Android требует изображения в MDPI, HDPI и т. Д. А iOS нужны изображения в 2х, 3х. Я так понимаю, это изображения, которые нужно загружать для разной плотности. Чего я не понимаю, так это

  1. Как вы делаете эти изображения для разных плотностей?

  2. Как вы реализуете эти изображения, чтобы они загружались для правильной плотности.

  3. Является ли SVG хорошим вариантом?

Я действительно новичок в мобильных устройствах и почти ничего не знаю в этом отношении. Заранее спасибо.

связанные и, вероятно, полезные: stackoverflow.com/questions/11581649/…

Ответы (1)

SVG — хороший вариант, если вы используете простые векторные изображения. Can I Use показывает, что сейчас поддержка на разных устройствах довольно хорошая. У вас могут возникнуть проблемы, если SVG имеет тысячи точек, так как размер файла может быть немного большим.

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

  • srcsetопределяет набор доступных изображений и позволяет браузеру выбрать лучшее для загрузки на основе установленных вами параметров и размера окна браузера клиента. Не работает в IE , но имеет откат к стандартному srcатрибуту
  • pictureоткрывает возможности художественного направления; они используют в качестве примера изображения 16:9 на настольных компьютерах и квадратные изображения на мобильных устройствах. Не работает в IE или Safari/Mobile Safari .
  • source type— это функция, pictureпозволяющая использовать разные форматы, когда браузер их поддерживает. Итак, если вы хотите попробовать WebP или что-то еще, вы можете добавить его в набор и использовать JPG в качестве запасного варианта.

Я думаю, что результат довольно беспорядочный, но вы можете получить от этого прирост производительности, как демонстрирует автор. Когда дело доходит до объединения всех этих изображений, вы можете экспортировать все эти размеры и типы изображений вручную или найти CMS/плагин на бэкэнде, который может сгенерировать эти вещи для вас.