0

При верстке я "объявляю" в css-файле все виды и размеры используемого шрифта. К примеру, шрифт Raleway содержит 90 файлов .woff2. Однако на страницах я обычно использую из этого множества 3-4 шрифта максимум.

Вопрос

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

6
  • Сколько ссылок вы пропишете в @font-face, столько и подгрузится вариантов начертаний. Если пропишете все 90, браузер будет грузить их все. От дальнейшего использования в стилях это не зависит. Commented 15 сент. 2022 в 9:34
  • Спасибо! Придется тогда шрифты выбирать по отдельности.
    – Majestio
    Commented 15 сент. 2022 в 10:27
  • На самом деле часто бывает достаточно подключить вообще один вариант типа normal, а жирность регулировать с помощью font-weight - от 100 до 900. Commented 15 сент. 2022 в 10:43
  • Тот шрифт, о котором я писал в вопросе, на каждую "жирность" имеет свой файл. Наверное неспроста.
    – Majestio
    Commented 15 сент. 2022 в 11:56
  • Я уже сообразил как поступить - загоню в SASS, предварительно все закомментирую, и буду снимать комментарии по мере необходимости использования.
    – Majestio
    Commented 15 сент. 2022 в 11:58

1 ответ 1

1

Сначала браузер загружает верстку (html), Потом шрифты и скрипты, прописанные в теге по порядку. Поэтому необходимо подключить css файл со шрифтами раньше остальных стилей.

Если вы используете @font-face, создайте отдельный файл resources.css, пропишите эти @font-face там и вставьте его в верстке выше остальных ваших css файлов.

НО! Почти все шрифты (кроме шрифтов Adobe) есть в интернете и их можно подключить при помощи @import. Например, библиотек шрифтов google fonts при выборе семейства шрифтов и их видов генерирует автоматически @import для вставки. И не нужно прописывать woff, woff2, eot, ttf и другие. Все сделает за вас и сделает проект "легче".

2
  • Спасибо. Но это если сайт расположен в интернете, или в сети с выходом в интернет.
    – Majestio
    Commented 15 сент. 2022 в 12:54
  • Да, верно. Если компьютер имеет выход в интернет, то импорт сработает. Без него ничего не призойдет, так как запрос просто не уйдет
    – Redither
    Commented 15 сент. 2022 в 12:58

Ваш ответ

Нажимая «Отправить ответ», вы соглашаетесь с условиями пользования и подтверждаете, что прочитали политику конфиденциальности.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.