Google Noto フォント (Noto Sans, Noto Serif) をWindowsにインストールする

Notoフォントってよく使いますよね。XDとかFigmaとかオンラインツール使うとフォントを合わせて作業なんてことよくありますよね。ベーシックで使いやすいNotoフォント入れておこうかなとメモしてます。

Google Fontsの中でも特に利用頻度の高い日本語フォントで、GoogleがAdobeと協力して作るフォントセット（ファミリー）です。「世界中の言語を1つのフォントセットで表現する」という試みで、フォントセットにない文字を使うと表示される豆腐文字を撲滅するために作られたそうです。Googleが言わくno more tofuとのこと。略してNotoというわけです。

手順１：Notoダウンロードページに行く

Google Noto Fonts のウェブサイトにアクセスします。下図のようなページが表示されます。（https://www.google.com/get/noto）

すべての言語を入れると1GBくらいあるので、必要なフォントだけ、今回は日本語の「Noto Sans CJK JP」と「Noto Serif CJK JP」だけ入れてみます。

手順２：日本語のNotoだけ探してダウンロードする

検索窓にJPと入れると、２つだけ出てくるのが分かります。今回この２つだけダウンロードします。

「Noto Sans CJK JP」の方をクリックすると、ダウンロードするカードが表示されるので「DOWNLOAD」します。1フォントだけで、121MB以上あります。

手順３：ダウンロードした2つを展開（解凍）します

解凍すると、以下のようになっているはずです。

手順４：Windowsにインストールする

インストールは簡単です。該当のフォントファイルを選択して、Windowsの設定にあるフォントにドロップするだけでインストールができます。

上記の通り設定から「フォントの追加」にある「ドラッグアンドドロップしてインストールします」へファイルをまとめて放り投げるだけでインストール完了です。とはいえデータがでかいので、インストールしてますのプログレスバーが表示されるので待ちましょう。

手順５：実際にアプリで使ってみましょう

実際にインストールされたら、フォントを使うアプリケーションでフォントが実際に表示されるか確認してみます。デザイナーであれば、IllustratorやPhotoshopだったりしますが、認識されない場合は一度再起動してみます。今回手軽に Microsoft Word で確認してみます。

Microsoft Word を立ち上げて文字を入れて、フォントを指定しますが、ここでMSフォントの次あたりに追加されていることが分かります。Webフォントではありますが、これでローカルでも利用できるようになりました。

ライセンスについて

Note Fontsのライセンスは、Apache License, Version 2.0もしくはSIL Open Font License, Version 1.1です。簡単にまとめると「商用利用、修正、配布、特許の利用許可、派生物に別のライセンスを課すこと」となります。

Notoフォントの使い方

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

上記の通り、メタにstylesheetを直指定で入れるだけです。http://fonts.googleapis.com/earlyaccess/notosansjp.css

WebフォントをWebで使う場合の注意点

Webサイトで利用する場合、コンテンツはもちろんオンラインではないと見えないのは当たり前なのですが、フォントデータが大きくて若干フォントの適用に遅延を感じるかもしれません。また念のためフォントの指定は、代替フォントを2番目以降にも複数設定しておきましょう。

・・・