Webサイト制作の設計書となる構成案、いわゆるサイトマップ・ディレクトリ設計はどのように行われるのでしょうか。
Webディレクターの基礎知識として押さえておきたい情報をまとめました。
目次
Webサイトをどのように制作するのか、その設計書となる構成案がサイトマップとディレクトリマップと呼ばれるものです。
これは、Webサイトにどのようなページがあるのかをまとめた見取り図のような資料です。
Web制作に入る前に必ず作るもので、その作成を任されるのは多くの場合がWebディレクターです。企画で決定したコンテンツをどのように配置していくか、どのようにリンクさせるかを考慮しながら決定していきます。
企画の内容が固まったら、制作するホームページの構造を具体的に決めていきます。構造を決める際には、以下のようなポイントに気をつけて作業を進めていきましょう。
ホームページは階層構造となっているのが特徴。一番上がトップページ、その下に大カテゴリがあり、さらに小さなカテゴリや下層ページへとつながっていきます。この構造を一覧にしたものが「ディレクトリマップ」です。ディレクトリマップは、ページ名・階層・HTMLファイル名などで構成されています。
ディレクトリマップを作成しておけば、ページ数の多いサイトでも「どのカテゴリにどのページが格納されているのか」が一目瞭然。確認や修正などの作業もしやすくなります。
ホームページの構造を考える際には、ユーザーの導線(人の流れ)を意識することが大事。
導線がしっかり考えられていないとユーザーにとって「使いにくい」サイトとなり、Webサイト本来の目的を達成できなくなってしまいます。
サイトを訪問したユーザーにどの順番でページを見てもらったら効果がアップするか、どうしたら使いやすいかを仮説検証しながら構成を考えましょう。
Webサイト全体の構造が決定したら、それぞれのページのどこに何を配置するかを決めていきます。
ホームページを構成する要素には、ヘッダー・フッター・ファーストビュー・グローバルメニュー・サイドメニューなどがありますが、これらの配置はユーザーの見やすさ・使いやすさを第一に考えるべき。
Webサイトのメインとなるページに関しては、トップからすべてのページに移動できるように配置すると良いでしょう。この「ページの構成を書き記したもの」が、サイト構成や記事構成、またはワイヤーフレームと呼ばれます。
サイト構成(ワイヤーフレーム)を考える際、ついデザイン優先になってしまうことがありますが、ホームページで大切なのはユーザーにとって「分かりやすく、使いやすい」こと。
サイト構成を考える際は、どうやったらユーザーが使いやすいかを常に念頭に置き、情報をうまく配置していくようにしましょう。
ちなみに、ユーザーがパソコンでホームページを閲覧するときの目線は「Z」の形をなぞると言われています。そういった点も考慮しながら、情報の優先順位を考えてみてください。
繰り返しになりますが、Webサイトの構成案を考えるときは「ユーザーの目線に立つ」ことを忘れないようにしましょう。
ユーザーは何らかの課題を持ってホームページを訪問しているわけですから、必要な情報にいつまでもたどり着けないような構造はNGです。
ユーザーが目的の情報をすぐに見つけられるか、制作側が意図する目標にコンバージョン(※)してくれるかを考えながら構成案を作成しましょう。(※Webサイトの訪問者がサイト運営者の望む行動を取ってくれること)
また、なかには最初にディレクトリマップなしで制作を進める……というWebディレクターもいるようですが、ディレクトリマップはサイト制作における地図のようなもの。
これがないと全体の構造が乱れてまとまりのないサイトになってしまうことがあります。サイトコンセプトを実現するためにも、必ず最初に作成するようにしてください。
ユーザーが「使いやすい!」と思ってくれるホームページを制作するには、最初の構成案・ワイヤーフレーム作成が非常に重要です。全体の構成がしっかりできていると、ユーザーは迷わず自分の欲しい情報にたどり着くことができ、最終的な目標(お問い合わせ・購入など)にも結び付きやすくなります。
使いやすいホームページになるかどうかは、Webディレクターの作るワイヤーフレームにかかっています。デザインや技術ばかりに偏らず、ユーザー視点に立ったWebサイト・コンテンツ作りを目指しましょう。
サイトの戦略を決める重要な構成案。ここがサイト制作における屋台骨になります。
そのため私たちZenkenでは、Webサイトの構成ができた時点で、ここまでのペルソナ・コンセプト・提案内容を制作メンバー全員で確認するミーティングを行います。
Webディレクターの独りよがりなサイトになっていないか?訪れるユーザーにとってわかりやすい設計か?まとまりのないサイトになっていないか?など、さまざまな視点からメンバーが気づいた意見を出し合い、サイト構成のブラッシュアップを図るのです。
大勢のWebディレクターやクリエイターが集まり、自身が練ったサイト戦略をチェック・吟味するのは誰しも緊張しますが、それ以上に自分一人では気が回っていなかったポイントに気づけたり、サイトの深みが増し、より良いサイト設計になることを実感できたりする場でもあるんです。
「Webサイト制作ってどう進めているの?」
「Webディレクターはどんな仕事をするの?」
これを読めばイメージが掴めます!
クライアントの課題解決のために、市場を分析、ターゲットを設定して企画を練り、コンテンツを創るWebディレクター。…と言われても、「Web制作がよくわからないから、いまいちイメージが湧かない!」という皆さんに、新人Webディレクターの一日を追いかけながら、Web制作の現場やWebディレクターの仕事の一部をご紹介します♪
さとゆり
前職はラジオディレクター兼ライター。Web業界未経験でWebディレクターになり丸1年♪ガッツと取材力が武器!