Оригинальное название: Серен Дэвис: смерть иконочным шрифтам — EpicFEL 2015
Презентация на конференции EpicFEL, 26 сентября 2015 г.
видео:
В этой главе я обсуждаю презентации иностранных спикеров. Не стесняйтесь поправлять меня в комментариях ;).
TL;DR: Используйте SVG
В чем именно проблема с иконочными шрифтами?!
- Люди с дислексией используют специальный шрифт, который заменяет ваш шрифт, поэтому символы не отображаются.
- Программы чтения с экрана: они неправильно читают ваши символы.
- Пользователи Opera mini: браузер не поддерживает иконочные шрифты (более 250 миллионов пользователей по всему миру)
- Юникод, используемый для шрифтов, различается в разных браузерах (и оказывается, так)
- iOS 9 может включить блокировку внешних шрифтов
Но есть преимущества иконочных шрифтов, для которых они используются:
- Масштабируемость
- Стиль: изменить цвет значка
- Уменьшение количества http-запросов
Шрифт иконки в Chrome ~5x SVG ATM (c) Эдди Османи
Но стоит ли?!
Мы ищем выход. Мы нашли. Это SVG:
- Хорошая доступность, если он встроенный, вы можете добавить заголовок и описание к значку.
- Масштабируемость. Тот же вектор
- Мультистилизация: много цветов на 1 иконку
- Анимация
- Вы можете использовать как простые изображения в теге img, так и в css (фон), также тег svg и систему иконок
- Хорошая поддержка браузеров: от IE9+
Итог в одной картинке:
Иконочный шрифт против SVG
Спасибо всем
УПД: Еще одна полезная статья 10 причин перейти с иконочных шрифтов на SVG
