mamohoのホームページ作成講座 ホームページは難しくない
mamohoのホームページ作成講座 「文字色と背景色」

ホームページは難しくない  読んでもらえる文章の書き方

文字色と背景色
横に長い文章は書かない
中央揃えの落とし穴
文字を小さくしすぎない
フォントの種類は指定しない
機種依存文字は使わない
テキストの色は統一しよう
ターゲットをイメージしよう
漢字・カタカナ・ひらがな
箇条書きを上手に使おう
適切な例を挙げる
図形や表を取り入れてみよう
文章を最後まで読ませる面白い方法

 

ホームページには 綺麗な画像を載せたり、アニメーションを
入れたりすることも重要ですが、本来はなんと言っても文章を
読んで貰う事が大切です。つまり どんなに良い文章を書いて
いても 読んで貰えないと意味がありません。

まず 読んで貰うためのポイントとして ぱっと見て解りやす
く 長く見ていても読み疲れない雰囲気を心がけましょう。

● 見やすい文字色と背景色を考える

薄い背景色に薄い文字色は読みづらいですね。
逆に濃い背景色に濃い文字色というのも同じです。
背景色との相性も考えて ほどよいコントラストを
考えてみましょう

● 文字色・背景色サンプル

見えづらい文字色と背景色の例です。
文字色と背景色を似たような色にすると 見えづらい配色に
なってしまいます。

背景色は#ffffff 
文字色は#cccccc

背景色は#ffffcc 
文字色は#ffcccc

背景色は#ffccff
文字色は#ff99cc
背景色は#ccffcc
文字色は#ccff66
背景色は#99ff33
文字色は#99cccc

背景色は#339966
文字色は#9966cc
背景色は#99ffff
文字色は#ffccff
背景色は#9999ff
文字色は#cc66ff
背景色は#663300
文字色は#003333


今度は 見やすい文字色と背景色の例です。
背景色とのメリハリがあって くっきり文字が見えますね。

背景色は#ffffff 
文字色は#
333333
背景色は#ffffcc 
文字色は#993300

背景色は#ffccff
文字色は#003333
背景色は#ccffcc
文字色は#333366
背景色は#99ff33
文字色は#660099

背景色は#339966
文字色は#ffffcc
c
背景色は#99ffff
文字色は#000066
背景色は#9999ff
文字色は#003300
背景色は#663300
文字色は#ccffff

これは好き好きがあると思いますが 基本的には 濃い背景色
に薄い文字色よりも 薄い背景色に濃い文字色のほうがいいと
思います。

あと テーブルやメニューなどを入れた時は 本来の背景色と
は別に 背景色を付けるケースもでてくると思いますが これ
も同じように 文字色と背景色を考えて色つけしましょう。

 

横に長い文章はかかない


ホームページは難しくない  読んでもらえる文章の書き方
当ホームページは リンクフリーです! 
Copyright (C) 2005. mamoho. All Rights Reserved.
掲載の記事・写真・イラストなど、すべてのコンテンツの無断複写・転載・公衆送信等を禁じます。