Иконки для сайта. Font Awesome

awesome

Сегодня я расскажу о проекте, который просто нельзя обойти стороной, и о котором не знать — большое упущение. Лично я бы поставил его в одну линейку с jquery и twitter bootstrap: «скоро на всех сайтах страны».

Что такое Font Awesome?

Font Awesome — это шрифт, состоящий из самых востребованных иконок, или пиктограмм, для сайтов. 220 иконок в одном шрифте, шрифт абсолютно бесплатен и свободно распространяем.

Font Awesome пользуется большой популярностью у заморских разработчиков. До нас все доходит не сразу, но абсолютно уверен,  наступит время и на каждом новом сайте будут зиять иконочки Font Awesome, и не использовать их будет только ленивый.И это понятно, потому что подход имеет ряд преимуществ. Когда я начал знакомство с Font Awesome, в голове крутилось что-то среднее между «наконец-то» и «блин, это действительно круто»

ссылка на страницу Font Awesome

 

Почему я должен использовать Font Awesome ?

geek

  • к символу можно применять различные шрифтовые css-стили, а значит на лету можно добавлять тени или обводить контуром(text-shadow), менять цвет(color)
  • символ векторный, его можно увеличивать и уменьшать без потери качества с помощью аттрибута font-size
  • шрифт уже запакован в один файл, это также выгодно, как и спрайт для картинок-иконок
  • кроссбраузерность, да, ребятам удалось добиться поддержки FontAwesome даже в IE7
  • вам этого мало? может мне убить себя, этого будет достаточно?

Интеграция с Twitter Bootstrap

И счастье было бы неполным, если бы это все дело не было предназначено и не интегрировалось так просто с Twitter Bootstrap.

Не знаете, что такое Twitter Bootstrap? Рекомендую ознакомиться, тренды веб-разработки знать не помешает).

Вся прелесть в том, что fontawesome легко заменить стандартные иконки Boostrap — glyphicon. Для этого авторы Font Awesome на своем сайте предоставили LESS и инструкцию по применению, вполне несложную.Делать красивые сайты становится просто и приятно. Казалось, совсем недавно мы смогли только отказаться от четырех картинок в пользу border-radius, потом twitter bootstrap, собравший воедино лучшие практики разработки сайтов веб 2.0, затем html5 и это…буквально за один год фронтенд-разработка пережила огромные изменения

Послесловие

Меня, честно говоря, пугает однотипность сайтов, использующих twitter bootstrap и font-awesome. Но такова цена удобства. Однотипность — обратная сторона универсальности. Главная причина — эти фреймворки уникальны в своем непревзойденном качестве. Они перевели фронтенд на качественно новый уровень, и являются эксклюзивом на рынке. Вряд ли так может продолжаться долго, и новые качественные инструменты не заставят себя ждать.

Оставить комментарий