Как использовать Modernizr, чтобы определить, поддерживает ли клиент WebFonts?

Как обнаружить поддержку Webfont с помощью Modernizr и вместо этого нажать Cufon, если это не так? По сути, я использую 90% пакетов Google Web Font, остальные 10% - это пакеты от FontSquirrel.

Я хочу полагаться на веб-шрифты, если они поддерживаются, потому что эти слова индексируются и оптимизированы для SEO, но если они не поддерживаются, я все равно хочу отображать правильный шрифт, который отлично справляется с Cufon.


webfonts modernizr
person mare    schedule 05.03.2012    source источник

Ответы (2)


arrow_upward
1
arrow_downward

Практически в каждом браузере есть поддержка @ font-face: http://caniuse.com/#search=font
Таким образом, вам действительно не нужен запасной вариант cufon.

Тем не менее .. это:

if (!Modernizr.fontface) Cufon.now();

Но на самом деле вам вообще не нужно использовать Cufon.

person Paul Irish    schedule 06.03.2012
comment
Насколько я могу судить, на нескольких разных ПК, работающих под управлением IE7, пакеты FontSquirrel не поддерживаются, а шрифты не отображаются (используются резервные варианты Sans serif по умолчанию). Мои пакеты включают все возможные форматы веб-шрифтов (EOT, TTF, WOFF и SVG). - person mare; 07.03.2012
comment
Привет, Пол, я не понимаю, почему это не работает как в IE7, так и в IE8. Есть ли у вас дополнительные предложения помимо того, что я уже сделал (повторно загрузил и повторно загрузил пакеты шрифтов от поставщика на сервер, обновил web.config с разделом из H5BP, который сбрасывает типы MIME, а также пробовал другой шрифт)? - person mare; 07.03.2012

arrow_upward
1
arrow_downward

Пол был прав, говоря, что даже IE7 и IE8 поддерживают веб-шрифты (они поддерживают веб-шрифты .EOT), и это общепринятый факт, что они поддерживают его, я просто не знал, почему у меня это не работает.

Оказывается, проблема с отрисовкой пути внутри файлов CSS. Я использовал плагин SquishIt ASP.NET MVC для минимизации и объединения файлов CSS.

Когда я включаю файл stylesheet.css из пакета FontSquirrel в пакет SquishIt, поддержка шрифтов .eot не будет работать в браузерах IE7 и IE8. После тщательного тестирования этой ошибки я обнаружил, что оба упомянутых браузера будут поддерживать веб-шрифты .eot, если файл был включен отдельно (не в пакет SquishIt), но не смогут отображать правильный шрифт сразу после включения CSS в пакет.

По-видимому, SquishIt переписывает пути к файлам, переписывая (или кодируя) строку «? Iefix», что приводит к тому, что старые IE не могут распознать правильный файл .eot и не могут правильно отобразить шрифт.

person mare    schedule 09.03.2012