hummingbird
@hummingbird

Почему шрифт отображается с задержкой?

В head подключаю файл со стилями. В нем в самом начале прописано:
import url("//fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,700italic,400,300,700");

Дело именно в этой строке, ибо без нее все нормально.

Теперь о проблеме. При загрузке страницы все тексты, шрифт которых Open Sans отображаются не сразу. Выглядит это примерно так:
f00222614a5b45ea8fb8e9445f9fbc65.png

Как только страница загружается до конца, тексты появляются. Загрузка эта может достигать почти 2 секунды, а на странице то даже картинок нет. JavaScript тут не причем - отключал, проверял.

Не могу понять в чем проблема. Рассчитываю на вашу помощь.
  • Вопрос задан
  • 3382 просмотра
Пригласить эксперта
Ответы на вопрос 3
@OneFive
React.js <3
Шрифт не успевает загрузится.
Ответ написан
BOOMER_74
@BOOMER_74
Full-Stack разработчик
Используйте тэг
<link rel="stylesheet" type="text/css" href="...">
Ответ написан
@link_irk
Загрузка шрифта с удалённого сервера - отдельный http запрос, который этот сервер обрабатывает. А браузер в это время ждёт от него ответа. Если вы посмотрите в отладчике, то увидите этот запрос (а скорее всего их там будет даже несколько с различными начертаниями и форматами шрифта). Я конечно не уверен, но смею предположить, что загрузка шрифтов с вашего сервера (а грузятся шрифты именно в браузере у клиента) не ускорит этот процесс, если конечно маршрут до вашего сервера не окажется быстрее. Выход - заставить всех пользователей установить этот шрифт локально у себя на компьютерах :) Или же искать сервисы со шрифтами, время загрузки которых будет минимально (причём не только у вас, но и у всех клиентов). Но, сомневаюсь, что вы найдёте что-то лучше, чем Google. Ещё попробуйте указать альтернативный шрифт в CSS (font-family: 'Open Sans', Arial). Вероятно, в момент подгрузки шрифта текст будет выводиться корректно, но другим шрифтом
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы