klondike

Корпоративный блог студии "Клондайк"

Клондайк интернет маркетинга - WEB, SEO, SMM


Previous Entry Share Next Entry
Лександр Кудрявцев
klondike

Внезапная проблема с google fonts в google chrome - кейс из практики Клондайк

Статья, описывает проблему из практики верстальщика студии Клондайк - Александра Кудрявцева при вёрстке страницы раздела "анимация и мультимедиа" на сайте студии.

Недавно обнаружил неожиданную проблему с некорректным отображением (вернее «не отображением» вовсе) нестандартных шрифтов при использовании технологии google fonts. Как это выглядит можно посмотреть на нижеприведенном скрине.

google_fonts_bug

Как видно – при том, что место под текст вроде как отведено верно сами шрифты не рендерятся.

Сначала было решил, что это какая-то моя персональная проблема, потому как это произошло внезапно и с ранее нормально отображавшимся сайтом. Порылся в настройках хрома, даже переустановил его. Не помогло. Потом проверил сайт на других компьютерах и встретился с той же проблемой. Нашел статью в интернетах, в которой говорится, что в 33й версии хрома ряд пользователей сталкиваются с подобной проблемой (web fonts may not be displayed until the user interacts with the browser window (scrolling or clicking), causing the browser to redraw the page).



Однако вместе с тем, обнаружил что ряд сайтов в интернетах с гуглфонтс продолжает отображаться корректно, что означало что, в моей верстке есть что-то что приводит к неверной работе шрифтов в последней версии Хрома. Методом исключения нашел что причина тому скрипт holder.js  – скрипт генерирует изображения нужных размеров (http://imsky.github.io/holder/), что бывает крайне удобно в момент создания верстки. Вероятно скрипт каким-то образом конфликтует с скриптами отвечающими за рендер нестандартных шрифтов, каким именно образом разбираться не стал. Думаю, кроме этого скрипта есть и другие, которые могут вызывать данный баг. На всех ранее сверстанных сайтах удалю скрипт из файла с подключаемыми плагинами, благо использую его не так давно. Ну и скрин сайта сразу после удаления скрипта.

google_fonts_fixed

?

Log in

No account? Create an account