TYPOGRAPHY RULES

タイポグラフィ7つのルール その❶ 美しさの基本は「そろえる」にある

タイポグラフィ7つのルール その❶ 美しさの基本は「そろえる」にある

タイポグラフィ7つのルール ❶ そろえる
▼第4回

前回は、行頭揃えの説明を中心に、行末揃え・中心揃えのポイントを述べてきました。文字の奥深さを実感していただけたのではないかと思います。

今回は、主に「目の錯覚」についてお話しします。脳が勘違いや、先回りした判断で、実態と異なる見かたをすることを「錯視」といいます。私たちの生活には「錯視」があふれています。タイポグラフィはまさに厄介な「錯視:目の錯覚」との戦いなのです。

第4回もくじ 1.11 揃え処理の大敵、目の錯覚
  1.11.1 ●万人に共通の「目の錯覚」
  1.11.2 ●環境や個人差で異なる「見えかた」
1.12 書体デザイナーの苦悩
  1.12.1 ●文字も広い意味では「図形」
  1.12.2 ●書体の揃え処理は、デザインの原点

1.11 揃え処理の大敵、目の錯覚

揃えを行う場合の便利な方法として、ガイドを使用することは、“1.3 ガイドは必要、でも頼りすぎない” でお話ししました。また、それに頼りすぎてはいけないことにも触れました。あくまで、数値ではなくみた目で揃えなくてはならないということです。これは意外に難しく、繊細な感覚を要求されます。
なぜ、揃えがこんなに難しいのか、それは、前の項でも少し触れた、万人に共通の「目の錯覚」が原因しています。

(figure1-18)
おなじみの目の錯覚図形

上の図は、よく知られている目の錯覚を説明する、一番わかりやすいものでしょう。
左側は一般的な図。横線の長さは同じですが、どう見ても下のほうが長く見えます。
右側は、私が少し手を加えたもの。下の横線を短くしてあります。どうですか、同じに見えませんか?

1.11.1 ●万人に共通の「目の錯覚」

目の錯覚は万人に共通ですが、見えかたには個人差があるので、私はほぼ同じに見えるように設定したつもりですが、皆さんにはどう見えるでしょうか。でも、少なくとも左側の図ほどの長さの差は感じないと思います。

さて、文字は(特に和文では)、大別すると以下のような図形にあてはまる形状をしています。バラエティに富んでいますね。

(figure1-19)
和文漢字のさまざまな形

こんな感じでしょうか。

これらは全て一定のボディ(ここでは1辺1000emの正方形)に収まっています。なお、この図形は、目の錯覚をはっきりと示すためにオブジェクトで描画しています。(三角形は正三角形。底辺より高さが短いため、完全に正方形に収まっているとはいえません)
見た目の大きさが、ひどくバラバラなのがわかります。

ちなみに、大きく見える順に並べてみましょう。

(figure1-20)
大きく見える順にならべると…

1.11.2 ●環境や個人差で異なる「見えかた」

この順番に見えると思います。(ただ、三角形は、その形状や周囲の空白スペースに大きく左右されます。ですので、見えかたはその環境によりさまざまに変わります。また、人によって感じ方は異なるかも知れません)

不揃いの図形を同じに見えるようにする作業が、実は、揃え処理の原点なのです。

同じに見えるようにそれぞれの大きさの調整をしてみましょう。
いかがですか?

(figure1-21)
大きさの調整をして同じに見えるように…

ここでも、いいわけをしておきます。見えかたには個人差があります。私はほぼ同じに見えるように設定したつもりですが、皆さんにはどう見えるでしょうか。

1.12 書体デザイナーの苦悩

図形での説明が長くなりましたが、これは紛れもなく文字(字体:タイプフェイス)を説明するための序章でした。

1.12.1 ●文字も広い意味では「図形」

さきほどの図形を、こんどは書体を使って表現してみましょう。使用したのは「小塚ゴシックPro M」です。右向き・左向きの三角形は少し平べったく設計されています。(これはほとんどの書体がそうです)

大きさの調整がされているのがわかります。

(figure1-22)
小塚ゴシックの調整具合

この書体の場合は、【●】を、字面枠いっぱいに設計しています。【●】は、閉鎖的・求心的で小さく見えるためです。したがって、これらの図形の中では大きめの、漢字のサイズに一番近い字面枠のサイズになっています。
大きく見える【■】を小さめに、小さく見える【◆】をボディ(仮想ボディ)いっぱい近くまで大きくしています。そして、三角形は高度な空間処理がされています。

【▲】と【▼】を使って説明しましょう。「底辺」の先端が、文字サイズの基準として存在している字面枠より出っ張っているのがわかります。先の細い部分は周りの空間に〔浸食〕されて存在が薄れるため、わざと出っ張らせています。そうしないと小さく見えるからです。

そして、「高さ」の先端にも同じことがいえるので、三角形全体を【▲】の場合は上に、【▼】の場合は下に下げています。少し極端に感じますが、これは三角形どうしを並べているからで、他の文字と並べたときちょうど良いのです。

(figure1-23)
三角形の高度な調整

1.12.2 ●書体の揃え処理は、デザインの原点

