Webデザイン定番の日本語フォントまずは3つ覚えよう

普段Webデザインで使うことが多い定番の日本語フォント3つだけ紹介します。

まずはこの3つを覚えます

ここでいう定番フォントは、Webデザインでは特に「本文テキスト」や本文途中の「見出し」によく使われます。

テキストに使うフォントは、読みやすく、普遍的で、かつ美しい文字であることが大切です。

目次

ヒラギノ角ゴシック・ヒラギノ明朝

ヒラギノ角ゴシック
ヒラギノ明朝

【ヒラギノフォント】は、日本のデザイナーであれば誰でもが一度は触れたことのある王道のフォントです。

2000年にAppleのiOSの標準搭載フォントとして選ばれたので、MacやiPhone等のApple製品を使っている人にはお馴染み。スティーブ・ジョブスにも美しさを褒められました。

ヒラギノフォントはデザイナーでは定番中の定番フォントとして、いろいろな場所で使われています。

オーソドックスで普遍的、でもいつまでも現代的なフォントです。

Noto Sans JP / Noto Serif JP

note sans jp
note serif jp

プロアマ問わず人気の高い【Noto Sans JP】は、googleが作った無料のWebフォントです。

Webサイトのデザイン・コーディング現場ではすっかり定番となりました。

このサイトのテキストも【Noto Sans JP】です。

親やすいゴシック体で、安定感があります。なにより無料。使いやすい。

「Noto Serif JP」は明朝体バージョンです。

游ゴシック・游明朝

游ゴシック
游明朝体

【游ゴシック】【游明朝】は、パソコン端末に初期搭載されているフォントです(=システムフォント・デバイスフォントといいます)

昔はWindowsとMacでは表示フォントが違っていたのですが、【游ゴシック・游明朝】はwin・Macどちらにも搭載されたフォントです。なので、Webフォントが登場する前は、デザイン統一のためこの游ゴシックのフォントをcssで指定していました。

すっきりとした読みやすいフォントですので、Webフォントが主流になった今でも人気です。一周回ってここに戻ってきちゃう。

Webフォントと違い、デバイスフォントは重さを気にする必要がないのも魅力ですね。

Webフォントとデバイスフォントの違いについては、こちらの記事も読んでみてください。

 

 

定番のゴシック体はユーザーも見慣れています。馴染みのあるフォント=読みやすさ、です。

字体の美しさや全体の雰囲気も大切ですが、文章はユーザーに読まれることが何より大事です。

特にWebサイトでは、読みにくい文章はすぐブラウザバックされてしまいます。

Webデザインを始めたばかりであれば、googleの無料Webフォントの【Noto Sans JP】か、PCに最初から入っている【游ゴシック】がおすすめです。

定番フォントをうまく使って、素敵なWebサイトを作ってくださいね。

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!
目次