Традиционные форматы изображений, такие как JPG, PNG или GIF, очень популярны, но у них есть недостатки, из-за которых их использование не идеально для определенных приложений.
Например, если вы создаете адаптивный веб-сайт, вам нужны изображения, которые будут хорошо выглядеть независимо от ширины и высоты, в которых они отображаются. Традиционные изображения выглядят плохо, если, например, вы их слишком сильно увеличиваете.
Возможно, вам также потребуется отобразить изображение в разных размерах, например, в виде эскиза на индексной странице блога или в виде изображения с полным разрешением в связанной статье.
Хотя вы можете создавать разные версии одного изображения, чтобы выбрать наиболее подходящий, это означает, что вам, помимо прочего, потребуется больше места для хранения.
Формат изображения SVG - это векторный формат. Это означает, что его размер может быть уменьшен или увеличен без потери качества (масштабируемый). Это замечательно, если вам нужно вывести изображение в нескольких местах с разным разрешением.
Другими преимуществами SVG являются то, что его размер обычно намного меньше, и что он дает веб-мастерам некоторую гибкость, когда дело доходит до внесения в него изменений, поскольку некоторые из них могут быть сделаны непосредственно в CSS.
Один пример: Теренс Иден воссоздал логотипы популярных интернет-компаний, таких как Twitter, Amazon, WhatsApp, YouTube или Reddit, в SVG. Размер логотипов был уменьшен до менее 1 килобайта, иногда до 200 байт. Например, логотип Twitter в формате PNG имеет размер 20 килобайт, версия SVG - размер 397 байтов.
SVG - хороший формат для логотипов и значков, но не совсем подходит, когда речь идет о фотографиях и других типах изображений, которые показывают много разных объектов.
Конвертация в SVG
В этом руководстве основное внимание уделяется приложениям, которые можно использовать для прямого преобразования изображений в SVG. Это не руководство по использованию приложений, предназначенных для создания векторной графики с нуля. Для этого вы можете использовать редакторы векторной графики, такие как Adobe Illustrator (наши ссылки на политику Adobe все еще отсутствуют), Inkscape или LibreOffice Draw.
LibreOffice Draw
Для Windows
Скачать сейчасДоступно множество бесплатных конвертеров, которые вы можете запускать онлайн, но они довольно ограничены, когда дело доходит до процесса конвертации. Хотя их может быть достаточно для преобразования простого логотипа, доступного в формате png или jpg, в svg, в большинстве случаев результаты не очень хороши.
Вот как я оценивал услуги: я скачал логотип Ghacks и попробовал преобразовать его на нескольких десятках конвертеров SVG. Я оценил результат и отказался от любых услуг, которые не принесли хороших результатов.
- Aconvert - служба принимает локальный файл или URL-адрес в качестве входных данных. Единственный вариант, который он предоставляет, - это изменить разрешение изображения. Полученное изображение выглядело как логотип Ghacks, но его размер почти вдвое превышал размер логотипа в формате PNG.
- Vector Magic - доступен как онлайн-конвертер и настольная программа для Windows. Однако это не бесплатно (онлайн стоит 7 долларов.95 в месяц, настольная версия единовременный платеж в размере 295 долларов США). Однако результаты онлайн-версии отличные, и вы получаете множество вариантов для редактирования или изменения настроек, а также параллельное отображение исходного изображения и копии svg.
- Векторизатор - еще один бесплатный сервис. Он поставляется с мастером, с помощью которого вы можете выбрать лучшие параметры вывода (размытие, цвета), или вы можете установить их напрямую. Результаты были хорошими с некоторыми настройками, а размер результирующего изображения был на треть меньше, чем исходный логотип PNG.
Векторная Магия
Для Windows
Скачать сейчасТеперь ваша очередь: Знайте о другом онлайн-сервисе или программе для преобразования изображений в формат SVG?