Webサイト制作の4ステップ – STEP2. 情報設計 –

こんにちは！ブダペスト在住Webデザイナーのみほこです。

今回はWebサイト制作のステップについて、４回に分けて簡単に説明してみたいと思います。
サイト制作を依頼したら実際どのように進んでいくのか？をイメージしやすくなっていただければと思います。

なお、当事務所では、やり取りは基本的に全てオンラインで行っております。

今日はSTEP2. 情報設計！

情報設計ってなんぞや？という方も多いと思います。
Webサイトにおける情報設計とは、サイトに訪れた人が情報を見やすいように、目的を達成できるようにするための構造を設計することです。
いわゆる整理整頓ですね。

実際に行う作業は下記になります。

1. サイトに掲載したい内容を洗い出す
2. どのようなページを作成するか決める
3. サイトマップを作成する
4. 各ページのワイヤーフレームを作成する

これらは全て、STEP1で決めた、サイトを作成する目的に従って設計されます。

例えば、お問合せがもっと欲しいのであれば、お問合せフォームまでの導線をどうするか、
お問合せをしてもらう前に見てもらいたいコンテンツは何なのか、といったところを考えて設計していくのです。

Webサイトの設計におけるサイトマップとは、このようにページがどのような配置になっていて、どこからどのようにリンクして遷移するかを、俯瞰して見れるもの。こちらを作成することによって、サイトの全体図を把握することができます。

なお、サイトのリニューアルの場合だと、問題点を洗い出すためにまず最初に現状のものを作成してから、新しく設定した目標に見合った構造に改善したものを作成する、といった流れで行うことが多いです。

ワイヤーフレームとは、掲載したい内容を実際のページにどのようなレイアウトで配置していくか決める作業です。
これは全てのページに対して作成されます。

これを作成することで、実際にページに掲載したときに、どのような順番がいいか、写真はあったほうがいいのかどうか、テキストの長さがどれくらいが適切かなどを決めることができます。

デザインというのはレイアウトありき。デザインのあとでレイアウト変更をしてしまうと、それがページの一部であっても、ものによっては丸々とデザインを変更しないといけない場合も。そういったことを防ぐためにも、ワイヤーフレームは作成しておくべきものです。

さて、こちらでWebサイトにどのような内容で掲載するかが決まってきました。
お次はデザインです。

それでは、また！