Веб-шрифты. Инструкция
Сегодня я расскажу как установить уникальные шрифты на блог.
Выбирая шрифт для сайта, если вообще такой выбор стоит, заключается в том, что в первую очередь он должен выполнять первоочередные для шрифта задачи. Шрифт должен быть таким — каким его удобно читать. На этом все его функции заканчиваются, красота, цвет, наклон — всё это второстепенно. Вообще можно поставить абсолютно любой экзотический шрифт, и сидеть им любоваться, в одиночку 
.
Почему в одиночку ? Да потому — что, если в системе посетителя данного шрифта нет, он и не увидит всю эту красоту. И в лучшем случае увидит стандартные буковки. Хотя особо он и не расстроится, ведь он даже не подумает о том что у Вас стоит нереально креативный шрифт ^_^ Поэтому выбирают тот шрифт, который вероятней всего установлен в системах посетителей.
Если задаться поиском с целью уникализировать шрифты у себя на сайте, то вы обнаружите что решения существуют и немало. Cufn, sIFR, @font-family , также используют Javascript и вероятно ещё несколько способов которые я в поиске не увидел.
Google Font API
Самое элегантное решение на данный момент.
Данный способ на фоне «конкурентов» заметно отличается. Простота установки и никаких проблем с поисковиками. «Машина» Google обладает достаточно серьёзной мощностью, из чего следует отсутствие проблем с загрузкой шрифтов для посетителей. Причём если посетитель уже бывал у вас на ресурсе, то при следующем посещении шрифты будут подгружаться из кэша.
Что будет с блогом спустя время мне и самому неизвестно, но на момент написания и публикации статьи вы можете наблюдать то о чём я говорю в заголовка моих записей.
Первый шаг — ознакомление и выбор шрифта.
В первую очередь нужно посетить сам сервис . И выбираем вкладку Cyrillic, они-же кириллические шрифты, тобишь наши.
Выбор пока не очень богат, но думаю это дело времени.
Выбираем понравившийся шрифт и попадаем собственно к настройке визуального вида и получения готового кода.
Установка на сайт для WordPress.
Первую часть кода, (картинки кликабельны) нужно поместить в между тегами <head> </head>.
В wordpress это файл header.php. Подробнее о файловой системе wordpress можете ознакомиться здесь.
У меня эта строчка выглядит так:
<link href="http://fonts.googleapis.com/css?family=Lobster:regular&subset=cyrillic,latin" rel="stylesheet" type="text/css" >
Это важно -> Каким-бы не был красивым и чудным выбранный шрифт, необходимо помнить, что прежде всего он должен быть удобным для чтения.
Поэтому лучшим вариантом будет закрепить выбранный шрифт только за заголовками статей.
Для достижение этой цели — нужно скопировать код который находиться внутри body { скопировать_только этот_код }.
Открыть style.css найти заданное стилевое решение для заголовков h2 и заменить кодом который нам предоставил Google Font API.
В моём style.css это выглядит следующим образом:
h2 {
font-family : 'Lobster', serif;
font-size : 34px;
font-style : normal;
font-weight : 400;
text-shadow : #aaa 2px 2px 2px;
text-decoration : none;
text-transform : none;
letter-spacing : 0;
word-spacing : 0;
line-height : 1.2;
}
h2 a {
font-family : 'Lobster', serif;
font-size : 34px;
font-style : normal;
font-weight : 400;
text-shadow : #aaa 2px 2px 2px;
text-decoration : none;
text-transform : none;
letter-spacing : 0;
word-spacing : 0;
line-height : 1.2;
}
Сохраняем результат.
Всё, можно перезагружать страницу и любоваться результатом 
Если вы хотите, прежде чем ставить шрифты, сначала посмотреть как будет смотреться ваш блог/сайт с определённым шрифтом, можно воспользоваться расширением для браузера Chrome.
А как вы относитесь к подобным решениям ? ^_^
Спасибо за внимание. С уважением OlegS9.
Google Font API,
приятные мелочи,
шрифт для сайта
-
Говорит:
16.05.2011 около 1:42 пп
Прикольно. Мне понравилось попробую у себя.
-
Говорит:
16.05.2011 около 6:00 пп
Как такие шрифты установить на сайт на «народ.ру»? было бы очень желательно. Стандартные шрифты в заголовках совсем не смотрятся.
-
Говорит:
24.05.2011 около 9:33 пп
Спасибо огромное.
В закладки. Давно хотел узнать как лучше поставить шрифты
-
Говорит:
25.05.2011 около 6:07 дп
Хорошая статья! Так подробно всё описано
-
Говорит:
26.05.2011 около 1:14 пп
Использование нестандартных шрифтов приветствуется, только трабла — сильно увеличивается время загрузки сайта, ибо подгружаются эти самые шрифты. Поэтому рекомендуется использовать стандартные. Представь, что с мобилки залазит чувак на сайт, а там подгружается файл на 500 Кб. А у него инет тормознутый... просто уйдет, подумает, что сайт недоступен.
-
Говорит:
18.02.2013 около 12:11 пп
Сделал сайтик с кириллическими шрифтами. Пока чуть больше сотни.
Имеется более 700 русских шрифтов. Постепенно выложу все. Принцип как на гугл фонтс. Буду рад советам и комментам.
Написать ответ
