Как только у пользователей интернета появились дисплеи высокого разрешения, появились проблемы с растровой графикой, а именно невозможность нормально масштабировать картинки или иконки.
Растровая графика - это изображение, представляющею собой сетку пикселей, которое ограничено размером самой картинки, т.е. если мы начнем увеличивать изображение, то оно, мягко говоря, будет выгладить размыто. И тут на сцену выходит SVG - масштабируемая векторная графика, которая с легкостью справится с проблемой.
Что такое SVG?
Scalable Vector Graphics (сокращённо SVG) - Масштабируемая векторная графика - спецификация языка разметки, основанная на XML и формат файлов для двумерной векторной графики, как статической, так и анимированной.
Особенности SVG
Отличием от других форматов svg является то, что он имеет текстовый формат, потому его не сложно редактировать, причем в обычных текстовых редакторах.
Если правильно оптимизировать формат svg, то он будет весить меньше, чем другие графические форматы.
SVG можно менять или управлять анимацией при помощи CSS и JS. Это позволяет создавать интересную и анимированную графику, что нельзя сделать с другими графическими форматами.
SVG поддерживает практически все современные мобильные браузеры, потому svg отлично подходит в использовании мобильных приложений и адаптивных сайтах.
С помощью JavaScript и различных библиотек (raphaeljs.com, snapsvg.io, svgjs.com) можно создавать интересную анимацию, все зависит только от фантазии автора.
На сегодняшний день SVG становится все популярнее для мобильных приложений и сайтов, поэтому наша студия зачастую использует формат svg для создания сайтов.
