無料ツールお役立ちリンク参考書籍お知らせこのサイトは2010年頃の更新をもって活動を終了しております。閉鎖してしまうには惜しい記事も多いことから、公開に問題の無いものだけをアーカイブ的に掲載し続けていますが、今となっては古い情報が多いです。そのことを十分にご承知の上、何かにご参考いただければ幸いです。>バランスをうまくとろう余白の幅や文字の密度など、文章の「詰まり具合」は見た目の印象を大きく左右します。画面構成のバランスをうまくとりましょう。私ならおそらく「わぁ、読むのが大変だ」と思います。ホームページも同じことです。同じ情報量でも、文字がびっしり詰まったページと、スクロールが必要でも適度なすっきり感のあるページとでは、はじめに受ける「読みやすさ・読みにくさ」の印象が異なります。いろはにほへとちりぬるをわかよたれそつねならむうゐのおくやまけふこえてあさきゆめみしゑひもせすいろはにほへとちりぬるをわかよたれそつねならむうゐのおくやまけふこえてあさきゆめみしゑひもせす2番目の文章は1番目の文章に比べて、上下の行の中心間の距離を1.5倍とりました。この結果、横方向への視線の移動が楽になり、スッキリして読みやすくなりました。行間を広くとりすぎると情報量自体が少ない印象を受けますので注意してください。「詰まった文章」はエネルギッシュな印象も持っていますので、スッキリした文章が必ずよいとは限りません。一般的に、読みやすくするためには、文字と文字の中心間の距離を文字の高さの1.4倍以上とるべきと言われています。できるだけそれ以上の行間をとるようにして、「スッキリ」と「エネルギッシュ」のバランスを考えてみてください。CSSで定義する際には、行間隔の指定をline-heightプロパティで指定します。余白をうまくとろう文章の「詰まり具合」を左右するもう1つの要素として、余白の量があります。デザイン用語では「版面率」と呼び、次のような働きを持つことが広く知られています。余白が少ない状態を「版面率が高い」と言います。版面率が高いと、画面に圧迫感を覚える一方、全体的にエネルギッシュな印象を与えることができます。余白が多い状態を「版面率が低い」と言います。版面率が低いと、落ち着いた、格調高い印象を与えることができます。ホームページの内容やターゲットとするユーザーによって、適切な版面率は異なります。Wordの標準では、A4判のとき30mmになっています。それを考えると「見慣れた感じ」にするためには、左右それぞれ本文エリアに対して10%程度の余白をとるといいでしょう。版面率をどう設定するのでも、横方向の余白は左右均等にとる方が、しっかりした印象が得られます。CSSで定義する際にはmarginプロパティで余白の量を指定します。漢字・仮名の量を考えよう文章を構成する文字の漢字・仮名の比率によっても、画面全体の「詰まり具合」が変わってきます。わたしたちは常に、みなさまの利益を第一に考えています私達は常に、皆様の利益を第一に考えていますこの例のように、一般的に、仮名の多い文章は「すっきりやさしく」見え、漢字が多い文章は「ぎっしり難しく」見えます。これが文章全体になるとかなり印象が変わります。漢字は仮名に比べると文字自体が「詰まって」いるため、漢字ばかりだと「ぎっしり感」が増すわけです。漢字や仮名の量は、内容のやわらかさ・堅さのバランスとも関係しますので、ホームページの内容やターゲットとするユーザーによって、適切な割合は異なります。一般的には、あまり漢字ばかりの文章にしない方が、読みやすい印象を与えるでしょう。逆引きハンドブック』のべ数百の文章テクニックを、困ったときに使いやすい逆引き形式で整理。