Добрый день дорогие друзья, сегодня я бы хотел затронуть тему шрифтов, а точнее как добавить необходимый шрифт на сайт, если он не является стандартным у Операционной системы.
Так бывает очень часто, когда уникальный стиль дизайна, требует использования нестандартных шрифтов, давайте в этом посте постараемся подробно разобраться, в таком вопросе – как подключение нестандартных шрифтов к сайту.
<img src>
Честно сказать, это просто кощунство, использовать такой способ, но некоторые веб-мастера до сих пор его успешно внедряют в свои проекты.
Минусы: Тексты не индексируются, увеличивается вес страницы.
[css]@font-face { font-family: Morena; /* имя шрифта для CSS правил */ url(path-to/Morena.ttf); /* загружаем шрифт по указанному пути */ }[/css]
После этого, шрифт «Morena» можно использовать в дальнейшей вёрстке макета.
«Morena»
Самый большой плюс этого способа в том, что он обладает полной кроссбраузерностью и тексты индексируются поисковыми системами.
С начало надо подключить к сайту библиотеку Cufon, для этого в <head> вашего шаблона добавте вот такой код:
<head>
[java]<script type="text/javascript" src="http://cufon.shoqolate.com/js/cufon-yui.js"></script>[/java]
После этого надо сгенерировать шрифт, для этого переходите на официальный сайт куфона:
Генерация происходит очень просто, вот несколько советов:
Regular typeface
Bold typeface
Italic typeface
После этого вы получите файл сгенерированного шрифта, который требуется подключить к сайту, сохраните его у себя на хостинге и подключите в <head>:
[java]<script type="text/javascript" src="имя_файла_сгенерированного_шрифта"></script>[/java]
Теперь вы можете использовать гуфон у себя на сайте.
Например, чтобы все тексты в тегах <h1> прорисовывались с помощью Cufon, надо так же в <head> прописать:
<h1>
[java]<script type="text/javascript"> Cufon.replace("h1"); </script>[/java]
По аналогии, вы можете так же указывать для других тегов, на вашем сайте.
Много о тонкостях работы с Cufon, описано на сайте — https://github.com/sorccu/cufon/wiki/styling
Так же можно указать дополнительные стили, прямо в вызове функции Cufon:
[java]Cufon.replace("ul.menu", {color:’#FFFFFF’});[/java]
Чтобы было меньше ошибок и нестыковок в работе скрипта, советуют его использовать одним из первых, то есть лучше всего вызывать гуфон перед другими скриптами на javascript. [sc name=»728 text» ]
Если вы живете в Киеве и вам необходимы услуги по комплексной уборке помещений (жилых и нежилых), клининговая компания Киев проведет данные работы с соблюдением всех стандартов качества.
