Web技術実習
	戻る〔２４．フレーム〕　次へ〔２６．Webプログラミング〕　目次

２５． Webサイトの構成 □□□□□□□□□□□□□□□□□□□□□□■■□□■

　複数のWebページの集合体である「サイト」を構成していく方法は様々である。一つ一つのWebページ（コンテンツ）を作成してから一つにまとめていく方法、逆に、メニュー的なものから考えてからコンテンツを作成していく方法など、制作者の数だけ方法があると言ってよいかもしれない。
　ここでは、一般的なWebサイトの構成方法について学習する。

25-1 ワークフロー

　ワークフローとは、作業の内容や順序を検討して作成される「手順書」である。Webサイト構築の一般的なワークフローを次に示す。

・図のように、Webサイト完成後、公開して終わりではない。（フィードバック）
・Webページ制作会社などではコンテンツ作成とシステム設計・構築が平行して行われるケースがある。

25-2 サイトマップ

　サイトマップ(sitemap)とは、Webサイト全体の地図である。Webサイトの構成を考えるとき、次の図のような形でリンクの関係などを表し、全体を考える資料とする。このとき、ユーザが目的のWebページに早くたどり着けるように階層はあまり深くしない方がよい。

　もう一つ、Webサイト内にあるすべてのWebページへのリンクを一覧にしたWebページもサイトマップと呼ばれる。

Webサイトに必要なページ

ほとんどの個人のWebサイトには“トップ”、“自己紹介”、“リンク”、“掲示板”のページが用意されている。しかし、Webサイトを制作していくとき、最低限必要なWebページ（内容）は何か、答えは…？「それは“トップページ”である。」と、これではあっけなすぎるので ………。 　正確には、プランニングのときに考え、検討した内容すべてが必要なページということになる。したがって、プランニングのときに「どんなWebサイトを、なぜ作るのか」というポイントをしっかり押さえて、目的を達成するために必要な内容が「Webサイトに必要なページ」ということになる。“自己紹介”、“リンク”や“掲示板”が必ずしも必要とは限らない。

25-3 ストーリーボード

　ストーリーボード(storyboard)とは、絵コンテのことである。演劇やアニメーションなどでは、紙芝居のように場面ごとのイメージ図とせりふで、どのように展開していくかを表す。
　Webページでは、ページタイトルと文章・画像などを配色・レイアウトも含めて表していく。これがWebページの制作設計図となる。ラフスケッチ程度でよい。

25-4 素材収集

　ストーリーボードが完成したら、Webページを制作していくための素材（文章や画像など）を準備していく必要がある。

・注意点

・文章は簡潔にする。
・文章には、「誤字・脱字」や「あいまいな表現」がないこと。
・文字の大きさや色を段落ごとに統一する、あるいは変化を持たせる。
・文章と画像などの配置のバランス、分量のバランスを適切にする。
・文章の説明より図の方がわかりやすいときは、図を準備する。
・デジカメで撮った写真などは、必要な部分だけを取り出す（トリミング）。

25-5 Webサイト制作スタッフ

　個人がWebサイトを制作するときは、これまでの学習内容を一人で進めていかなければならない。会社組織やWebサイト制作会社などでは複数のスタッフが役割を分担して制作している。次に、主なスタッフの役割を示す。

・Webプロデューサ

　プロジェクト（Webサイト制作）全体のまとめ役である。スタッフをそろえる。スケジュールを調整する。全体の進行を管理する。
 

・コンテンツ開発チーム
　　・アートディレクタ

　コンテンツ開発チームのまとめ役である。Webページ全体を構成する。

　　・Webデザイナ

　Webページのデザインを担当する。Webページ全体を作成する、あるいは、デザインだけ行い、HTMLファイル制作などはオペレータに任せる。

　　・ライタ

　文章作成を担当する。テクニカル、ノンフィクション、エッセイなど、ライタには得意とする専門分野がある。

　　・イラストレータ

　イラスト、ロゴ、イメージキャラクタなどの作成を担当する。
 

・システム開発チーム
　　・システムエンジニア

　システム開発チームのまとめ役である。システムの回線設計、サーバの構築、プログラムの設計などを行う。

　　・プログラマ

　ソフトウェアの制作を担当する。

戻る〔２４．フレーム〕　次へ〔２６．Webプログラミング〕　目次
Web技術実習	Copyright © 2006,2007 Hiroshi Masuda