Кошкина Дарья рассказала, зачем дизайнерам создавать, использовать и оптимизировать svg и почему умер smil.

1. COMPANY NAME www.nicecompany.com
Что дизайнеру нужно знать
о SVG

2. COMPANY NAME www.nicecompany.com
Кошкина Дарья
23
UI/UX дизайнер в Syncordia Technologies
and Healthcare Solutions
Email : contact@daria-koshkina.com
Site: daria-koshkina.com
Social Media : facebook (daria.koshkina)

3. COMPANY NAME www.nicecompany.com
Почему SVG?
02
Иконка на сайте будет весить 273 кб?

4. COMPANY NAME www.nicecompany.com
Немного история
02
1999 SVG (Scalable Vector Graphics) — язык разметки векторной
графики, созданный World Wide Web Consortium
2001 IE6 выходит без поддержки SVG
2003 Mozilla начала работу над встраиванием поддержки SVG в
браузер
2005 Adobe отказывается от SVG
2010 SVG возращается
2010 IE не поддерживает SMIL

5. COMPANY NAME www.nicecompany.com
Зачем SVG дизайнеру?
02
Приходит верстальщик к дизайнеру...
Попа. Вид изнутри

6. COMPANY NAME www.nicecompany.com
Зачем SVG дизайнеру?
02
Это вектор! SVG легко
модифицируется
Это свободный формат
и ПО (Inkscape)
Не нужно делать версии
под ретину
SVG быстро загружается SVG может быть
интерактивным
У него есть свои
блекджек и анимация

7. COMPANY NAME www.nicecompany.com
Почему я должен этим заниматься?
02

8. COMPANY NAME www.nicecompany.com
Предварительная оптимизация
02
Уменьшить
количество
отдельных узлов
Объединять
фигуры
Использовать
возможности SVG
при создании
эффектов
Использовать
сетку
Уменьшать
детализацию
Уменьшать
точность

9. COMPANY NAME www.nicecompany.com
Пост обработка
02
svgo-gui

10. COMPANY NAME www.nicecompany.com
Так почему же умер SMIL?
02

11. COMPANY NAME www.nicecompany.com
Кошкина Дарья
Спасибо за внимание
Email : contact@daria-koshkina.com
Site: daria-koshkina.com
Social Media : facebook (daria.koshkina)