Использование нестандартных шрифтов на сайте. Cufón нам в помощь.
Наверное, многие разработчики сталкивались с ситуацией, когда дизайн сайта использует нестандартный шрифт, который отсутствует у подавляющего большинства будущих посетителей сайта.
Вот тут к нам и приходят плагины, которые позволяют использовать возможности браузера нам на благо. Многие современные браузеры поддерживают возможность отрисовки SVG (Scalable Vector Graphics). Одним из таких плагинов является Cufón.
Итак начнем. Для работы Cufón нам потребуется шрифт, который Вы хотите видеть на сайте и немного времени. На сайте проекта необходимо сначала сгенерировать JS-файл шрифта. В принципе, особых проблем возникнуть тут не должно. Отдельно указываете файлы для разных написаний: bold, italic, bold italic. Задаем font-family для нового шрифта, подтверждаем, что лицензия вашего шрифта позволяет встраивание без использования Flash'а. Также нужно выбрать необходимый набор символов, которые стоит включить в JS-файл шрифта (от этого зависит его размер). Имеется возможность ограничить использование сгенерированного файла шрифта в пределах одного или нескольких доменов. Размерность шрифта я не трогал, все работало со стандартными параметрами. Ставим галку напротив условий использования и жмем "Let's do this". Скачиваем получившийся шрифт.
Далее скачиваем непосредственно сам плагин Cufón. Подключаем оба файла на странице:
<script type="text/javascript" src="scripts/example_italic_700-example_300-example_italic_100.font.js"></script>
И указываем какие элементы на странице необходимо отобразить с заданным шрифтом:
Cufon.replace("h1");
</script>
Стоит заметить, что вместо h1 можно использовать jQuery-подобные селекторы.
Не буду добавлять пример использования к себе. Время уже поздно, да и влом мне если честно =)
Вот тут документация и куча демок