n-wp.ru — блог о WordPress
Использование нестандартных шрифтов для оформления текста блога | n-wp.ru

Использование нестандартных шрифтов для оформления текста блога

Один из способов внедрения любых нестандартных шрифтов для оформления текста блога.

Если вы пробовали уже разобраться, что же там написано в файле style.css, то наверняка обратили внимание на то, что шрифты чаще всего указываются не по-отдельности, а целыми семьями — font-family. В веб-дизайне все стандартные шрифты условно поделены на несколько семей. Это дает возможность браузеру самостоятельно определять, какой шрифт использовать для отображения текста, исходя из того, к какому семейству он относится. Для чего то сделано?

Использование нестандартных шрифтов для оформления текста блога

Все элементарно: в каждой операционной системе имеется свой набор установленных шрифтов, и эти шрифты могут не совпадать. Например, в Windows есть шрифты, которых нет в Linux, и наоборот. Если указать какой-то конкретный шрифт, используемый в Windows, например, Segoe UI Light, то еще не факт, что этот шрифт есть в Ubuntu. Поэтому может получиться так, что браузер не сможет определить, каким шрифтом отображать текст, и выведет вместо него какие-нибудь квадратики. Чтобы такого не получилось, все шрифты условно разделили на несколько семейств:

  • serif
  • sans-serif
  • cursive
  • fantasy
  • monospace

Например, к семейству шрифтов sans-serif относятся:

  • Garamond
  • Georgia
  • New York
  • Times
  • Times New Roman

Один из этих шрифтов встречается во всех операционных системах, поэтому использование семейства шрифтов sans-serif гарантирует, что текст во всех операционных системах будет отображен более-менее правильно и будет иметь похожий вид (классический шрифт без засечек).

Однако сейчас, в эпоху разнообразия и нестандартных подходов, все больше веб-мастеров применяют не классические варианты шрифтов. Есть несколько способов, обеспечивающих совместимость шрифтов в разных операционных системах. Одним из них является jQuery-скрипт Cufon, другим — использование Google Web Fonts. Но, благодаря все более широкому применению разметки HTML5, есть и третий способ — внедрение вообще любых пользовательских шрифтов.

Предположим, вам очень нравится шрифт somefont (название вымышленное). С помощью специальной разметки вы можете внедрить его в блог, причем он будет отображаться в любом браузере и любой операционной системе.

01 Для этого закачайте его в блог в доступную папку, например, fonts.

02 Внедрите в файл style.css этот шрифт:

03 После этого можете использовать шрифт somefont для выделения определенного текста. Например, для заголовков H1:

tiaurus

Являюсь создателем n-wp.ru — блога о WordPress для новичков. Мне интересно многое, поэтому еще я сделал 123-box.ru — блог о программах для Windows, и tiaurus.info — блог о красоте.

Комментировать

/* ]]> */