Довольно часто у многих вебмастеров появляется необходимость в использовании иконок для визуального оформления сайта. Использование картинок в качестве иконок является не совсем практичной затеей из-за проблем с масштабированием и сохранением качества изображения при этом.
В качестве более практичной альтернативы появились иконочные шрифты, которые стали очень популярны среди многих веб разработчиков.
Что из себя представляют иконочные шрифты?
Иконочный шрифт - шрифт, содержащий в себе специальные знаки и символы при помощи которых формируются необходимые иконки. Получившиеся в результате иконки являются векторной графикой, использование которой позволяет вебмастеру получать массу практичных возможностей:
- Масштабируемость без потери качества.
- Возможность оформления при помощи CSS.
- Быстрая загрузка иконки благодаря маленькому размеру.
- Меньшее количество запросов для загрузки.
- Кроссбраузерность.
Перед использованием иконочного шрифта его нужно сначала сформировать. Сделать это можно при помощи сервиса IcoMoon.io
Сервис IcoMoon.io
IcoMoon.io - мощный сервис, позволяющий формировать из различных иконок специальный шрифт для его последующего использования на сайте пользователя.
Помимо иконок, имеющихся в библиотеке, сервис позволяет загружать еще и свои. Их можно скачать на различных сайтах, таких как Iconfinder.com. После этого их нужно предварительно преобразовать в SVG формат. Сделать это можно при помощи сервиса Online-convert.com.
Видео инструкция по установке и использованию иконочных шрифтов
Для подключения CSS файла iconstyle.css, между тегами
/* Корректно указывайте путь до файла iconstyle.css */ <link rel="stylesheet" href="/iconstyle.css"/>
Комментарии