іконочние шрифти
іконочние шрифти
-
це шрифти, кожен символ якого представлений іконкою.
До появи іконочние шрифтів дизайнери і верстальники робили сайти з використанням растрових іконок. Це було красиво, але досить незручно. Сучасний Інтернет змінюється і на місце растрових іконок прийшли векторні іконки, виконані у вигляді шрифтів.
Принцип роботи таких шрифтів простий, до web сторінці, за допомогою CSS стилів, підключається додатковий файл шрифту. Веб-майстер в стилях сайту вказує властивості іконок (розмір, колір, тінь та інші) і в розмітці сторінки пише спеціальні теги, на місці яких і з'являються іконки.
Розглянемо плюси і мінуси використання іконочние шрифтів:
переваги
- безліч вже готових наборів іконок із загальною стилістикою;
- зручний пошук іконка дають самі автори наборів;
- іконочние шрифти однаково чітко відображаються на всіх екранах пристроїв, навіть retina;
- спростився процес роботи верстальника при складанні HTML верстки макету;
- іконки вантажаться у вигляді одного файлу шрифту, стало простіше і вигідніше використовувати CDN;
- можна вибрати колір іконки і її розмір;
- можна маніпулювати фоном іконки, наприклад виставити колір або залити зображенням;
- можна змінювати CSS стилі іконки при наведенні користувачем мишкою на іконку, тобто додати більше інтерактивності;
- до іконки можна застосувати сучасні CSS3 стилі, такі як тіні, трансформації та анімація.
недоліки
- дизайнеру важче змінити зовнішній вигляд іконки, так як потрібні додаткові знання векторної графіки і відповідних програмних пакетів;
- після зміни іконки, необхідно збирати набір іконок в файли шрифту і конвертувати в різні формати, що без навичок і відповідного ПЗ зробити проблематично (частково можна вирішити за допомогою fontello.com);
- вантажиться весь набір іконок, навіть якщо ви використовуєте на сторінці всього кілька (вирішується за допомогою fontello.com).
висновки
Порівнявши плюси і мінуси іконочние шрифтів видно, що перші з лишком перекривають другі. Із серйозних недоліків можна виділити тільки один - дизайнеру важче працювати з іконочние шрифтами, але зате скільки зручності користувачам
Якщо ви ще їх не використовуєте іконочние шрифти на своїх сайтах, то вам пора почати це робити.
fontello.com
fontello.com - цей сервіс який дозволяє об'єднувати іконки веб-шрифтів для використання у власних сайтах.
З fontello можна:
- отримати доступ до популярних наборів іконочние шрифтів, створених професіоналами і поширюються під open source ліцензіями;
- об'єднати символи з кількох шрифтів в один файл;
- стиснути іконки в колекціях, що мінімізує розмір файлу шрифту.
Як працювати з fontello.com.
- виберіть іконки, які вам подобаються;
- додайте свої іконки якщо необхідно;
- налаштуйте імена класів, які будуть використовуватися під час верстки;
- налаштуйте коди символів іконок;
- скачайте попередні налаштування.
Fontello сам генерує всі необхідні файли шрифтів і стилів, залишається тільки підключити ці файли до проекту або сайту.