Свободные инструменты UI для [закрытых] разработчиков
Я бы порекомендовал использовать lozad.js + polyfill для отсрочки закадровых изображений (иначе говоря, ленивая загрузка). Я не читал статью о varvy, но кто-то написал, что этот метод откладывает загрузку изображений только после события onload, поэтому начальный вес загрузки страницы остается прежним.
Lozad не будет загружать изображение, пока его не прокрутят в окно просмотра.
Для <img> используйте пустое <svg> в качестве начального значения src, где 6 9 в viewBox ниже определяет соотношение между шириной (6) и высотой (9) => измените эти значения на соответствуют вашему контексту. Это обеспечит отсутствие перекомпоновки в макете страницы после загрузки изображений.
src="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 6 9'%3E%3C/svg%3E"
Обратите внимание, что lozad.js использует Intersection Observer API, который все еще не поддерживает браузер, поэтому обязательно добавьте полифилл.
Удачи!
5 ответов
IrfanView может быть полезен для пакетных преобразований.
ColorMania полезен в качестве действительно простой пипетки / лупы.
У Gimp крутая кривая обучения, но он будет более гибким, чем что-то вроде Paint.Net (что, кстати, я считаю отличным).
Inkscape - отличный инструмент для векторного рисования.
Я считаю его особенно полезным для создания простых логотипов, фонов веб-сайтов и других небольших изображений пользовательского интерфейса.
Требуется немного хотя привыкнуть - не потому, что его пользовательский интерфейс плохой, просто потому, что рисование с помощью векторов сильно отличается от рисования от руки и подобных GIMP и Paint.NET. Стоит потратить время на изучение IMO, и есть несколько хороших уроков.
Мой любимый инструмент - Inkscape . Это программа для рисования в формате SVG - поскольку все рисунки основаны на векторной графике (в сравнении с пикселями), ваши рисунки можно идеально изменить. Кроме того, поскольку ваша «работа» на самом деле представляет собой набор позиций, вы можете настроить изображение намного проще, чем с помощью пиксельного художественного пакета.
Тем не менее, это может быть неуместно в зависимости от того, что вы пытаетесь рисовать.
В дополнение к использованию его для создания иллюстраций для моих программ, я также использую его для макетирования пользовательских интерфейсов.