miraiz
ウェブ関係 デザイン2009-12-15

タイポグラフィの基本的な大切なルール

type_basic

まだまだ勉強中な私には非常に参考になったエントリーだったのでご紹介。

また、全編英語だったので、翻訳サイトを駆使しました・・・訳があってるかわかりません(笑)

1.Don’t use too many typefaces  たくさんフォントを使わない。

一貫性を保つ為に、3つ以上の違うフォントは使わない。

ステキなフォントがあると使いたくなってしまうんですよね・・・。

2.Hierarchy  ヒエラルキー

見出しとボディコピーなどの階層構造をしっかりと。

Hierarchy=階層構造。

この言葉、知りませんでした(汗)直訳した文章から、見出しは大きく、ボディコピーはそれより小さく。

見る人が読みやすいように、明確にしましょう。って事だと思います。(間違ってたら教えてください・・・)

3.Font size  フォントサイズ

一貫性を保つ為にも、フォントサイズを4つ以上使わない。望ましいのは3つです。

制作する時は、無意識に4つ以内になっている気がします。これを気に常に意識しようと思います。

4.8-10pt for body copy  最適なボディコピーのフォントサイズ

見出しと差別化する為に、ボディコピーのサイズは8~10ptがいいです。

12ptを超える時は、見出しをもっと大きく。

最近は10~12ptくらいで制作することが多いです。

5.A typeface not legible is not a typeface  読みやすいタイプフェイスを。

基本的なシンプルなタイプフェイスが読みやすいです。

実験的なタイプフェイスは、ポスターや、見出しに使いましょう。

確かに・・・。読めなければ意味がないですからね。

6.Leading  リーディング

垂直方向のスペースをきっちりしましょう。

つまり過ぎても読みにくいし、空き過ぎてもスカスカになってしまいますもんね。

7.Kerning  カーニング

文字の間隔です。

手動で設定するようにしましょう。

タイプフェイスによっても気持ちいい文字間隔は違うので手動で設定するのがいいですね。

8.Accent or emphasise

アクセントと強調。

キーワードを目立たせる効果があります。

ユーザーは流し読みするので、微妙な強調が効果的です。

確かに、露骨に<strong>なんかで強調されてると読みにくかったりしますね。

9.Do not over emphasise

強調しすぎない。

シンプルに上品にするべきです。

さりげなさが重要ってことですね。

10.No caps in body text

ボディテキストでのルール。

ボディテキストを大文字で構成しない。読みにくいだけ。

確かに、英語サイトでボディテキストが全部、大文字だったら読みにくいですね。

11.Always align to a baseline

ベースラインは揃える。

日本語と英語が混じっている時は、注意しなきゃですね。

12.Flush left ragged right

ツラ揃え。

左はそろえて、右はバラバラでも。

右端の折り返しに悩む時があります・・・。

13.Lines not too long or short

一行の長さも大切です。

長すぎず、短すぎず。読みやすい行長で。

webサイトを制作する時は、行長も考えておかなければなりませんね。

14.Punctuation and Bullet points

句読点とBullet points

適切な間隔を与えましょう。

日本語も同じですね。

変な解釈になってたらご指摘下さい・・・。

原文はこちらから

Simple rules for good typography


コメントをどうぞ