Clik here to view.
コンテンツは現場にあふれている。会議室で話し合うより職人を呼べ。営業マンと話をさせろ。Web 2.0だ、CGMだ、Ajaxだと騒いでいるのは「インターネット業界」だけ。中小企業の「商売用」ホームページにはそれ以前にもっともっと大切なものがある。企業ホームページの最初の一歩がわからずにボタンを掛け違えているWeb担当者に心得を授ける実践現場主義コラム。
宮脇 睦（有限会社アズモード）
心得其の296
勝手にランキング
Clik here to view.
元日は親戚づきあいもあり、始終酔っぱらっているのですが、翌2日の恒例行事が年賀状の査定です。査定するのは文面やデザインではありません。プリンタによる印刷宛名です。ちなみに手書きはすべて「合格」。私に手書き文字の美醜を語る資格がないのは以前述べた理由からです。
住所と名前のバランスをみます。採点基準をここで晒すと、いろいろと支障がでるので割愛しますが、神は細部に宿るというように、「様」を名前よりひとまわり小さくするといった「工夫」は加点対象です。それがもっとも表れるのが「フォント」です。書体のチョイスに性格とセンスが表れます。ただ、最近は「楷書体」が増えたので面白味もなくなりました。かつては行書や草書、さらにはPOP体で送ってきたのはかつての勤務先の上司です。
というわけで今回は「フォント」の話。
宛名にあう書体
Webブラウザは通常、閲覧するパソコンにインストールされている「フォント」を呼び出して文字を表示しています。しかしいま、インターネット業界ではCSS3から本格投入された「font-face（フォントを指定するためのスタイル）」によって、Webサーバーにアップしたフォントファイルが利用可能になり、今後はWeb上で自在にフォントが指定できるようになるのではないかと期待されています。
普及が進むには、フォントのライセンスの問題や、読み込みにかかるサーバーの負荷など、解決しなければならない問題が残されていますが、実際に普及した後の問題を私は懸念します。それが先の「POP体の宛名」です。
宛名には敬意を込めます。これをPOP（ポップ）に飾るなど部下に宛てたものでも本来は論外。パソコンというツールによって「面白い形の文字」を手にした興奮からの勇み足ですが、さまざまなフォントを気軽に使えるようになったときに、求められるシーンに適さないフォントを使う「Web担」が現れる……かもしれません。
フォントの大原則
そもそもフォントは使いすぎると与える印象が散漫となります。フォントとは文字をデザインしたもので、それぞれに個性があるからです。フォントの多用をマンガでいえば「スラムダンク」の井上雄彦と、「ドラえもん」の藤子・F・不二夫、そして漫☆画太郎のキャラクターが同じページに混在しているようなものです。
特にPOP体のような、躍動するフォントの多用は厳禁で、画面が「うるさく」なってしまいます。素人が「ワード」で作ったチラシが野暮ったいのは、フォントの多用によってフォントを見せるためのデザインという本末転倒に陥るからです。
1つのコンテンツで使用するフォントは2～3種類に絞り込むのが基本です。
基本的な使い分け
コンテンツにおいてフォントが果たす役割は「見出し」と「文章」に分けられます。それぞれのスタンダードな割り当ては、見出しはゴシック体系、文章は明朝体系です。DTPの経験者なら当たり前に過ぎることなので、だからこそ本稿の趣旨にあうと臆面もなく記します。
WebにおいてはWindows以降、「MSゴシック」がデファクトスタンダードとなり、本文にゴシック体を使うことに違和感を覚える人は減りました。しかし「本文は明朝」はDTPにおいてはいまでも基本で、それは可読性によります。
明朝体はながらく活字用の文字として改良されてきました。新聞、雑誌、書籍などで使われるフォントは、それぞれ会社によって微妙に異なりますが、大きな括りとして本文は「明朝体」です。特に新聞に顕著で、リードも含めた本文は明朝体で、見出しは縦書き横書きを問わずにゴシック系を採用しています。
Webでも有効な使い分け
そしてこの基本はWebでも有効だと「TypeSquare」を利用して確信に至ります。TypeSquareとは日本語フォントの雄「モリサワ」が提供するクラウドフォントサービスで、出版・DTP業界ではお馴染みの「新ゴ」や「リュウミン」といった「モリサワフォント」をWebで再現するものです。今年の末（2013年12月31日）までは無料キャンペーン中で、好きなフォントを自由に利用できます。これを自分の「ブログ」で試します。見出しは「新ゴ」にして、本文を「リュウミン」にします。
……圧倒的に可読性が高まることに驚きました。活字好きというのもあるのでしょうが、あらためてフォントの力を見せつけられた思いです。見出しの新ゴは当たり前すぎると、いまは気分で変えて遊んでいますが、それができるのもフォントを選べるCSS3の魅力といえます。
昭和の基本
1つのコンテンツで使うフォントは2～3に絞り込むのがベストとしましたが「（フォント）ファミリー」は例外です。「TypeSquare」のゴシック体の新ゴには、「ウルトラ（U）」という超極太から、「エクストラライト（EL）」という超極細までの8つの線の太さ（ウエイト）によるバリエーション（JIS2004は重複として除いています）があり、これらをまとめて「ファミリー」と呼びます。
互いに印象を邪魔することがないので、ファミリーをつかって表現力を高めることができます。たとえば、見出しタグの1～5の表現を、それぞれを同じフォントファミリーの「太さ」で変えるといったようにです。もちろんこれはDTPにも通じます。
最後にフォントに関する「昭和の教え」を1つ。かつてチラシの「金額（数字）」は「ゴシック」で揃えました。文字の粒が揃い、各線が均一であることから、数字を認識しやすいからです。価格の誤解はもっともトラブルに発展しやすく、かつては常識とされたものです。いまはPOP体なども使われますが、基本的に線の太いフォントを使うのは「昭和の教え」に沿ったものでしょう。
Webにおいて、フォントは粗雑に扱われてきました。しかし、CSS3によってフォントの表現力が、コンテンツのクオリティを左右する時代がやってくるかもしれません。ちなみに今年の年賀状宛名ランキングの1位は、某デザイン事務所から届いた総ゴシック体の宛名でした。デザイン事務所にあるまじき、実直さだけが目につく直線だけで構成された文字の配列に性格がにじみ出ます。
今回のポイント
フォントを意識する時代になるかも
ならば「基本」を押さえておくべし
Clik here to view.
宮脇 睦（みやわき あつし）
プログラマーを振り出しにさまざまな社会経験を積んだ後、有限会社アズモードを設立。
制作、営業の双方の現場を知ることからウェブとリアルビジネスの融合を目指した「営業戦略付きホームページ」を提供し、一業種一社、制作案件は足立区内のみという営業施策をとっている。本業の傍らメールマガジン「マスコミでは言えないこと」を発行。好評を博す。著書に『Web2.0が殺すもの』『楽天市場がなくなる日』（ともに洋泉社）、冷静な視点からのIT業界分析に「週刊ポスト」など、様々な媒体から情報発信を続ける。
- ブログ「みやわきぶろぐ」
- ツイッター「@miyawakiatsushi」
- 有限会社アズモード
- コーナー：企業ホームページ運営の心得
- 内容カテゴリ：Web担当者／仕事
※このコンテンツはWebサイト「Web担当者Forum - 企業ホームページとネットマーケティングの実践情報サイト - SEO/SEM アクセス解析 CMS ユーザビリティなど」で公開されている記事のフィードに含まれているものです。
オリジナル記事：Webフォント普及の前に、素人でも知っておきたいフォントの基本 [企業ホームページ運営の心得] | Web担当者Forum
Copyright (C) IMPRESS BUSINESS MEDIA CORPORATION, an Impress Group company. All rights reserved.
Clik here to view.
Clik here to view.
Clik here to view.
Clik here to view.
Clik here to view.