ホームページ作成のポイント−文章

文章はホームページの中心的な情報発信方法です。ポイントをつかんで効果的な情報発信が出来るようまとめました。


フォントの色
基本は白地に黒が読みやすいです。ただ真っ黒は少しきついといわれる事があります、色番号が#000000の黒です。そこで少し薄い灰色がお勧めです。色番号が#333333かあるいは#666666ぐらいです。#333333はほとんど黒ですが、#666666だと灰色っぽくなります。 見た目にやさしい色です。またあまり薄い色は読みにくいので避けたほうがいいでしょう。

強調したい時などにはその部分だけ赤くするなど、色を変えてみると目先がかわって目を引きます。あんまりあちこち色を変えすぎると逆効果なので注意です。
フォントの種類
特に文章のフォントですが、あまり変わったものにしないほうがいいのです。というのもフォントはパソコンの中にインストールしてあるもののみ使えるので、例えば素材屋さんのフリーフォントなどでサイトを作っても、他の人のパソコンには入ってないので作った通りは見えません。

デザインなどにどうしても変わったフォントを使いたい時は、画像にするなどの方法を使います。

また基本的な文字として、ゴシック体と明朝体がありますが、文字のサイズが大きい時は別として、基本的にはゴシック体が見やすく、また多く使われています。
フォントの相対指定と絶対指定
フォントのサイズの決め方には、たとえば何ピクセル(px)とかっちり決めてしまう絶対指定と、もう一つ標準のサイズに比べて何%の大きさ、あるいはホームページ作成ソフトなどだと「font size"-1"」などと指定するような相対的な指定があります。

相対的な指定にすると、読む方の都合で文字サイズを変えることが出来ます。例えばIEならば、トップメニュー部分に表示(V)とあるところを開くと、文字のサイズという項目があって変えることが出来ます。また簡単な方法としてCtrlキーを押しながらマウスのホイールを回しても変わります。

そうすると目の悪い方や高齢者も文字サイズを変えて、読みやすい大きさにする事が出来ます。よくアクセシビリティと言う言葉で表される、どんな方にも使いやすいサイト作りにそったサイトになるのです。

ただ弱点としては、フォントの大きさが変わるとデザインが崩れる場合もあります。そこでたとえば私は、崩れては困るところは絶対指定、でも文章部分は相対指定というように使い分けています。このサイトも文章部分は相対指定にしています。
文章の基本は横書き、左揃え
情報発信などのホームページではこれが基本です。中央揃えは見出し部分などには多く使われますが文章ではあまり使われません。右揃えはちょっとデザイン重視などで、雰囲気を変えたい時などに使われ、独特の感じになります。表紙などには案外効果的です。
1行の文字数
ぱっと見て把握しやすいのは1行の文字数が40字前後と言われています。あんまり短いと把握しにくく、あんまり長いと視点の動きが大きくなって読んでて疲れます。
行の高さ
行と行が、上下でくっついているとかなり見にくいです。そこで一般的には行間を空けるのが普通になっています。大体文字の大きさを100%とすると行の高さを140%以上にすると次の行との適当な間隔があいて読みやすいといわれています。CSS(スタイルシート)ならline-height:140%;と指定すれば出来ます。

最近はブログなどを見ているとかなり行間をあけているので、どちらかというと広い方が一般的になってきています。200%以上も普通に見かけます。 ちなみにスタイルシートを使うと文字の横の間隔も設定できます。文字と文字の間を広げるとゆったりした感じになります。
改行する
文章はある程度のかたまりで改行すると見やすくなります。だいたい3行前後が見やすいです。何十行も続けると見てて疲れますし、内容が把握しにくく感じます。

また段落下げといって文章のトップを1文字空けると、ここが区切りなんだなとわかる方法などもあります。ドロップキャップといって文の区切りで先頭の1文字を大きくするなどのテクニックもホームページなら使いやすいです。
(ドロップキャップはこんなの→トップ相互リンク
漢字を使いすぎない
たとえば「出来る」と「できる」では印象がかわります。難しい漢字はもとより、ひらがなですむところはひらがなにしたほうが、印象もやわらかくやさしく感じます。
箇条書きをうまくつかう
たとえば何かについてのいくつかのポイント、などの文を書きたい時は、文章で続けて書くよりも箇条書きにしたほうが良い事もあります。ただあんまり箇条書きばかりだとなんとなく殺風景になるので、要所要所で使うのがいいでしょう。
小さい文字は好かれる?
以前どこかのサイトで読んだ記事の中に、女性は小さい文字を使いたがるというのがありました。理由は・・「かわいいから」。そうかー大きくて読みやすいだけではだめかと思った次第であります。

私は基本的に標準に対して90%の指定にしてます。これ以下だとちょっとなと思いますけどでも80%ぐらいまでは許容範囲でしょう。もっと小さいのは広告ぐらいにしておいたほうが良さそうです。

TOP