先週に引き続き，今週も設計について扱います．先週Webサイト全体の構造設計を行ったのに対し，今週は1つのページ単体の設計について学びます．

Webページは，内容が適切に伝わり，かつ使いやすくなるよう設計されることが望ましいと言えます．おおまかな手順としては，以下の通りです．

1. 皆さんがページで伝えたい情報を，どのような要素によって表現していくのかを考えます．要素というのは，文章や画像，アイコンやボタン，リンク，箇条書き，見出しなどのことです(例えばこの教材では，主に文章とそれを補う画像によって情報を伝達しています)．
2. 要素をページ中にどのように配置するかについて考えます(すなわち，ページのレイアウトを行うことです)．

Webページの設計は，単に見栄えのよい，格好の良いページを作るために行うのではありません．映像や画像を派手に使った華美なページは確かに人目を引きますが，往々にして読み手のことを考慮していない使いづらいページになってしまいがちです．映像や画像はうまく使うことができれば非常に効果的ですが，ページが表示されるまでに時間がかかるなど欠点もあります．自分が伝えたい情報を伝えるためにはどのようなレイアウトが適しているか，様々なページを参考にしながら考えてみましょう．

以下に，一般的なページ設計のガイドラインを提示しますので，参考にして下さい．合わせて，→6.4 Webサイトの批判的閲覧 で利用したチェックシートも参考にしてみましょう．

(出典：「学校で教わっていない人のためのインターネット講座」，有賀妙子・吉田智子著，北大路書房，1999，p100)

・閲覧対象者

閲覧対象者によって，ページのレイアウトは違ってきます．同じ内容を伝えるのでも，対象が大学生であるか小学生であるかによって，表現方法は異なります．対象者として外国人を想定している場合には，日本語以外の言語にも対応する必要があります．

・一貫性

なるべく，全ページにわたって一貫性のあるレイアウトにしましょう．毎ページ異なったレイアウトでは，読むほうは疲れてしまいます．

・バランス

一般的に操作性と読み易さのバランスをとるために，わかりやすい文章とそれを補う比較的小さな画像を用いたレイアウトを行うべきです．読み手は皆さんのページをくまなく読んでくれるとは限りません．そこで，最も伝えたいことが伝わるように，読み手の注意を適切に導く必要があります．しかし，読み手の注意を引くために大きな画像などを用いると，ページの読み込みに時間がかかるなどページの操作性は低下してしまいます．最高でも10秒以内にはページが表示されるようにしましょう．

・色のコントラスト

読みやすいページにするために，背景色は薄い色を選び，文字は背景上でもはっきりとわかりやすい色にします．

・強調

視覚的な強調(大きな文字，画像，線など)は控えめに使いましょう．ページの多くの部分に強調を使いすぎると効果がないだけではなく，雑然とした印象を与えてしまいがちです．よく考えてから使いましょう．

・ページの長さ

長いページの場合，スクロールしないと全てを見ることができません．あまりにもスクロールの幅が大きいと，ページは使いにくくなってしまいます．ページの長さはその内容によって様々ですが，一般的には印刷した時に1〜3ページ程度に収まるくらいが適当であるとされています．

・ページの横幅

画像などがブラウザのウィンドウ幅を超えてしまうと，読み手は横スクロールを強いられることになります．横スクロールは非常に面倒な作業です．画面サイズが小さな場合でも，横スクロールを必要としないような設計を心がけます(横幅の大きな画像や表組みは使わないなど)．

文章が全くないというページもありますが，Webページで情報発信を行う際に最も使われる要素は文章です．また，Webページ上の文章を読むことは，本を読む以上に疲れます．それゆえに，Webページを作成する際には，わかりやすい文章(＝構造化された文章)を書くことが特に重要になります．→9.3 情報の構造化 では，情報の構造化の例として，構造化された文章の作成方法について解説を行います．