Web制作 フォント

Google Fontsの効率的なフォントの探し方

Google Fontsって種類が多すぎて探すのが大変・・・

今回はそんな声にお答えします。

Google Fontsは無料で使えるフォントが989種類もあるのが魅力的ですが、その分探すのが大変です(2020年5月現在989種類)

今回は少しでも効率的に探せるような方法を解説したいと思います。

Google Fontsの効率的なフォントの探し方

まずは以下のページにアクセスします。

Google Fonts

基本的は使い方については以下の記事を参照下さい。

Google Fontsの使い方

するとこのような画面が表示されます。

 

主にこの赤枠で囲った所を使って探していきます。

ちなみに青枠のところは「Return to classic site」と書いてあり、昔の画面表示で探すことが出来ます。

「Google Fonts 使い方」などで検索すると、まだこちらの画面で解説されている方が多いかと思います。

 

 

 

検索フォームで探す

これは探したいフォント名が分かっている場合に限りますが、一番早く探し出せる方法です。

これは特に解説するまでもないですが、左上のSearch(虫眼鏡)から検索するだけです。

 

カテゴリーから探す

次は検索フォームの下にあるカテゴリーから探す方法です。

 

 

Serif明朝体:203種類
Sans Serifゴシック体:303種類
Displayディスプレイ用(装飾文字):316種類
Handwriting手書き風:146種類
Monospace等幅(文字の幅が均等):21種類

※種類は2020年5月現在

カテゴリーを1つずつ見て、自分が探したいフォントの雰囲気で選んでみるといいと思います。

ざっくり言うとDisplayとHandwritingは個性的なフォントが多いです(上2つも結構個性的なフォントはありますが)

 

フォントの特長から探す

次はフォントの特長から探してみます。

 

 

これも説明がないとちょっと分かりにくいですね。

Number of stylesスタイルの数:右に行くほど種類が多いものに絞られる
Thickness太さ:右に行くほど太くなる
Slant傾き:右に行くほど傾きが強くなる
Widthフォント幅:右に行くほど幅が広くなる

 

Number of styles(スタイルの数)については前回のブログ(Google Fontsの使い方)でも少し触れましたが、フォントによっては太さが数種類あり、斜体も含めると10種類以上あるフォントもあります。

スタイルの数は一覧の右上に書いてあります。

 

また、Number of styles(スタイルの数)だけは右に行くほど種類が多いものだけ絞られる感じですが、他の項目は違います。

例えば Thickness(太さ)だと一番左だと一番細いフォントだけ、中間だと中くらいの太さだけ、一番右だと一番太いフォントだけとなります。

つまりスライダーの位置にあるものだけ表示される感じです。

 

並び順を変えてみる

最後は並び順を変えてみます。

表示される並び順を変えるだけなので探すとはちょっと違いますね。

 

 

Trendingトレンド(流行)順
Most popular人気順
Newest新着順
Nameアルファベット順

 

トレンド順と人気順は少し似ているような気もします(どちらもこの時の1番目はRobotoでした)

 

サンプル文字の表示を変える

これは探し方とはちょっと違いますが、サンプルとして表示されている文字を変えることが出来ます。

ちなみにこの画像のサンプル文字はSentence(見出し)で表示されています。

 

Sentence見出し(短文)
Alphabetアルファベット(全ての大文字と小文字)
Paragraph長文
Numerals数字(0から9まで)

 

そしてCustomを選択してType somethingにテキストを入力するとそれが表示されます。

 

表示を確認したい文章などがあったらここで確認してみてもいいでしょう。

あとはその横でフォントサイズを変える事も出来ます。

 

以上です。

種類が多すぎて探すのが大変ですが、これで少しは自分のイメージに合ったものが探しやすくなるかと思います。

-Web制作, フォント