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

Последнее время разработчики сайтов очень часто сталкиваются с ситуацией, когда необходимо применить какой - либо нестандартный шрифт, который идеально бы подошел к общему дизайну сайта. Но к сожалению не у всех пользователей сайта на компьютере установлены так называемы нестандартные шрифты, особенно если он разрабатывался специально для конкретного сайта. Из данной ситуации есть два выхода:

Применить свой собственный с помощью CSS стилей, которые можно прописать как на веб-странице между тегами <style>...</style>, так и в прикрепленном файле Style.css. Код будет следующим:


@font-face
{
	font-family: "MyShrift";
	src: url(../fonts/MyShrift.otf);
    src: local(MyShrift), url(../fonts/MyShrift.otf);
}

Форматы шрифтов могут быть разными (otf, ttf и другие), лучше указывать несколько вариантов в одной гарнитуре для уверенности в работоспособности на любых устройствах


Второй способ, найти необходимую гарнитуру шрифта на Google Fonts и применить ее на своей странице:


<link href='https://fonts.googleapis.com/css?family=Roboto' rel='stylesheet' type='text/css'>

Для использования шрифта из таблицы стилей прописываем:


font-family: 'Roboto', sans-serif;

Второй шрифт в конструкции необходим на случай неработоспособности сервиса Google Fonts, что бывает редко, просто для перестаховки.

На этом о шрифтах все, не забываем оценивать статью и советовать своим друзьям.

Поделитесь статьей со своими друзьями