見出し画像

【デザイン】伝わる文章のヒント

文章の機能とはなんでしょうか?

一つ、確実に言えるのは相手に情報を伝えることです。
このNoteではデザインの力で読みやすい文章を書くためのヒントをお伝えします。

このNoteを参考にしていただければ Word や Webデザイン など媒体を問わず、
より美しく、より伝わる文章をデザインすることができます。

余白

日本語の場合、文字の縦の幅は文字の1.6倍以上にしましょう。

下の1番と2番の文章を見比べて、どちらが読みやすいでしょうか?

画像1

2番の方がより読みやすくありませんか?
この違いは文字と文字の行間にあります。

1枚目はgoogleドキュメントの基本設定の行間の1.15です。
対して2枚目は行間の設定を1.75に設定しています。

なぜ標準の設定では読みづらくなってしまうのでしょうか。
それは和文(日本語)と欧文(アルファベット)の文字の大きさに由来します。

下の図のように欧文では文字の大きさが、字面いっぱいに使われることはないのですが、
和文の場合、字面いっぱいに文字が広がります。
字面とは文字を囲む枠のことです。

字面

そのため、元々欧文を書くことが前提とされているWordやWebでは、
標準の設定で和文を書くと欧文に比べて文字同士の縦幅が短くなってしまい、詰まった印象になってしまうのです。

これを解決するために、日本語で文章を書くときは行間の設定を1.75程度に設定しましょう。

文字の色

文章の色に完全な黒を使うのはやめて、グレーにしましょう。

文字の設定は何に設定していますか?
なんとなしに黒に設定してはいないでしょうか。

画像3

文字の色は完全な黒を使うのではなく、ややグレーなものを使った方が長時間読んでいても疲れづらくなります。

みなさんが今ご覧になっている note の文字の色も完全な黒ではなくグレー (#222222) で指定されています。

これは背景とのコントラストの問題です。色と色を組み合わせるとき色の明るさが開きすぎると眩しい印象になってしまいます。

なので、強調して伝えたいときなど、ここぞ!という時以外黒を使わないのがおすすめです。

黒という色は特別な色です。
黒は最も力強くコントロールの難しい色です。

文字の大きさ

文字の大きさを変えて意味を変える。

タイトルや見出しに本文と同じ大きさの文字を使ってはいないでしょうか?

人は大きい書体から順番に文を読みます。

スクリーンショット 2020-06-23 18.26.52

なのでタイトルや見出しは、ただ書体を太くするだけでなく、
大きくするとより伝わる文章になります。

文字の形

Widowsユーザーは書体を選ぼう

最後に書体の話です。
書体とは文字の形の種類のことです。

特にWindowsをお使いの方なのですが、
遊明朝 や 遊ゴシック を使うのが無難でしょう。

メイリオが良いという記事も見かけますが、本文で使うならばメイリオを避けた方が良いでしょう。

なぜ本文に適した書体とそうでない書体があるのでしょうか?

それは書体によって、左右の字面までの感覚に違いがあるからです。
文字と字面との左右の余白が少ないほど詰まって読みづらい印象になってしまいます。

メイリオは明瞭ということばからきている通り視認性を高める目的で作られた書体であり、字面いっぱいまでに文字が広がっています。
一方、游ゴシックや遊明朝は文字の左右と字面までの感覚に余裕があります。

おわりに

今回のNoteでは文章をデザインの力で読みやすくするためのヒントについて解説してきました。

これからもデザインについて連載していきますので、
興味のある方は次回もおたのしみに。

この記事はSUNABACOスタッフのコイアイが編集しました。
SUNABACOは全国に展開する無料でつかえる”つくりたいひと”のための場所です。
デザインに関する書籍や、音響や映像の機材、等々豊富な設備があり、誰でも気軽ご利用いただけます。
SUNABACOではデザインやプログラミングのスクールも随時受付しておりますので是非チェクしてみてくださいね。

参考


この記事が気に入ったらサポートをしてみませんか?