week1 4. タイポグラフィで押さえるべきポイント
デザインにおいて、最もぬるま湯塾が重要視している一つが「文字」です。
WEBデザインでは文章を使うことが多くなりますが、中身の文章が同じでもタイポグラフィ次第でユーザーに与える印象、見え方、読みやすさは全く違ってきます。
どのような書体を選ぶか、どう配置するかといった基本のルールを知り、理解しておくことが重要です。
逆に言えば、ある程度の文字の扱いを身につけてさえおけば、誰でも一定レベルのデザインをすることが出来るようになります。
同じ文字でも見せ方次第で格段に伝わるデザインにもなるし、可読性の良さ・伝達できる情報量も違ってきますのでぜひポイントをしっかりとマスターしておきましょう。
今回は、タイポグラフィで気をつけるべきポイントをご紹介します。
WEBデザインのみならず、文字を扱うデザインでは全て共通する考え方となります。
4.1 タイポグラフィとは？
タイポグラフィとは、元々は活版を用いた印刷術のことです。現在では、デザインにおける活字（テキスト）の構成および表現を意味します。具体的には、フォントの種類、サイズ、文字組や行間等を特定のルールに則って上手く組み合わせることで、文章の読みやすさや美しさを意識したデザインを作る手法です。
凸版印刷博物館は、文字の歴史に触れられるオススメスポットなので、ぜひ機会があれば勉強のために足を運んでみて下さい。
⇒https://www.printing-museum.org/
タイポグラフィは、活字の配置や構成、フォントやサイズ、行間、文字と文字との間隔（カーニング及びスペーシング）、印刷物の紙面上での活字が占める領域の配置・構成・レイアウトなどを設定することで、印刷物の文字の読みやすさや美しさを得ることができました。現在では、印刷物だけでなく、様々なデザインに用いられるようになり、デザインの基本であり奥義でもあります。
タイポグラフィを用いることで、相手に伝えることの出来る情報量と濃度を高めることが可能になります。ビジュアルや写真は人の感情（凄さ・リアリティーなど）を動かすことは出来ても、万人に特定のアクションを起こさせる（申し込み・資料請求など）ことは文字にしか出来ません。
お申し込みはこちら ››
資料請求はこちら ››
カート入れる ››
など。
4.2 フォントの豆知識
フォントがデザインのクオリティーを決める
手書きの手紙やノートを想像すればわかるように、丁寧に書かれたものと、雑に書かれたものでは、その印象は大きく異なります。どのフォントを使用するかによって、デザインの「読みやすさ」や「見やすさ」ばかりでなく、「印象」が大きく変わります。文字の第一印象は実はとても重要となってきます。
出来る限り無料で。という場合には、可能な限りMSゴシックやHGゴシック、MS明朝を使わず、標準搭載されている（最近のOS）フォントでは、メイリオ、游ゴシックがオススメフォントです。Macならヒラギノ角ゴシックが見た目も使い勝手もよいでしょう。フリーフォントを使いたいのであれば、Noto Sans CJK JPやBIZ UDゴシックなどがよいでしょう。比較的文字量が多い場合であれば、游明朝やヒラギノ明朝（Mac）がオススメ。フリーフォントなら、Noto Serif CJK JPやBIZ UD 明朝がオススメです。
プロのデザイナーが使う３種の神器
モリサワ社が販売している
・新ゴ（ゴシック）
・リュウミン（明朝）
・ヒラギノ（標準搭載されているノーマルフォント）
この３種類を使用するとデザインがプロになります。
最近はサブスクの年額や月額制のモデルがお勧めです。
日本一デザイナーが使用している有料フォントになります。
文字も一文字一文字。人の手によって。職人によってデザインされて作られています。
日本語書体は努力の結晶
フォントデザイナー達の血のにじむような苦労の一端を知るとその価値がわかります。
自分で日本語フォントをデザインして作成してみるとその苦労の一端が垣間見えます。
・英数字
・ひらがな
・カタカナ
・常用漢字（2136個）
・異体字（863個）
これ一つ一つをチームで全てデザインしています。何年もかけて気の遠くなるような作業です。
洗練された文字の美しさはデザイナーのポテンシャルを最大限に引き出してくれます。そもそも日本語フォントというのは正方形で美しくデザインされ、読みやすくデザインされているので、文字の縦横比を変更してしまうのはご法度となります。
4.3 フォントの種類
フォントは、漢字・仮名を含む「和文フォント」と、アルファベットを主体とする「欧文フォント」に大別されます。和文フォントは「明朝体」・「ゴシック体」の2書体が主に使われ、「欧文フォント」は「セリフ」・「サンセリフ」が主流です。
以下では、明朝体・ゴシック体・セリフ・サンセリフの4書体について簡単に説明します。
明朝体
「楷書体」を元に、活版印刷用に明朝時代に生まれた書体で、「うろこ」とよばれる三角形の飾りが線の右側にあるのが特徴です。また、縦線と横線の太さに加え、線のはじまりや「はね」「はらい」の部分も太さが異なります。「繊細」「上品」「高級」「知的」といったイメージを与えます。教科書を除く書籍類の多くは明朝体が使用されています。
ゴシック体
縦線と横線の太さが均等で、装飾性がないのが特長です。遠くからでも良く見え、屋外看板などに使用されます。長文では明朝体に比べると読みやすさは劣るとされますが、液晶画面などではシンプルなゴシック体の方が表示に適しており使用されています。「モダン」「信頼」「力強さ」といったイメージを与えます。
セリフ
線の先端に飾りのある書体を指します。印刷技術が生まれる前の手書き文字の風合いを表現しており、「伝統」「クラシカル」「格調」といったイメージを与えます。線の先端の飾りに加えて、縦線と横線の太さが異なるのも特徴です。
サンセリフ
線の先端に飾りの無い書体を指します。セリフと違って縦線と横線の太さがほぼ均一で、「シンプル」「新しい」「カジュアル」といったイメージを与えます。
この他にも、イメージをより強調するとともに視線を集める効果のある「ファンシー系」書体や、「行書体」「楷書体」「江戸文字」など筆で書いたような書体など多数あります。
フォントの太さ
PCに最初からインストールされているフォントには、あまり太さのバリエーションが揃っていませんが、クリエイターがデザインに使用するフォントには様々な太さが揃っています。
「ウルトラライト」
「エクストラライト」
「ライト」
「レギュラー」
「ミディアム」
「デミボールド」
「ボールド」
「エクストラボールド」
「ウルトラボールド」
「ヘビー」などなど。
パワーポイントなどであれば、レギュラー、ボールド程度しか意識していないかもしれませんが、この太さ（ウェイトとも呼びます）を意識しながら作成していきます。
太いフォント：力強さ・男性的な印象を与える。ゴシック系のフォントが効果的。元気さにもつながるので、アクティブな女性向けの表現にも使えます。
細いフォント：現代的・都会的・洗練・先進・女性的といった印象を与える。明朝系で細い書体の場合、より女性的な印象を与えることもあります。
ゴシック：男性らしさ、商品やサービスの低額さなどの表現に使えます。より太いゴシックにすればするほど敷居が下がり、低額サービスの案内がしやすくなります。
100円均一、トイザらスのロゴなどはイメージがしやすいと思います。
明朝：女性らしさ、商品やサービスの高級感などの表現に使えます。
メルセデスベンツや、ドンペリなど。高級志向なものは明朝書体を使うと効果的に高級感を演出することが出来ます。逆に太いゴシックなどを使用してしまうと、商品やサービスの価値を下げてしまいかねません。
フォントと太さの組み合わせで印象は様々に変わります。どういったフォントを使うのか、またどの太さにするか、異なるフォント同士の組み合わせ方など、与えたい印象を考えながら選んでいきます。
Webサイト最上部の大きなビジュアル部分を例にします。Webサイト訪問時に、最初に表示される部分のため、サイトが与える印象に大きく影響します。