株式会社 dowonders

by mochi

Webページの文章の見せ方

スタッフのmochiです。
Webページを構成する要素を大きくまとめると、文章と画像(イメージ)の2つになります。
ページの内容をしっかり見て欲しい場合はこのどちらも充実させていくことが必要です。
文章内容を充実させようとすると、どうしても文字の量が多くなっていきますよね。
沢山ある文字をただ記載するだけだと見づらくなってしまい、見ている人には少しストレスになってしまいます。
せっかくいい文章を作成しても内容を読んでもらえないと元も子もないので、見やすくする工夫が必要です。

今回は文章の見せ方に着目して、
読みやすい・見やすいページにするには何に気をつけていけばいいのか、
簡単に取り入れられる注意点を記事にしていこうと思います!

見出しと文章でまとめる

パッと見て何について書かれているかをわかりやすくするために、文章内容のまとまりごとに見出しを作成します。
見出しと文章を1グループとして分けることで、できるだけストレスなく読めるようにできます。
見出しと文章で文字の大きさを変えたり、見出しにアイコンやボーダーをつけることでメリハリを出す工夫をするとよりわかりやすいです。
文字量が多くなるほどギュっと詰まって見えてしまって窮屈な印象を与えてしまいますよね。
その窮屈さを解消するために見出しと前文の最終行の間には大きめの余白を空けるなど、余白の工夫をすると少し読む負担が軽減されます。

箇条書き・リストを活用する

内容によっては箇条書きで表示し、情報を整理した方がわかりやすい場合があります。
Webサイト作成作業の流れを説明する場合を例にしてみましょう。

例)文章の場合

Webサイト作成作業の流れは、以下のとおりです。
まず最初にお客様とヒアリングをして何が必要かを割り出します。
それからサイトマップを作成してページ数と必要原稿を割り出し、ワイヤーフレームを作成してレイアウトを決定します。
ワイヤーフレームが決定したらデザイン案を作成してデザイン決定後に公開用のページのデータをコーディングしていきます。


例)箇条書きの場合

Webサイト作成作業の流れは、以下のとおりです。
1.お客様とヒアリング
2.サイトマップの作成(ページ数・必要原稿の割り出し作業)
3.ワイヤーフレーム作成・レイアウト決定
4.デザイン案作成
5.コーディング(公開するデータの作成)


上と下なら下の方がパッと見て流れがわかりやすいですよね。
箇条書きにする場合はずらずらと文章にするよりも、簡易的な内容にまとめる方が良いと考えます。
補足情報が必要なら、箇条書きの後に文章を足すような形で情報を整理すると見やすさがぐっと上がります。

文字を飾りすぎない

目立たせたい場所を太字にしたり、文字色・背景色を変更をすることがあると思います。
あれもこれも!と色を変えたり太さを変えすぎると、見づらくなってしまうので注意が必要です。
特に長い文章の中でいくつも色や太さを変えて表現すると、ちょっと騒がしい感じになってしまいます。
楽しい雰囲気を出したい場合は良いのですが、そうでない場合は、統一感を持たせることをお勧めします。
目立たせたい場所の飾りを赤で統一するなど同じにすることで、重要な点がわかりやすくなります。
文章内容に合った表現で文字を飾りましょう。

以上、簡単に取り入れられる注意点をの見せ方について紹介しました。
ページ作成を考える時に是非取り入れてください!

TEL&Mail

営業時間:10:00〜19:00
(電話受付時間:10:00〜18:00迄)