Подключение системных шрифтов к сайту

Как правильно подключить системные шрифты на сайте. Два готовых решения для подключения системных шрифтов.

Подключение системных шрифтов к сайту

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

  Самым оптимальным вариантом является метод подключения встроенных в ОС-систему шрифтов для каждой из платформ. Такие шрифты называют системными шрифтами. То есть используем те шрифты, которые уже встроены в виндовс, андроид, мак и др. системы.

Чтобы учесть все платформы и подключить их системные шрифты, для этого в CSS (как правило для тега body) прописываем:

font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;

 

  Далеко ходить не будем и посмотрим как подключены шрифты у соцсети ВКонтакте - они ведь тоже используют системные шрифты. И увидим что у них:

font-family: -apple-system,BlinkMacSystemFont,Roboto,Helvetica Neue,sans-serif;

Мне именно вариант ВКашников понравился и именно его я часто использую.

 

Видео о шрифтах на сайте

 

Записи по теме
Иконочный шрифт в Joomla 3
иконки Иконочный шрифт Icomoon, который используется в Joomla 3. Таблица иконок с названиями их классов и примеры использования иконок в HTML.

 

 

Комментарии 0

*** чтобы писать комментарии.