セリフ体 vs サンセリフ体:それぞれを使うべき場面(と、どちらでもいい場面)

「セリフ体は印刷向け、サンセリフ体は画面向け」。この一文は、ネット上のあらゆる初心者向けタイポグラフィ記事に登場しますが、少なくとも15年は間違っています。現代のディスプレイは極細の線も問題なく描画します。Medium、The Atlantic、The New York Times、Stripe Press の本文はセリフ体で組まれていて、スマホでも美しく読めます。この神話が生き残っているのは、教えやすいからであって、正しいからではありません。

本当のところはもっとややこしいです。セリフ体とサンセリフ体は別の仕事をしていて、その違いはトーン、ブランド、文脈に現れます。2026年の画面での純粋な読みやすさには現れません。この記事では、選択が本当にデザインを変える場面と、デザイナーがコイントスについて議論しているだけの場面を仕分けします。

二つを本当に分けるもの

セリフとは、文字の主要なストロークの端にある小さな仕上げの線のことです。サンセリフにはそれがありません。 構造上の違いはこれがすべてです。温かみ、権威、モダンさといったそれ以外は、400年かけてあの小さな足の上に積み上がった文化的な荷物にすぎません。

セリフ体のファミリーは、役に立つサブグループに分かれます。Garamond や Sabon のようなオールドスタイルは、羽ペンの筆記から受け継いだ柔らかく書道的なストロークを持ちます。Baskerville や Georgia のようなトランジショナルは、書道と幾何学の中間にあります。Bodoni や Playfair のようなモダン、つまりディドンは、高いコントラストとカミソリのように細いヘアラインに振り切っています。Rockwell や Roboto Slab のようなスラブセリフは、太くブロック状の足を持ち、トーンとしてはサンセリフに近く読めます。

サンセリフ体も同じように分かれます。ジオメトリックサンセリフ(Futura、Avenir、Circular)は、円と明快な角度で作られています。ヒューマニストサンセリフ(Gill Sans、Source Sans、Inter)は、ローマ碑文の比率を借りていて、より温かく読めます。グロテスクとネオグロテスクのサンセリフ(Helvetica、Söhne、再び Inter、IBM Plex Sans)はその中間にあり、だからこそUIの仕事を席巻しています。

基本的な構造と、あの小さなストロークが階層とどう作用するかについては、タイポグラフィシステム設計の解説が分かりやすくまとめています。

可読性の神話を一段落で

本文サイズでセリフ体のほうが読みやすいと証明する、誠実な研究はありません。「セリフが視線を導く」という元の主張は印刷時代の研究から来ていて、その多くは1つのセリフ体と1つのサンセリフ体を、紙の上で、ひとつの条件で比べたものでした。Nielsen Norman Group のレビューを含む現代の統制された研究は、ほぼ毎回同じ答えに着地します。現代の画面で妥当な本文サイズなら、よくデザインされたセリフ体とよくデザインされたサンセリフ体は、ほぼ同じ速度と理解度で読まれます。各カテゴリ内の差、つまり書体そのものの品質、字間、行長のほうが、二つのカテゴリ間の差をはるかに上回ります。

要するに、ブランドと文脈に合う書体を選べ、ということです。どちらのグループが「より読みやすいか」の議論はやめましょう。本文サイズでは引き分けで、見出しサイズでは、測定できる速度よりトーンのほうがずっと重要です。

選択が本当に重要になるとき

選択が重要になるのは、観る人がブランドやコンテンツをどう感じるかが変わるときです。それは5つの具体的な場面で起こります。

ブランドに伝統や権威が必要なとき。 法律事務所、プライベートバンク、大学、文芸出版社、高級ファッションハウス。これらの業界には100年分の視覚的慣習があり、セリフ体は契約の一部です。Sotheby's を Inter で組んだら、誰かが理由を説明できるようになる前に違和感を覚えるでしょう。セリフ体は「より読みやすく見える」のではなく、受け継いだ重みを運んでいるのです。

