Google Web Fonts でIE8以下でフォントがうまく読み込めない時に行った対策
Google Web Fontsってすっごく便利なんです
日本語はないのですが、このWEBフォントを使うだけで タイトルがロゴっぽくなるんです
なので重宝しているのですが
IEではうまく動かない時があります
linkではフォントが読み込めない現象
<link href=’http://fonts.googleapis.com/css?family=Lato:300′ rel=’stylesheet’ type=’text/css’>
こういった形でWEBフォントをheadで読み込むのですが
IE8以下ではなぜが読み込めません
対策方法として、一つ一つフォントを指定する方法が紹介されていますが
私のケースでは解決に至りませんでした
フォントの太さが指定出来ない現象
linkではなく@importを使ってCSSから読み込むことが出来ます
こちらの方ではIE8以下でも読み込むことが出来ましたがフォントの太さがnormalにしかならない現象
使うフォントの太さがnormal（400）ならいいのですが
normalではなく300や200といった時に使えない
最終的な対策
Google Web Fonts では無く AdobeのWEBフォントを利用する
Google Web Fonts にあるものは AdobeのWEBフォントにもあります、また逆にもAdobeのものはGoogleにもあります
なのでGoogleでは無くAdobeの方で利用すればOKです
Adobeにも無償のフォントがあり、Google Web Fonts のものはそこにあります
利用するには手間がいる
Adobeの方の無料のWEBフォントを利用するには、Adobe Edeg Web Fonts を利用します
これを利用するにはAdobeのCreative Cloudに登録して、ツールをダウンロードして利用するという流れになります
Bracketsというフリーのコードエディタの拡張機能でも利用できます
私はBracketsを使っているのでこちらを利用してます
手間はかかるのですが、Google Web Fonts ではうまく動かなかったものが正しく動作します
COMMENT