タイポグラフィ

文字とデザインに関連するすべて
関連ソフト:
  • Illustrator
  • After Effects
  • Wordpress
  • Elementor
  • InDesign
職種:
  • Graphic Design
  • Motion Graphics
  • Web

 タイポグラフィとは文字とデザインに関連するすべて で文字自体のデザインから組まで読みやすさや美しさを追求する分野、というのが現代のタイポグラフィに対する筆者の解釈です。

 文字は情報を伝達するためのツールです。

 グラフィックデザインは視覚的に情報を伝達する方法です。

 グラフィックデザインにとって文字は最強のツールですが、その文字さえも効率よく、気持ちよく情報を伝達する創意工夫をしていくのがタイポグラフィという分野だと思います。

 よって、文字そのもののデザインも、文章の場合も紙面や画面で伝えるために様々な工夫を行います。

文字自体を創作するタイポグラフィ

 Helveticaという書体があります。

 長年グラフィックデザイナーに好まれて使われるスイス製のフォントです。

 どんな文字も誰かがデザインした文字で、字面を作るというのはもう学問レベルな分野です。

 80年代後半にはイギリスのネヴィルブロディ というデザイナーがコンピューター技術を使って新たなタイポグラフィの提案を大量に排出してグラフィックデザイナーの間でブームが起きました。

 The Graphic Language of Neville Brody は筆者の教科書でした。

The Graphic Language of Neville Brody
The Graphic Language of Neville Brody
The Graphic Language of Neville Brody 2
The Graphic Language of Neville Brody 2

 ネヴィル氏の作成する華やかな文字デザインも魅力的ですが、クラシカルな文字も重要です。

 fonts.comにFontology という記事があって、欧文フォントの基本を学ぶことができます。

ロゴマークでのタイポグラフィ

 映画配給会社でFOCUS FEATURES という企業があります。

 この会社のロゴマークは文字のみで表現しているタイプのものですが秀逸です。

focus features

モーショングラフィクスでのタイポグラフィ

 文字が動くと一挙に表現の幅が広がります。

 たとえばベトナムのSOGA Motion というプロダクションがAppleに制作した映像。

Webでのタイポグラフィ

 Webという媒体でのタイポグラフィは悩ましい部分が多いです。

 閲覧者の環境にないフォントを指定すると意図したデザインで表示されませんし、その問題のソリューションであるWebフォントを使うとダウンロードしなければならないデータが多くなってしまう。

 かと言って、画像で処理してしまうとSEO的に不利になってしまう。

 いまのところ見出しはウェブフォント、本文はシステムに頼ったフォントで画像は使わないというのが一般的だと思います。

 ページの表示速度までSEOに影響する今、優先すべきはスピードになってしまいます。

 それでも見出しや文字数の少ない場所では積極的にウェブフォントを使うと、キレイなサイトが作成できると思います。