Font Awesome - бесплатный свободный шрифт с иконками(значками) для веб-дизайна

Для начала, приведу небольшой пример. Вот так вот в моем новом проекте выглядит форма авторизации:

Пиктограммы на рисунке представляют собой иконический шрифт. Использование подобных шрифтов весьма оправдано для создания кнопок, панелей управления и прочих управляющих элементов. Кроме простоты использования, это например дает нам возможность применять по отношению к таким "тектовым" пиктограммам те же css-правила, что применимы и для обычных шрифтов.

Font Awesome - бесплатный, свободно распространяемый шрифт с векторными значками, что позволяет добиться масштабирования иконок без потери качества.
Скачать его можно здесь.
На данный момент последняя версия имеет номер 3.0 и содержит 249 пиктограмм практически на все случаи жизни. Поддерживается во всех браузерах, начиная с IE 7.

Итак, краткая инструкция по использованию:

1. Качаем с сайта архив
2. Из скачанного архива извлекаем файл font-awesome.css и папку fonts и помещаем их в каталог нашего веб-приложения.
3. Проверяем в файле font-awesome.css в директиве @font-face, чтобы правильно были указаны пути на директорию, где у нас лежит папка fonts.
4. В файле стилей приложения подключаем стили Font Awesome:

@import url('font-awesome.css');

Теперь можно спокойно использовать пиктографический шрифт в нашем проекте, например следующим образом - добавим кнопку "Войти" с пиктограммой входа:

<button type="submit" name="submit" id="loginsubmit"> 

<i class="icon-signin icon-large"></i> Войти 

</button>

 Список всех иконок с названиями расположен на сайте Font Awesome.