Что такое формат файла SVG?
Аббревиатура .svg расшифровывается как Scalable Vector Graphics (масштабируемая векторная графика), и это формат для файлов 2D-графики. SVG - это язык на основе XML, предназначенный для описания двухмерной графики в виде обычного текста. Формат .svg был разработан *World Wide Web Consortium (W3C)* и является стандартным форматом для отображения векторной графики в Интернете, став рекомендацией W3C в 2001 году (в 2011 году последовала версия SVG 1.1).
Поскольку для описания векторной графики используется текст, масштаб файла .svg можно изменять без потери качества. Проще говоря - содержимое файла (изображение) может отображаться любого размера без пикселизации, что делает .svg идеальным для иконок, логотипов, иллюстраций и элементов пользовательского интерфейса, которые должны выглядеть четко при любом разрешении.
Файлы .svg также могут быть сжаты с помощью алгоритма GZIP, после чего расширение формата меняется на .svgz, а конечный размер уменьшается примерно на 50-80%.
Благодаря своей текстовой природе на основе XML, файлы .svg можно искать, индексировать, сжимать и программировать с помощью скриптов, что делает их идеально подходящими для обмена графикой в Интернете. Все современные браузеры нативно отображают изображения .svg без каких-либо плагинов. Файлы .svg одинаково поддерживаются как простыми текстовыми редакторами, так и продвинутыми векторными редакторами, такими как Inkscape или Adobe Illustrator, и могут содержать растровые изображения PNG, анимацию, стили CSS и интерактивный JavaScript непосредственно внутри файла. Тип MIME - image/svg+xml.
Безопасность и защита
РИСК: MEDIUMSVG - это XML, и он может СОДЕРЖАТЬ CSS и JavaScript, поэтому .svg, открытый в браузере, может запускать скрипты. Это делает вредоносные SVG реальным вектором для межсайтового скриптинга (XSS), перенаправлений и фишинга. Вложения SVG в электронных письмах использовались в кампаниях по распространению вредоносного ПО (под видом «безвредной картинки», которая на самом деле содержит скрипт или форму HTML). Относитесь к незапрошенным файлам .svg как к веб-страницам, а не как к изображениям: не открывайте их от неизвестных отправителей, а на веб-сайтах очищайте загруженные SVG (удаляйте скрипты и обработчики событий) перед их отображением. Открытие SVG в просмотрщике без поддержки скриптов или в редакторе кода для проверки XML безопасно. Избегайте сомнительных сайтов для загрузки «бесплатных просмотрщиков/конвертеров SVG», которые распространяют рекламное ПО - браузер и Inkscape полностью закрывают все реальные потребности.
Детали формата
в двух словахПрограммы, открывающие файлы SVG
Windows4 apps
Adobe Illustrator
Платно Файл -> Открыть .svg для редактирования; Файл -> Экспорт для PNG/JPG. Отраслевой стандарт векторных редакторов. 
Inkscape
Открытый код Основной бесплатный редактор SVG для Linux (SVG является его родным форматом). 
Web browser (Chrome, Edge, Firefox)
Бесплатно Дважды щелкните по .svg или перетащите его в окно браузера, чтобы просмотреть в полном качестве.
Code editor (VS Code / Notepad++)
Бесплатно Откройте .svg как текст, чтобы читать или редактировать XML-разметку напрямую (и просматривать с помощью расширения SVG). 
macOS3 apps
Adobe Illustrator
Платно Файл -> Открыть .svg для редактирования; Файл -> Экспорт для PNG/JPG. Отраслевой стандарт векторных редакторов.
Inkscape
Открытый код Основной бесплатный редактор SVG для Linux (SVG является его родным форматом).
Web browser / Preview
Встроенная Откройте .svg в Safari/Chrome для просмотра; macOS Preview также отображает SVG. 
Linux3 apps
GIMP
Открытый код Импортирует .svg (растрирует его в выбранном разрешении) для попиксельного редактирования или экспорта.
Inkscape
Открытый код Основной бесплатный редактор SVG для Linux (SVG является его родным форматом).
SVG-Edit / boxy-svg (online editors)
Freemium Открывайте и редактируйте SVG в браузере без установки (Boxy SVG или SVG-Edit с открытым исходным кодом). Технические подробности
глубокая спецификация| Структура файла | Обычный текст XML; удобочитаем и редактируем в любом текстовом редакторе без специального ПО |
| Тип MIME | image/svg+xml |
| Кодировка символов | UTF-8 (объявляется в заголовке XML); файл представляет собой обычный текст Unicode без бинарного содержимого |
| Масштабируемость | Бесконечное масштабирование без потерь - геометрия определена математически, поэтому пикселизация не возникает при любом размере |
| Сжатый вариант | .svgz - тот же SVG XML, упакованный в gzip; размер файла обычно на 50-80% меньше |
| Поддержка анимации | Поддерживаются как декларативные анимации SMIL, так и анимации/переходы CSS |
| Скрипты | JavaScript может запрашивать и изменять элементы SVG через стандартный DOM API, обеспечивая интерактивность |
| Стилизация | CSS может применяться через встроенные атрибуты стиля, блоки <style> или внешние таблицы стилей |
| Система координат | Бесконечный холст с определяемыми пользователем единицами измерения; атрибут viewBox сопоставляет координаты документа с областью просмотра |
| Примитивы фигур | path, circle, rect, ellipse, polygon, polyline, line - плюс градиенты, узоры, маски и эффекты фильтров |
| Рендеринг в браузере | Нативная поддержка во всех современных браузерах (Chrome, Firefox, Edge, Safari) - плагины не требуются |
| Встраивание в HTML | Может использоваться встроенно как <svg>, подключаться через <img>, <object>, <embed> или как CSS background-image |
| Доступность | Текстовые узлы считываются машинами; поддерживаются элементы <title> и <desc>, а также атрибуты ARIA |
| Встраивание растра | Внешние растровые изображения (PNG, JPEG) могут быть встроены через элементы <image> с использованием путей к файлам или data URI |
| Идентификация файла | Нет бинарных сигнатур (magic bytes); идентифицируется по корневому элементу <svg, которому может предшествовать объявление XML или DOCTYPE |
| Выпущен | 2001 (SVG 1.0 W3C Recommendation); SVG 1.1 (2011); SVG 2 in development |
| Открыть стандартное | Да · без роялти |
| Спецификация | www.w3.org |
Конвертации SVG
Вопросы и ответы сообщества
спрошено пользователямиВопросов пока нет - станьте первым, кто спросит о файлах SVG.
