Шрифты на сайте являются одним из основных факторов, отвечающих за качество и степень восприятия представленной на сайте информации. Всем известно, что стандартная коллекция шрифтов довольно скудна и скучна, поэтому очень часто становится необходимым использование сторонних шрифтов. Также шрифты HTML помогают в создании собственного стиля компании.
Достаточно богатую коллекцию шрифтов имеет сервис Google Fonts. Также с помощью него довольно просто подключить шрифт к себе на сайт.
Существует 2 основных способа, как подключить шрифт к сайту:
- С помощью HTML:
Между тегами <head></head> необходимо вставить строку следующего содержания:
<link href='http://fonts.googleapis.com/css?family=Ubuntu' rel='stylesheet' type='text/css'>
Здесь в качестве значения атрибута href указывается ссылка на шрифт в Google Fonts.
- С помощью CSS:
В Css используется функция @import для того, чтобы осуществить подключение шрифта к сайту.
@import url(http://fonts.googleapis.com/css?family=Ubuntu);
Также сторонние шрифты можно подключить с помощью JavaScript, но ввиду малой актуальности данного метода мы его здесь приводить не будем.
После подключения нужного шрифта мы сможем его использовать следующим образом:
h1 { font-family: ‘Ubuntu’, Arial, serif; color: #fa8e47; font-weight: 400; }
Здесь шрифт Ubuntu применяется к тегу H1 (Название шрифта указывается в свойстве font family.) и цвет шрифта устанавливается с помощью тега color.
При использовании шрифтов от Google необходимо помнить, что отображение нужного шрифта может не поддерживаться в некоторых браузерах (кроме Google Chrome).
В конструкторе сайтов "Нубекс" имеется встроенная коллекция веб-шрифтов, которые можно выбирать непосредственно в настройках дизайна сайта.