Экспериментирую со шрифтами блога
[не очень актуально]
—=•=·•·=•=—
Как всегда. Пользуясь случаем и настроением, конечно, я стал копаться и в собственной-несобственной теме «Либрио», [некогда] установленной здесь на блоге. В очередной раз удивляюсь своей лениво-пофигительной заторможенности в этом вопросе. Еще давно (!), наблюдая свои сайты под линуксом, я ужасался тому, как отображаются тексты — т.е. какие шрифты применяются не в виндоусе. Какие попало, разной степени кособокой страшности…
Тема создана с использованием стандартных виндовых шрифтов, которые установлены у всех. Verdana — для текста общего назначения и Trebuchet MS — для заголовков. Естественно, в альтернативных операционных системах об этих шрифтах слыхом не слыхивали.
Оправданием мне служит лишь то, что в мире всего 2% пользователей линукса и неизмеримо малое количество пользователей прочих ОС. Чуть больший процент у Маков, но основным посетителем остается гвардия виндузятников, к которой принадлежу и я грешный.
Есть два пути для достижения одинаковости отображения текста (оба требуют дополнительного трафика, подгрузки шрифтов):
1. Загрузить в локальную папку на серваке файлы шрифтов и подгружать их на комп читателя с помощью правила CSS @font-face:
@font-face { font-family: Limpopo; src: url(/fonts/limpopopopopo.ttf); /* Лучше, конечно, давать полный путь с http://avo... */ }
Но есть проблема с браузерами — даже с 9-м Ослом и даже с почитаемой многими [древней] Оперой…
(Вообще это большая лужа, каждый браузер что-то — да трактует по своему, что-то — да не поддерживает, из-за этого могут случаться накладки, например, можно успешно создавать слайдеры (сменяемые попеременно фотки) без применения джава-скриптов, в чистом CSS3, но ишак и опера ни в какую не хотят это отображать. Тогда как Файрфокс и Хром — без проблем.)
2. Использовать веб-шрифты Гугла. Как всегда, кириллица находится на отшибе. 531 шрифт существует для латиницы и только 36 для кириллицы, из которых реально пользоваться можно лишь дюжиной.
Выбрав подходящий шрифт — Quick-use или Add to collection + кнопка Use внизу — получаем на выходе вот такую строчку:
<link href='http://fonts.googleapis.com/css?family=Oranienbaum&subset=latin,cyrillic-ext' rel='stylesheet' type='text/css'>
Которую нужно поместить до закрывающего тега </head>
в нужном файле .html (или header.php шкурки).
А в стилях CSS, где надо, указывать: font-family: 'Oranienbaum', serif;
Это позволит гуглосервису подгружать необходимый для отображения шрифт — для любого современного браузера, для любой платформы.
Ну, вот, я решил попробовать здесь знакомый мне ранее шрифт Ubuntu, созданный в рамках известного линукс-проекта. Шрифт этот хорош для обычного использования (текстовая работа оффлайн), он приятен по дизайну и отлично читабелен, но для блога… я пока не уверен…
Другая проблема в том, что подходящей замены для титульного =Trebuchet MS= я не вижу, а шрифт этот мне нравится. Но он не свободен ни капли…
А для цитат (чужого, выделяемого специально текста, см. предыдущий пост) я заменил Times new Roman шрифтом PT Serif Caption, созданным известной шрифтовой фирмой Паратайп — как один из шрифтов для общедоступного использования в вебе и не вебе. Я когда-то об этом упоминал, лень искать тот пост. Но ссылка на страницу проекта вот. [Паратайпа здесь больше нет].
Шрифт мне понравился. Рекомендую также и остальные шрифты семейства: PT Sans и PT Mono. Первый использовал в строке навигации (Нoме, About итд)+ сайдбар тоже.., второй в «коде», см. выше по посту.
Подкованный читатель заметит, что существуют еще «хранилища» шрифтов. Например, fontdeck.com и typekit.com. Но там за удовольствие надо платить. А с кириллическими шрифтами та же унылая беспросветность.
Жаль, что Гугл мало уделяет внимания кириллическому шрифтовому сегменту. Думаю, не было бы проблем, если бы выбор хороших свободных и чистых лицензионно шрифтов был бы шире…
Короче, снова я ставлю перед собой вопрос. И попробую его решить.
P.S. Потихоньку привыкаю к Ubuntu font…
P.P.S. Итого: Ubuntu применяется к заголовкам постов, тексту постов, титульному заголовку блога, ссылкам «древнее=свежее»;
PT Sans я решил использовать для заголовков постов. Неплохо.
PT Sans Caption — к заголовкам и ссылкам сайдбара, главной страничной навигации, навигации между постами, инфо-плашке после поста;
PT Serif Caption — к тексту в тегах <blockquote>
PT Mono в тегах <code>
Сдержанно удовлетворен :)
Но раздумья не прекращаются…
[Для порядку скажу, на 2017 год, на блоге задействован с гуглошрифтов как единый основной Ubuntu; для цитат используется Georgia или любой другой serif, а для кодов Consolas или любой другой monospace, который предложит система посетителя, они не подгружаются. Я решил, что это оптимум. … Но рука не поднялась эту мутную записку уничтожить, веха, как-никак.]
Несколько однотемных публикаций:
- 19.09.2012 Тема «Фикфышму»
- 17.09.2012 Ренессанс
- 17.04.2012 Тема "avocreative" для базового сайта
- 16.10.2011 Шкурка для велоблога
- 14.10.2011 Блогово-движковое
- 07.10.2011 Зимний блог обзавелся движком
- 24.06.2010 Как обновлять Wordpress