私を含めた書体デザイナーは全員、全ての文字をこれらの法則にのっとって設計しています。単純にボディ、字面枠に当てはめているわけではありません。
この地道な作業があるから、文章として組んだとき、整った大きさできれいに見えるのです。
これはまさに、書体デザイナーの苦悩の産物といえるでしょう。

でも、書体デザイナーがこれだけ苦労しても、実際、商業デザインに使用するとなると、グラフィックデザイナーであるみなさんの力を借りなければなりません。
違う書体との組み合わせ、さまざまな文字サイズとの同居、写真やイラストなどとの配置関係、文字を取り巻く空間の度合い、などの複雑な要素によって、“1.11 揃え処理の大敵、目の錯覚”での冒頭にお話しした、難しい揃え処理を必要とするのです。

デザイン上の揃え処理は、書体の揃え処理がベースであり、原点といってもいい過ぎではなのです。

あとがき

いかがでしたか? 揃えることの重要性をわかっていただけたら、こんなに嬉しいことはありません。この『タイポグラフィ7つのルール』は、始まったばかりです。長編であるがゆえに、執筆や図表の制作に相応の時間がかかることから、一度に掲載することはできません。でも、1回1回をマスターしていけば大丈夫なようにしてあります。

少しずつ、取り入れていってください。この「講座(?)」が終わるころには、タイポグラフィの腕は確実に上がっています。それを信じてついてきてくださいね。

● ● ●

次回は、“タイポグラフィ7つのルール その❷ 和文の美しさのカギは「つめる」こと” をお話しします。ご期待ください。

次回予告 その❷ つめる 和文の美しさのカギは「つめる」こと

ページ:
1 2 3

4

関連記事

  1. タイポグラフィ7つのルール その❻-2 取りあえずこれだけ知っておこう、組版上の推奨事項
  2. デザインが100%うまくなるタイポグラフィ7つのルール:はじめに

    TYPOGRAPHY RULES

    デザインが100%うまくなるタイポグラフィ7つのルール Prologue

    はじめにタイポグラフィ文字表現のデザイン処理のことをいいま…

  3. タイポグラフィ7つのルール その❺ 「ひく」ことは、すべてがマイナスではない

    TYPOGRAPHY RULES

    タイポグラフィ7つのルール その❺ 「ひく」ことは、すべてがマイナスではない

    ▼第1回(通算第16回)前章 “タイポグラフィ7つのルール…

  4. タイポグラフィ7つのルール その❻-6 書体には「性格」や「表情」、そして「適性」がある
  5. タイポグラフィ7つのルール その❻-3 文字組みを見やすくする[行頭・行末・分離禁則]、しかし…
  6. タイポグラフィ7つのルール その❸ あける 息苦しいデザインの回避法は「あける」こと

    TYPOGRAPHY RULES

    タイポグラフィ7つのルール その❸ 息苦しいデザインの回避法は「あける」こと

    ▼第1回(通算第9回)この章での「あける」は、主に「行間」…

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

CAPTCHA


NEWS

2018.7.29サイトを引っ越ししました

ドメインも新規になっています
moji-blog.typoren.com は moji-blog.renfont.com に引っ越ししました。moji-blog.typoren.com にお越しの方は自動的に moji-blog.renfont.com の同じ記事にご案内しております。

おすすめ記事

  1. 書体の表情 12:作者の文字への情熱がほとばしる=小塚明朝
  2. 書体の表情 11:好き嫌いがはっきり分かれる=小塚ゴシック
  3. 現代的と伝統的の不思議なコラボ=ヒラギノ明朝
  4. 書体の表情 9:macOSやiOSに標準搭載されている=ヒラギノ角ゴ
  5. 書体の表情 8:藤沢周平の小説を組むために作られたという=游明朝体

最近の記事

  1. 書体の表情 12 作者の文字への情熱がほとばしる=小塚明朝
  2. 書体の表情 11 好き嫌いがはっきり分かれる=小塚ゴシック
  3. 書体の表情 10 現代的と伝統的の不思議なコラボ=ヒラギノ明…
  4. 書体の表情 9 macOSやiOSに標準搭載されている=ヒラ…
  5. 書体の表情 8 藤沢周平の小説を組むために作られたという=游…

アーカイブ

  1. 無いものねだり

    MOJI ESSAY

    無いものねだり
  2. 書体の表情 4:おおらかさの中に風格が漂う=筑紫B見出ミン-E

    TYPOGRAPHY SERIES 2

    書体の表情 4 おおらかさの中に風格が漂う=筑紫B見出ミン-E
  3. タイポスとの出会い

    MOJI ESSAY

    タイポスとの出会い
  4. タイポグラフィ7つのルール その❷ 和文の美しさのカギは「つめる」こと

    TYPOGRAPHY RULES

    タイポグラフィ7つのルール その❷ 和文の美しさのカギは「つめる」こと
  5. 現代的と伝統的の不思議なコラボ=ヒラギノ明朝

    TYPOGRAPHY SERIES 2

    書体の表情 10 現代的と伝統的の不思議なコラボ=ヒラギノ明朝
PAGE TOP
%d人のブロガーが「いいね」をつけました。