Inter-Net.PRO

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

  • 264 65
19 апр 2018 12:09 - 19 апр 2018 12:09 #1 от Inter-Net PRO
Не секрет, что подключение к сайту сторонних шрифтов, это загрузка дополнительных мегабайтов. Это создаёт проблемы в борьбе за оптимизацию и скорость сайта, вынуждая посетителя загружать те самые мегабайты которые занимает шрифт.

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

Чтобы учесть все платформы и подключить их системные шрифты, для этого в 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;
Мне именно вариант ВКашников понравился и я не редко его использую.


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

Авторизация

Войти через соцсети: