明朝体とゴシック体の違いとは?特徴・印象・使い分けを初心者向けに解説

明朝体とゴシック体の基本

まずは、明朝体とゴシック体がそれぞれどんな形の書体なのかを押さえましょう。

形の違いが分かると、印象や使いどころの違いも理解しやすくなります。

明朝体とは

明朝体とは、横線が細く縦線が太い、線の太さに強弱のある書体です。

横線の終わりの部分には、「ウロコ」と呼ばれる小さな三角形の飾りがついています。

ひらがな・カタカナは、筆で書いたような流れのある形をしています。

日本の印刷物では標準的な書体で、新聞や書籍の本文などに広く使われています(明朝・ゴシックetc…書体の種類とウェイト(アドビ))。

※見本の書体は、お使いの端末に入っているフォントで表示されます

明朝体の「永」を見ると、横線が細く、横線の右端に小さな三角の出っ張り(ウロコ)があるのが分かります。

ゴシック体とは

ゴシック体とは、縦線と横線の太さがほぼ同じで、ウロコのような飾りがない(あってもごく小さい)書体です。

上のゴシック体の見本のように、線の太さが均一なので、すっきりとした力強い見た目になります。

ゴシック体の線の端や角を丸くした「丸ゴシック体」もあり、ゴシック体よりもやわらかく親しみやすい印象になります(丸ゴシック体を含む和文書体の分類は和文書体の基本とはで解説しています)。

明朝体とゴシック体の違いを一覧で比べる

2つの違いを表にまとめると、次のようになります。

比べるポイント	明朝体	ゴシック体
線の太さ	横線が細く、縦線が太い(強弱がある)	縦線も横線もほぼ同じ太さ
飾り	横線の終わりに「ウロコ」がある	飾りがない(あってもごく小さい)
与える印象	上品・知的・落ち着き・伝統的	親しみやすい・力強い・現代的
得意なこと	長い文章をじっくり読ませる	短い言葉をパッと見せる、遠くからでも目に入る
よく使われる場所	書籍・新聞の本文、フォーマルな案内状	見出し、看板、ポスター、アプリなどの画面の文字

ひと言でいえば、明朝体は「じっくり読ませる」のが得意で、ゴシック体は「パッと見せる」のが得意な書体です。

デザインの世界では、長い文章の読みやすさを「可読性」、ひと目での見つけやすさを「視認性」と呼び、明朝体は可読性、ゴシック体は視認性に強いとよく言われます。
可読性は「長い文章をスラスラ読み進められるか」、視認性は「パッと見た瞬間に目に入るか」と考えると区別しやすくなります(違いは視認性・可読性・判読性の違いで解説しています)。

明朝体とゴシック体の使い分け

形の違いが分かったところで、実際のデザインでどう使い分ければよいかを見ていきましょう。

「印象」「用途」「組み合わせ」の3つの視点で考えると選びやすくなります。

伝えたい印象で選ぶ

明朝体とゴシック体のどちらを選ぶかは、まず「どんな印象を伝えたいか」で決めるのが基本です。

同じ言葉でも、書体によって受け取られ方が大きく変わるためです。

下の見本では、同じキャッチコピーを2つの書体で並べています。

明朝体は、ゆったりとした上品なお店の雰囲気が伝わります。

ゴシック体は、同じ言葉でも親しみやすく、気軽に入れるお店のような印象になります。

高級感・伝統・知的さを伝えたいなら明朝体、親しみやすさ・分かりやすさ・元気さを伝えたいならゴシック体が目安です(書体ごとの印象は書体による印象の違いで解説しています)。

用途と表示サイズで選ぶ

印象とあわせて、「どこに、どのくらいの大きさで表示するか」も書体選びの大切な判断材料です。

明朝体は横線が細いため、文字が小さくなったり、画面の解像度が低かったりすると、細い線がかすれて読みにくくなることがあります。
画面の文字は小さな点(ピクセル)の集まりで表示されるため、横線が点1つ分より細くなると、薄くぼやけたり途切れたように見えたりするのです。

そのため、印刷物の本文では明朝体が定番である一方、Webサイトやアプリの本文、ボタンやメニューなどの小さな文字にはゴシック体がよく使われます。

Webで本文に明朝体を使いたい場合は、文字サイズを少し大きめにし、細すぎないウェイト(文字の太さ)を選ぶと読みやすさを保てます(ウェイトの選び方はフォントの「太さ(ウェイト)」で解説しています)。
デザインツールのフォント設定で、LightではなくRegularやMediumを選ぶ、「W3」「W6」のように数字で太さを表すフォントならW3以上を選ぶ、というのが目安です。