ブランドにモダンさやエンジニアリング感が必要なとき。 SaaS、フィンテック、開発ツール、AIインフラ。Stripe、Linear、Vercel、OpenAI、Anthropic はどれもサンセリフのアイデンティティを使っていますが、偶然ではありません。サンセリフは、合理的で、今っぽく、システムのために作られたものとして読まれます。2026年の開発ツールを Garamond で包めば、伝わるのはプラットフォームではなくアーカイブです。

プロダクトが高密度なUIのとき。 ダッシュボード、データテーブル、設定パネル、コードエディタ。ここではほぼ常にサンセリフが勝ちます。「画面での可読性」のためではなく、均一なストローク幅が、詰まったグリッドの12〜14ピクセルでも耐えるからです。小さなUIサイズのセリフ体は、ピクセルグリッドに対して振動して、ノイジーに見えがちです。

プロダクトが長時間の読書体験のとき。 エディトリアルサイト、書籍プラットフォーム、長編ジャーナリズム。セリフ体やセリフ寄りの書体(Source Serif、Newsreader、Lora、Tiempos Text、IBM Plex Serif)がよく勝ちます。ユーザーが速く読めるからではなく、長いセッションの中で質感が機械的に感じにくいからです。Substack、Medium、主要な新聞の多くが本文にセリフ体を選んだのには理由があります。

本文では担えない個性が見出しに必要なとき。 ニュートラルなサンセリフの本文に、高コントラストなセリフの見出し(Migra、Fraunces、Tobias)を組み合わせると、本文のUIの清潔さを犠牲にせずに、見出しでブランドに声を与えられます。現代のエディトリアルデザインで最も一般的なパターンのひとつで、盗む価値があります。

選択がほとんど重要でないとき

残りのほとんどの場面では、セリフ vs サンセリフの議論はパフォーマンスアートです。書体がよくデザインされていて、字間が適切で、階層が明確なら、どちらのカテゴリでも機能します。デザイナーが的外れな軸にエネルギーを浪費する例をいくつか挙げます。

汎用的なSaaSのランディングページ。 Inter、Söhne、Geist、Aeonik はどれも仕事をこなします。きちんと組んだ Source Serif でも同じでしょう。決めるのはブランドのトーンであって、カテゴリではありません。

ホームページのマーケティングコピー。 18〜22ピクセルの本文は、どちらのカテゴリでもきれいに読めます。トーンで選んで、ベンチマークはやめましょう。

ロゴとワードマーク。 ワードマークの成否は、文字の形、カーニング、比率で決まり、書体に足があるかどうかでは決まりません。セリフ体で成立している象徴的なアイデンティティは多く(Vogue、Tiffany、The New York Times)、サンセリフで成立しているものも多い(Google、Spotify、Airbnb)。カテゴリはブランドの下流にあります。その決定が実際どう行われるかは、ブランドアイデンティティのガイドラインで解説しています。

実在の組み合わせ、実在のカテゴリ

雰囲気より具体例です。今まさに本番で機能している書体の選択と、それが何を伝えているかを見てみましょう。

パターンは明らかです。セリフ体は、伝統、エディトリアル、長時間の読書が仕事になる場面に現れます。サンセリフは、システム、密度、エンジニアリングが仕事になる場面に現れます。決定はブランドと文脈に従うもので、媒体には従いません。

5分で選ぶためのフレームワーク

議論のすべては5つの質問のチェックに収まります。候補の書体をこれに通せば、答えが浮かび上がります。

1. ブランドは何を伝える必要があるか? 伝統、権威、エディトリアル、ファッションならセリフ寄り。モダンさ、システム、エンジニアリング、マスマーケットならサンセリフ寄り。
2. その書体は、ほとんどの時間どこで使われるか? 長文の読書ならセリフかセリフ寄り。高密度なUIならサンセリフ。
3. このカテゴリで、オーディエンスはすでに何に慣れているか? 銀行、法律、出版、ラグジュアリーにはセリフの慣習があります。SaaS、フィンテック、開発ツールにはサンセリフの慣習があります。慣習を破るなら、理由がある場合だけにしましょう。
4. 実機の小さいサイズで、その書体はどうなるか? Figma のスペシメンではなく、本物のスマホで14ピクセルで試してください。持ちこたえるセリフもあれば、にじむものもあります。
5. もう一方の仕事を担う相棒とペアになるか? セリフの見出しにはほぼ必ずサンセリフの本文が合い、その逆もよくあります。詳しい論理はフォントペアリングガイドにあります。

