Svg, fonts, png, background — как правильно вставлять иконки?
Раньше как то не парился и вставлял все с png, но потом узнал о других способах и на время забросил верстку. Сейчас когда приходится что то верстать постоянно стоит вопрос как вставлять различные иконки, так как способов куча определиться очень сложно. Недавно прочитал в какой то теме, что типа шрифты сейчас никто не юзает, но не понял почему. Вообщем прошу объяснить в каких случаях что лучше сейчас использовать и как. Так как с тем же svg есть несколько вариантов (инлайн, спрайт, бэкграунд)
А нельзя с помощью такого спрайта вставить через css? Это единственная причина, почему я боюсь svg.. Я так понимаю для этого надо спрайт уже делать с необходимыми цветами, который впрочем почти ничем не будет отличаться от png спрайта.
В зависимости что вам нужно от svg. Я например вставляю через base64 если не нужно управлять иконкой через css. При этом можно управлять размером через background-size.
Не забывай про обязательное тестирование svg-поделий через реальные моб. устройства! делаю это обязательно после двух проектов, где горе-фанаты svg нахреначили этих горе-спрайтов по самое не хочу и клиенты орали, что планшет перезагружает страницу. Кусок кода весом 3Мб плюс 30-50 доп. запросов на страницу - вот как это выглядело. Поменяли на ОДИН png-спрайт весом 120кб и 8 строчек в css - планшеты взлетели.... Клиент притаранил два ящика VSOP. Я не против модных svg. Я не сторонник консерватизма. Я просто люблю пить дорогущий коньяк.
Простой
