Страницы

Поиск по вопросам

понедельник, 3 декабря 2018 г.

В каком виде дизайнер должен передавать верстальщику изображения SVG

Никак не могу найти ответы на некоторые нюансы касаемо svg. Кто должен создавать svg? Допустим есть макет, который необходимо сверстать... Логотипы и иконки не предоставлены дизайнером в svg. Или если есть, то код svg с ошибками. Что должен делать верстальщик в таком случае?
а) Жаловаться дизайнеру/заказчику? b) вставлять png/иконочные шрифты? c) писать сам svg?
Кто пишет код svg от руки, а не рисует? Входит ли это все в обязанности верстальщика/фронтендера (a не дизайнера, например)? В полном ли объеме.
Вот пример кода полученного от дизайнера сделанного в фотошопе


Ответ

Вопрос на самом деле хороший, актуальный, но надо немного под другим углом его задать:
В каком виде дизайнер должен передавать верстальщику изображения SVG.
Какие требования по содержанию кода SVG должны быть предъявлены дизайнеру. Ведь изображение можно рисовать совершенно по разному и многие проблемы верстальщика идут от исходного кода, порою просто невозможно реализовать поставленную задачу.
Например:
иконка нарисована лепкой, а не одиночными линиями, поэтому невозможно будет сделать анимацию. Растровое изображение в векторном формате обернуто в SVG. Поэтому очень затруднительно стилизовать его стилями CSS. Только с применением фильтров.
см. Задать цвет картинке svg в файле со стилями
Изображение в векторном редакторе нормально открывается, а в приложении не попадает в поле видимости. Изображение нарисовано в фотошопе и сохранено плагином в SVG. Код на выходе просто ужасный. Пример Невозможно изменить стили иконки с помощью обычных правил css.
fill, stroke и т.д. К примеру,- стремление дизайнера к оригинальности порой доходит до абсурда. Вместо использования стандартных иконок меньше по весу 1к, типа галочки, он создаёт свой "шедевр" в растровом редакторе и сохраняет в формате base64.
Пример
Конечно, чтобы грамотно предъявить эти требования дизайнеру, необходимо верстальщику освоить начальные знания по SVG самому.

Комментариев нет:

Отправить комментарий