答えが片側に集まれば、選択は明白です。割れたら、ブランドブリーフが決着をつけます。決着をつけるのは、いつもブランドです。

2026年に無視していいこと

今年やめたい習慣がいくつかあります。「印刷はセリフ、画面はサンセリフ」というルールは死にました。現代のディスプレイは、本文サイズならどちらのカテゴリもきれいに描画します。

サンセリフのほうが「よりモダン」という思い込みも古くなっています。Migra、Fraunces、Tobias といったセリフのリバイバルや、本文にセリフ体を使う現代のエディトリアルブランド(Stripe Press、Substack)を見れば、モダンさの主張は薄く見えます。一方のカテゴリが自動的に「より読みやすい」という考えは、服を着替えただけの同じ神話です。書体の品質は、それが属するカテゴリよりはるかに重要です。

ブランドブリーフより先に書体を選ぶ本能は、順序が逆です。ブリーフがカテゴリを選び、カテゴリが候補を絞り、候補が技術、ライセンス、パフォーマンスで競うのです。

よくある質問

セリフ体は画面で本当に読みにくいのですか?

現代の本文サイズと現代のディスプレイでは、そんなことはありません。極小のUIサイズでヘアラインのセリフはピクセルグリッドに対して振動することがありますが、よくデザインされたテキスト用セリフ(Source Serif、Newsreader、Lora、IBM Plex Serif)は、スマホやノートPCの16〜22ピクセルできれいに読めます。「セリフは印刷向け」という主張は印刷時代の遺物であって、2026年の計測結果ではありません。

ウェブサイトでセリフ体を使うべきなのはいつですか?

ブランドに伝統、エディトリアルな重み、長時間の読書体験が必要なときにセリフ体を使いましょう。長編ジャーナリズム、書籍プラットフォーム、文学系ブランド、ラグジュアリーファッション、法律や金融では、セリフの本文が正当化されることが多いです。ボタン、ラベル、フォームなどのUI要素にはクリーンなサンセリフを組み合わせて、ランディングページからプロダクト画面までシステムが一貫するようにしましょう。

見出しと本文は同じカテゴリにすべきですか?

必ずしもそうではありません。よくある長持ちするパターンは、高コントラストなセリフの見出しにヒューマニストサンセリフの本文を合わせるもので、ページの上部でブランドパーソナリティを出し、レイアウトの残りはクリーンに描画できます。逆に、自信のあるサンセリフの見出しに静かなセリフの本文を合わせるのも、エディトリアルな文脈で美しく読めます。カテゴリは道具であって、チームではありません。

書体を選んだら、議論は忘れよう

セリフ vs サンセリフは、デザイナーが下す最も重要なタイポグラフィの決定ではありません。最も議論される決定ではありますが、それは別のことです。実際に結果を動かす決定は、ブランドブリーフ、タイプシステム、階層、スペーシング、ペアリングです。セリフかサンセリフかの問いは、そのすべての下流にあります。

5つの質問のフレームワークを回してください。ブランドと文脈に合う側を選びましょう。そして残りのデザイン予算は、作品の感じ方を本当に変える部分に使ってください。スケール、リズム、コントラスト、そして書体がシステムの他の部分の中でどう収まるかです。タイポグラフィが全体像の中でどう位置づけられるかは、ウェブデザインの原則の解説で扱っています。

書体選びから、システム構築、ブランドとプロダクトUIのリリースまでをまとめて任せられるチームをお探しなら、Brainy に依頼してください。私たちはセリフ vs サンセリフを5分の決定として扱い、プロジェクトの残りは、プロダクトに実際に現れる仕事に費やします。