blog

タイポグラフィの基本

こんにちは。

福岡市のデザイン会社・プラナート、ディレクターの岡本です。

今回はタイポグラフィについてご紹介します。

タイポグラフィは2通りの意味合いで使われています。

ひとつは、読みやすく、美しい文字を配置することです。守るべきポイントはいくつかありますが、文字間や行間などの余白を上手く使い、文章を読みやすく配置します。

もう一つは、文字をデザイン要素として用いる手法です。その手法としては、色の太さを変えたり、文字のタッチを変えたりすることで、あたかも文字をアートのように華やかに表現することです。

まず、一つ目の文字を美しく見せるためのタイポグラフの基本をご紹介します。

  • 英字フォントの縦幅は行の始まりを揃えて線を作る。
    複数の物を左端揃えに配置した時に線を作るように並べていきます。
  • 重要な部分ほど大きなフォントサイズで。
    重要な部分はフォントのサイズを変えたり、下線を引いたりすることで強調することで、メリハリをつけることができます。
  • 重要度の低い部分はサイズを小さくし色を薄く。
    白の背景には「灰色」や「半透明の黒」を、逆に濃い背景には半透明の白を使うことで、補足の情報であることを見る人に伝えることができます。
  • 和の雰囲気や洗練された雰囲気を出したい時は明朝体。
    明朝体は文字にハネ(飾り)のあるフォントなので、上品さや大人っぽさを出したい時に使うと効果的です。ただ、長文で明朝体を使うとハネがある分しつこいイメージになってしまうので、アイキャッチの部分には明朝体、本文にはゴシック体を使うのもいいかもしれません。
  • 行間はフォントサイズの1.25~1.50倍
    各タイプライン間の垂直方向のスペースのことを「リーディング」といいます。日本では「行間」の呼び名が一般的です。ただ、webデザインの場合は1.5~2.0の間にするのがおすすめです。
  • 部分的に背景色を変えてメリハリをつける
    テキストを複数並べるときには、メリハリをつけるためにテキストの一部に背景色をつけるのも効果的です。ただ、何種類も色を使うとまとまりが悪いので注意しましょう。
  • 英語のフォントと日本語のフォントは似たものにする
    Webサイトやブログの場合、英語と日本語のフォントが混じっても違和感ないように同系のフォントを選ぶようにしましょう。

次に文字をデザイン要素としてつかうタイポグラフィをご紹介します。

  • 数字をデザインの要素として使う。
    数字は最もおしゃれに見せることができるため、装飾をすることで全体を華やかに見せるだけでなく、見る人の目線を誘導することができます。
  • アルファベット1文字をシンボリック配置
    日本語一文字でもいいのですが、形が複雑なものが多いため、難易度が高くなるため、太文字のアルファベットのフォントが最適です。
  • 写真の上に文字をのせる
    当社のHPもですが、写真の上に文字をのせることで、おしゃれに見えます。
  • 手書きフォントで楽しい雰囲気を出す
    手書きフォントを使うことで楽しい雰囲気やアクティブな雰囲気を出すことができます。
  • 文字で何かの形を描く
    文字を並べて何かの形を描くことで、アーティスティックを見せることができます。

以上がタイポグラフィの基本ですが、基本をきちんと理解したうえでルールを破り、文章を読みやすくするだけでなく、文字を配置する技術とアレンジメントからなるアートにもなります。お客さんにわかりやすく説明できる基本の知識を身に着けていきたいと思います。

 

 

福岡のホームページ制作・各種デザイン・店舗工事|株式会社プラナート
https://planart.co.jp/