Noto Sans JP が表示されなくてハマった時

WEBフォント流行ってますね。
もはやとりあえず「Noto Sans JP」にしておけばもう間違い無い!このちょっと太めの可愛いらしいフォルムにクライアントもOKだ!とりあえず「Noto Sans JP」とりあえず「生チュー」みたいな勢いがあります。

えぇ、私も恥じらいも無く使わせて頂いてます!読み込み速度がどうの言われてますが、とりあえず「Noto Sans JP」です。はい。

ローカルでテストして、さて本番のサーバーにアップロードした時の話ですが
htmlをサーバーにアップして、ブラウザで見たら「あれ??」あの素敵な「Noto Sans JP」が表示されて無いじゃないですか!なんで!

検証で見てみるが、ちゃんと「Noto Sans JP」を読み込んでいるはずなのに、表示されていない。。
ローカルなら表示されているのに・・何故。。。

って事でグーグル先生にお尋ねしましたら・・・解決しました。

アップロード先が「常時SLL」いわゆる「https」だった為でした。
「https」サイト内のリンク先は基本全て「https」でないとダメなのです
ですので、WEBフォントのリンク先も「https」である必要があります。

ヘッダーへのリンクはコレ

<link rel="stylesheet" href="https://fonts.googleapis.com/earlyaccess/notosansjapanese.css">

CSSからのリンクはコレ

@import url(https://fonts.googleapis.com/earlyaccess/notosansjapanese.css);

うっかり「http」のままでした!なるほどね!

コメントを残す

メールアドレスが公開されることはありません。