Красивый шрифт для сайта или просто - другой, не типичный шрифт, если и не делает дизайн сайта богаче, то для юзабилити уж точно играет важную роль. Заголовок с необычным шрифтом оформленным с помощью Cufon легче найти на странице сайта. Кроме того это может быть не заголовок а новостной блок и желательно, чтобы он не сливался с общей массой контента размещаемого на страницах сайта.
Процедура добавления и изменения шрифта с помощью Cufon простая.
- Сначала выбираем кириллический шрифт на Google Fonts и скачиваем.
- Далее переходим в генератор Cufon и из полученного в Google Fonts шрифта получаем js файл (в моем примере это Lobster_400.font.js).
- Размещаем на сайте согласно инструкции описанной ниже.
Две строчки кода нужно разместить перед закрывающим тегом head в дизайне сайта. Предварительно нужно закачать на сайт два файла cufon-yui.js и Lobster_400.font.js (Lobster_400.font.js взят для примера), как видно из кода они размешены в папке js, правильней будет ее создать, для удобства и поиска файлов в случае замены шрифта на другой.
<script type="text/javascript" src="./js/cufon-yui.js"></script> <script type="text/javascript" src="./js/Lobster_400.font.js"></script> Следующий код размещается в самом низу страницы дизайна вашего сайта, перед закрывающим тегом body. Вот и все.
<script type="text/javascript">
Cufon.replace("h1");
</script>
На Хабре вы сможете детально ознакомиться с техникой применения Cufon для изменения шрифтов на сайте. Однако если у вас что-то не получится, вы можете вернуться и скачать готовые три шрифта (см. рисунок) с инструкциями по установке на сайт.
Скачать красивые шрифты для сайта можно по этой ссылке.
