見出し画像

頻出フォントの微妙な違いを比べてみようの会【後編】

 こんにちは ! 
 Webデザイナー目指して勉強中のかいもちです。🐣
 連日連夜、オリンピック中継に夢中です><💭

 今日は昨日に引き続き、サイトデザイン分析を通して興味をもった「フォント」について。

 多くのサイトで使われていたフォントが「なんで人気なのか(Why)」「似てるフォントと比べてどう違うのか(Which)」「どういう時に使ったらいいのか(When)」、3つの切り口から見ていこうと思います ! 

※ 使用しているMacに入っているものと、Googleフォントから引っ張ってきたものでスクショの形が違うので、見にくいところはすみません><

※ 全て16px指定、ウェイトが複数あるものはレギュラーorミディアムを選択しています。


日本語フォント 明朝体編

画像1


 31日間のサイト分析で、最も多く使われていたのは游明朝体でした。
と言っても、ゴシック体のように、圧倒的な数ではありません (そもそも明朝体を使っているサイトがそんなに多くはなかったです)。

< Why - なんで人気なのか >
 硬くなりすぎないから、だと思います。
 特に游明朝。明朝体らしい、落ち着いた、優雅な印象を与えつつも、堅苦しくはない。絶妙なバランス。

< Which - 似ているフォント同士の比較 >
 游明朝は↑の通りですが、「ちょっと物足りないな」「タイトルに使いたいからもうちょっとクセのあるやつがいいな」という時、さわらび明朝が候補になり得るのでは、と思います。さわらび明朝は、游明朝と比べてインク溜まりが多く、よりかっちりとした印象を与えます。
 Noto Serifは、そこまで游明朝との違いを感じませんが、字と字の間隔が狭いのが特徴です。

<When - いつ使う ? >
↑ もう書いてしまった・・・笑


欧文フォント編

画像2


 Montserratが一番多く使われていました
(日本語のサイトを分析していたので、欧文フォントはタイトルやヘッダーナビなど、ポイント的に使われていたものの比較になります。)

< Why - なんで人気なのか >
 シンプルで使いやすいからだと思います。
 この中で特に人気だったのは "Helvetica" と "Montserrat" です。どちらもこれといって大きな特徴はなく、サイトの印象を操作しません。
 更に言えば、均整が取れている(文字によっての差が少ない)ことも人気の理由かもしれません。

< Which - 似ているフォント同士の比較 >
 "Helvetica" と "Montserrat" は、かなり似てます。Helveticaは、Macには元々インストールされていますが、Winには入っていないようです。
 更に、Montserratのほうが若干、丸みが少なくスッキリとした印象です(CやJを比べてみるとよくわかります)。

<When - いつ使う ? >
 "Lato" は、上から押しつぶされたような、ぽてっとした自体。 "Roboto slab" は、始筆と終筆にちょっと飾りがついています。
どちらも、少しだけ強調したい、印象づけたいような箇所に使うと効果的だと思いました。


 フォントの世界は奥が深い ! 
 今回は前後編合わせてたった13種類を比べてみましたが、氷山の一角にすぎません。
 これからもっといろんなフォントに触れて、比べて、理解を深め、より効果的なフォントを選べるようになっていきたいです。

読んでくださって、ありがとうございました♪

この記事が気に入ったらサポートをしてみませんか?