細い横線を太めにして画面で見やすくした「横太明朝」と呼ばれる明朝体もあり、画面表示向けの選択肢になります。

看板やポスターの見出しのように、離れた場所からパッと読ませたい文字には、視認性の高いゴシック体の太字が向いています。

見出しと本文の組み合わせ方

見出しと本文で書体を変える場合は、組み合わせ方によって全体の雰囲気が大きく変わります。

初心者が迷わずに使えるのは、次の3つの組み合わせです。

組み合わせ	見出し	本文	向いている雰囲気
ゴシック体でそろえる	ゴシック体(太め)	ゴシック体(標準)	分かりやすい・現代的(Webサービス、ビジネス資料など)
明朝体でそろえる	明朝体(太め)	明朝体(標準)	上品・落ち着き(読み物、旅館、和菓子店など)
見出しだけ明朝体	明朝体	ゴシック体	上品さを出しつつ、本文は画面でも読みやすく

ゴシック体でそろえると分かりやすく現代的に、明朝体でそろえると上品で落ち着いた雰囲気に、見出しだけ明朝体にすると上品さと読みやすさを両立した雰囲気になります。
Webサイトでは本文を読みやすいゴシック体にすることが多いものの、それだけではカジュアルに寄りすぎることもあります。
そんなときに見出しだけ明朝体にすると、本文の読みやすさを保ったまま、上品さを加えられます。

迷ったときは、まず1種類の書体でそろえ、見出しと本文の差はウェイトと文字サイズでつけると失敗しにくくなります(文字サイズの差のつけ方はジャンプ率の記事で解説しています)。

実践のポイント

明朝体とゴシック体を使い分けるときに陥りやすい失敗と、よくある疑問をまとめます。

注意点・よくある間違い

• 「なんとなくおしゃれだから」という理由だけで、細い明朝体をWebの小さな本文に使ってしまうことがあります。
  スマートフォンの画面では細い横線がかすれて、読みにくくなることがあります。
  明朝体を本文に使うなら、文字サイズとウェイトに余裕を持たせましょう。
• 見出しと本文で明朝体とゴシック体を組み合わせたものの、雰囲気が合わずにちぐはぐな印象になることがあります。
  組み合わせに自信がないうちは、どちらか1つの書体でそろえるのがおすすめです。
• 1ページの中で、明朝体・ゴシック体・丸ゴシック体などを何種類も混ぜてしまい、まとまりがなくなることがあります。
  使う書体は2種類までに絞ると、統一感を保ちやすくなります。

よくある質問

• Q. Webサイトの本文は、明朝体とゴシック体のどちらがいい?
  A. 迷ったらゴシック体を選ぶのが無難です。
  線の太さが均一で、スマートフォンなどの小さな画面でもかすれにくいためです。
  上品さや読み物らしさを出したいサイトなら明朝体も選択肢になりますが、その場合は文字サイズを少し大きめにしましょう(フォント選びの考え方は見やすいフォントの選び方で解説しています)。
• Q. 明朝体とゴシック体は、英語の書体でいうと何にあたる?
  A. 線の端に飾りがあり、線の太さに強弱がある「セリフ体」が明朝体に、飾りがなく線の太さが均一な「サンセリフ体」がゴシック体に近い関係です。
  CSSの仕様をまとめたMDNでも、明朝体はserif(セリフ体)、ゴシック体はsans-serif(サンセリフ体)の例として挙げられています(MDN「font-family」)。
  「セリフ(serif)」は文字の線の端につく小さな飾りのことで、「サン(sans)」はフランス語で「〜がない」という意味です。
  つまりサンセリフは、「飾りのない書体」という意味になります。
• Q. 丸ゴシック体は本文に使ってもいい?
  A. やわらかい雰囲気を出したいサイトなら使えます。
  ただし、丸ゴシック体は印象が強めなので、子ども向けや親しみやすさを重視したサイトなど、雰囲気が合う場合に選ぶとよいでしょう。

まとめ

明朝体は横線が細く縦線が太い「ウロコ」のある書体で、上品で落ち着いた印象を与え、長い文章をじっくり読ませるのが得意です。

ゴシック体は線の太さが均一で飾りのない書体で、親しみやすく力強い印象を与え、画面上の文字や見出しなどパッと見せたい場面で力を発揮します。

まずは、普段よく見るWebサイトや本の表紙が明朝体とゴシック体のどちらを使っているかを確かめ、「なぜその書体を選んだのか」を考えてみてください。