どのくらいの方が使われているだろうか、ウェブフォントの話。
何種類か導入方法はあるのだが、ある1年ぐらい前に公開したサイトではGoogleのウェブフォントを利用していた。
Google Fonts
https://fonts.google.com/
現状では日本語も確認できるがそのサイトの制作当時日本語はここには無く、Beta版のような位置付けの『日本語早期アクセス』というサイトで公開されていた。
Google Fonts + 日本語 早期アクセス
https://googlefonts.github.io/japanese/
利用していたフォントは『M+ 1p』で、これを利用して1年ぐらい、フォントに関してはなんのトラブルもなく利用できていたのが、先月の中頃急に反映しなくなった。
最初は
『ん？なんかサイトに違和感がある・・・あ、フォントが違う』
と、いった感じ。
運用中になにかトラブルでも？とも思ったが担当者はそこまでいじることはないし、何だろうなと少し探ってみたが特におかしな事はない。
そういえばと、別で制作中のサイトで確認してみた。
そちらの方も全く同じ方法で全く同じフォントを利用する事にしていて問題なく反映できていたからだ。
だが、こちらも同様にフォントが反映されなくなっていた。
こうなると疑うのはこちらではなくGoogle側だ。
いくらGoogleといってもミスが皆無ということはないだろう。
そもそもBetaなので終了しましたという事も考えられる。
という事で、Google Fonts + 日本語 早期アクセスのページにアクセスしてみたが、問題なく稼働している。
しかも何も変更はなさそうだ。
フォントごとに表示される設定方法も変わりはなさそうだし・・・早速手詰まりだ。
一応読めないということではないので、超特急ではないがモヤモヤするし、現在制作中のページの方でも影響がある。
別件の合間にちょこちょこ対応していたが全く進展がなく、遂に別件のページの制作の方の影響が大きくなってしまって復旧に向けて対応する事になった。
再度表示される設定のスクリプトをコピペで対応してもやっぱりだめ・・・・と、ちょっとした事故が。
まぁ事故というほどのことではないのだが、Google Fonts + 日本語 早期アクセスの最下部にあるはずのGoogle Fontsのシグネチャが入っている帯がバグか何かで透過しているのに気づかず、Google Fontsのページに飛ばされた。
『おいおい・・・』と軽く溜息。
と、そこにも日本語が表示されているのに気づきびっくり。
『日本語フォントも正式採用になったのか・・・あれ？“M PLUS 1P”って“M+ 1p”だよね・・・両方載ってるって・・・まぁ動けばなんでも良いけど・・・じゃあ試しに・・・』
と、早期アクセスでは無い方のページで表示されるスクリプトを使用してみると・・・
『な、直った・・・え、でも早期アクセスのページでも同じように表示はしてるよね・・・ふ、深く考えないでおこう』
ということで、M+ 1p（もしくはM PLUS 1P）だけかもしれないが、同様の症状に悩まれている場合は正式採用されているかもしれないので、そちらから利用されると復旧する可能性が高いということになる。
早期アクセスの場合（こっちは反映しない）
読み込むスクリプト
<link href="https://fonts.googleapis.com/earlyaccess/mplus1p.css" rel="stylesheet" />
呼び出すスタイルシート
font-family: "Mplus 1p";
正式版（こっちで復旧した）
読み込むスクリプト（太さのオプションをカスタマイズする必要があるかも）
<link href="https://fonts.googleapis.com/css?family=M+PLUS+1p" rel="stylesheet">
呼び出すスタイルシート
font-family: 'M PLUS 1p', sans-serif;
早期アクセスのページでも問題なく表示されているので、ひょっとすると他に邪魔しているものがあるのかもしれないが、今回現象の発生したページ（サイト）の一方はWordPressだがもう一方はタグを手打ちで作っているページだ・・・正式版の方で上手くいっているのでこれで良い事とする。
コメント