設計フェーズはCacooで制作します

先週に「見本を教えてください」という要望がありましたが、Cacooが答えていますよ!Cacooにテンプレート機能が搭載されました。

Cacooテンプレートで、手軽に図をかきませんか

ワイヤーフレーム(ページ構造設計)について】
法則はありません!
制作会社であればクライアントに、
企業のWEB制作セクションであれば他のセクション(営業や企画など)に見せる時の解りやすいプレゼン資料になっていれば良いのです。

以下のサイトを参考にしましょう。
ウェブサイトの設計図 ワイヤーフレームを活用しよう
Webサイトの骨組み: ワイヤーフレームを素早く・手軽に・美しく制作する
プロジェクトメンバーが幸せになれるワイヤーフレームの作り方

【ツリー構造(ページ構造設計)について】
ページ構造にはリニア型(一本道でカートボタンに落とし込む情報商材などのページに良く在ります)やマトリクス型(サイトのリンク機能を利用してユーザーが自由にサイト内を閲覧できる方式で、ポータルサイトや大手ecサイトなどの大規模サイトがこれにあたる)、フォーク・ソノミー型(自由に関連付けをタグ付けしてリンクする方式。使用例はニコニコ動画ソーシャルネットワークなど)がありますが、皆さんは卒業制作として静的(データベースに連動しないサイト)サイトを作る訳ですから、ツリー型の一般的な小規模サイトを制作する事になります。
ツリー構造をCacooを使って図解する方法を学びましたが、もちろん解りやすい図であればテキストファイルに書かれた文字列だけでも良いわけです。下記参照
最初に設計するのはサイトマップ(rakumu corporation)

ツリー構造のページ構造設計に参考になりそうなサイトのリンクを貼っておきます。
Webサイトのツリー構造とコンテンツのメタ情報、そして、ナビゲーション
FatWire「自社Webの成功は情報アーキテクチャの在り方次第」

また、卒制で作るサイトと同じ業種のサイトの構造を調べて参考にしましょう。以下のソフトを使えばサイト構造を見ることが出来ます。
ウェブサイト・エクスプローラ
(指定されたウェブサイトの階層構造とファイル構成をエクスプローラ形式で表示するアプリ)