福岡で伝わるホームページを制作している安武寿です。
今日は「余白は人に文章を読ませる上で重要」という話をします。
まずは、こちらと（1-1）。
余白を適正に取っている文章と、余白を取っていない文章、どちらが読みやすいでしょうか？また、ぱっと見て、どちらの方が「読みたい」と思いますか？文章はやはり読みやすさが重要で、読者に対してできる限り負担を与えないようにすることです。
こちら（1-2）、
余白を適正に取っている文章と、余白を取っていない文章、どちらが読みやすいでしょうか？また、ぱっと見て、どちらの方が「読みたい」と思いますか？文章はやはり読みやすさが重要で、読者に対してできる限り負担を与えないようにすることです。
どちらの方が読みやすいですか？
また、こちらと（2-1）、
見出しがついた文章！
見出しがついている文章であっても、やはり余白がある文章と、余白がない文章とでは、見やすさがまったく違ってきます。見出しと文章の間隔がつまっていると、読み始めの位置を認識しにくくなります。
とこちら（2-2）、
見出しがついた文章！
見出しがついている文章であっても、やはり余白がある文章と、余白がない文章とでは、見やすさがまったく違ってきます。見出しと文章の間隔がつまっていると、読み始めの位置を認識しにくくなります。
どちらの方が読みやすいですか？
おそらく（1-2）と（2-2）だったと思います。
それぞれ上部文章（1-1,2-1）では、詰まった感じがして読みにくさを感じたのではないでしょか？
しかし、下部の文章（1-2,2-2）の文章では、ゆとりがあって、読み出し位置も探しやすく、読みやすさを感じたのではないでしょうか？
このように余白を調整するだけで、読者にとって読みやすい文章となります。
「できる限り読者に負担を与えないことが、伝わる文章である」と以前お話しましたが、これもまさに、負担を与えない文章の1つとして言えます。
確かに余白の調整は、若干手間がかかるので面倒ではありますが、その手間を取るか取らないかで、読んでもらえる文章になるか、読んでもらえない文章になるかが決まるといっても過言ではありません。
今回のソースサンプルはこちらです。
<div style="width:300px;border:solid 1px #cccccc;padding:15px 15px 8px 15px;">ここに文章を書く</div>
<div style="width:300px;"><h3 style="width:300px;background-color:#E8FCCC;text-align:center;margin:0px;padding:5px 0px 3px 0px;">ここに見出しを書く</h3><p style="width:292px;margin:10px 0px 0px 0px;padding:0px 4px 0px 4px;">ここに文章を書く</p></div>
最後までご覧頂きありがとうございました。
福岡ホームページ制作会社 ファンクリップ 安武寿
(上記リンクを押すと、新画面が開きファンクリップのホームページに遷移します)