Arial
Arial Black
Arial Narrow
Book Antiqua
Century Gothic
Comic Sans MS
Courier New
Franklin Gothic Medium
Georgia
Impact
Lucida Console
Lucida Sans Unicode
Microsoft Sans Serif
Palatino Linotype
Sylfaen
Tahoma
Times New Roman
Trebuchet MS
Verdana
Webdings
Ограничения использования обусловлены, прежде всего, не кроссплатформенностью шрифтов, вернее, политикой их распространения. Чаще всего для запоминающегося дизайна сайта web-шрифтов оказывается недостаточно. В этом случае дизайнеры используют либо ранее разработанный фирменный шрифт, либо разрабатывают шрифт сами. Для корректной и валидной верстки нестандартных для web шрифтов используют несколько методов:Решение на базе PHP и GD
Отрисовывать шрифты и тексты средствами PHP и библиотеки GD. Откровенно не самое удачное и простое решение. Существенным минусом является тот факт, что в браузер будут передаваться картинки букв, что безусловно плохо скажется на индексации сайта.Решение на базе css
Тупо подгрузить в css.BODY {
font-family: url('path_to_font');
}
Обычно это чревато долгой загрузкой и отработкой стилей.
Решение на базе flash
Ни для кого не секрет, что во flash можно легко использовать практически любые шрифты. Самым популярным в этой технологии решением является sifr. Принцип действия прост: 1) Обычная (X)HTML страница загружается браузером. 2) Запускается javascript функция. 3) Если Flash-плеер не установлен или если JavaScript выключен, то страница загружается естественным образом, без изменений. Если Flash-плеер установлен, то JavaScript проверяет код страницы на наличие обозначенных ранее элементов и создает подходящий по размеру Flash, который накладывается на определённые элементы. 4) Actionscript загружает нужный шрифт размером 6 pt, после чего шрифт растягивается до нужного размера.Нестандартный шрифт со помощью cufon
Ну и самое удачное на мой взгляд решение: использование библиотек typeface.js или cufon. Cufon более универсален, потому будем рассматривать его. Скрипт может внедрить любой шрифт на веб страницу без жесткой привязки к дизайну (т.е. тексты, заголовки, меню и т.п. можно будет изменять, не прибегая к услугам веб разработчиков). Обычный текст при загрузке страницы заменяется на SVG объект (для браузеров, поддерживающий стандарты) или на VML (для IE) — графические области, в которых символы отрисовываются с помощью javascript. Подключается cufon достаточно просто:<script type="text/javascript" src="path-to/cufon-yui.js"></script>
<script type="text/javascript" src="path-to/[имя файла, который сделает cufon-генератор]"></script>
<script type="text/javascript">
Cufon.replace("h1");
</script>
Преимущества
- достаточная кроссбраузерность
- минимум внешних файлов при любом количестве текста с нестандартным шрифтом
- простое внедрение
- владелец сайта спокойно может редактировать текст
- параметры шрифта (размер, жирность, цвет) легко изменить
- есть реакция на hover
- возможность добавления тени у текста (text-shadow - в IE правда тень будет не совсем такая, как нужно)
- защита используемого шрифта от копирования
- возможность разложить шрифт на только нужные символы для уменьшения размера файла-шрифта
- не требует дополнительных библиотек
- небольшой вес скрипта
- наличие внешних файлов — хоть их и мало, все равно увеличат трафик, а значит страница будет открываться дольше
- нет возможности выделить и скопировать текст (над этим работают. в IE уже можно, хоть и выглядит страшновато)
- неприменимо к большим объемам текста
- пока не отработает скрипт, пользователь будет видеть текст со шрифтом по умолчанию
Для поиска рецептов, обмена опытом или просто для общения с единомышленниками заходите на форум программистов!