Свои шрифты на сайте

Веб-мастера иногда сталкиваются с тем, что в некоторых случаях на сайте требуется применить нестандартный шрифт, который соответствовал бы тематике и общему стилю сайта. Но не у всех пользователей в операционной системе установлен нестандартный шрифт, особенно если он был разработан специально для использования на конкретном сайте. Здесь нам на помощь придет CSS, который позволяет не только менять курсоры на свои, но также подгружать нужные шрифты и использовать их на веб-страницах сайта.
Для того чтобы подгрузить шрифт в браузер нужно прописать в файле стилей либо между тэгами <style>...</style> html-страницы следующий CSS-код:

@font-face {
 font-family:"MoyShrift";
 src:url(/style/MoyShrift.ttf) format("truetype");
}

В коде выше мы указали что шрифт будет называться MoyShrift, тип шрифта Truetype и загружаться браузером он будет из папки /style/ вашего сервера, в которой находится файл шрифта MoyShrift.ttf. Браузер автоматически подгрузит шрифт, но не будет его устанавливать в операционную систему пользователя, а просто сохранит его в кэше как обычное изображение и будет использовать только на страницах для которых он был подгружен. Далее можно использовать наш шрифт как обычно указав его название. Например:

body {
 font-family:MoyShrift;
}

Конечно ничто не мешает вам подгружать даже несколько разных шрифтов в страницы сайта, но стоит помнить о размере файлов со шрифтами, ведь их загрузка также требует времени. Поэтому я бы посоветовал использовать нестандартные шрифты только тогда, когда это действительно нужно.

Автор статьи: Сергей Каминский