課題制作 - デザインとラフスケッチ

デザインのイメージ

  • 宿題となっている「お気に入り100選」などなから、テーマに沿った好ましいイメージを数点選んでみます
  • 宿題となっている「ラフスケッチ」のように、「トップページ」と「下位ページ」の構成を手描きしてみます
  • jQueryなどでの動きは許可しますが、Webサイトのテーマにそぐわないものは制作者側の自己満足でしかないことを自覚しましょう
  • あれもこれも盛り込んだり、理想に走りすぎたものはこの時点で軌道修正しましょう
文書構造と親和性の高いデザイン
  • グリッドシステム


ブラウザに対するレイアウト

  • 左寄せ:一般向き
  • 右寄せ:意外性
  • 中央配置:一般・企業向き
  • サイズ固定:紙媒体に近い印象を作りたいサイト向き(レイアウトが崩れない)
  • サイズ可変:ニュース・ポータルサイト向き


ページのレイアウト

  • ヘッダー・フッターメニュー型
  • 左・右メニュー型
  • 複合型メニュー


自由なレイアウト

  • イメージマップ型:1つの画像に複数のリンクを指定
  • Flash型:複雑なレイアウトも自由に表現可能

代表的なレイアウト

だるま落とし型
  • シンプルなページ向き
2ペイン型
  • メニュー数が少ないページ向き
3ペイン型
  • 情報量が多い企業ページ向き
ポータル型
1ウィンドウ型
  • 情報量が少ないページ向き