ホームページ作成とアップロード/Webデザイン
提供: Internet Web School
(版間での差分)
(→概要) |
|||
| 8 行: | 8 行: | ||
次のような項目についてあらかじめ決めておくことが必要です。 | 次のような項目についてあらかじめ決めておくことが必要です。 | ||
| - | + | ===(1) ページの接続関係=== | |
| - | + | *一番トップになるページはどのようなものか？ | |
| - | + | *そこから直接リンクして飛べるページは何と何か？ | |
| - | + | *それらから更に飛べるページは何か？ | |
| - | + | *全体の接続関係を矢印を使った線図で表すとよい。 | |
| - | + | ||
| - | + | ||
| - | + | ||
| - | + | ||
| + | ===(2) 各ページの特別な機能は？=== | ||
| + | *閲覧している人がデータの入力ができる（買い物の時の配送先など） | ||
| + | |||
| + | ===(3) 各ページの基本構成を決める。=== | ||
| + | *全体の配色は？ 背景の色、背景の分割。それらの配色。 | ||
* [[wikipedia_ja:配色|配色(Wikipedia)]] | * [[wikipedia_ja:配色|配色(Wikipedia)]] | ||
| - | + | ===(4) メニューの形と並べる位置=== | |
| - | + | *左にたてに並べて配置するか、上部に横に配置するか？ | |
| - | + | *メインのロゴ配置と形。多くは左上 | |
* [[ロゴタイプ(Wikipedia)>wikipedia_ja:ロゴタイプ]] | * [[ロゴタイプ(Wikipedia)>wikipedia_ja:ロゴタイプ]] | ||
| - | + | ===(5) メインの写真=== | |
| - | 文章ブロックの個数と位置。文字の色、大きさ、フォント。 | + | *使うとしたらその位置。 |
| - | + | *文章ブロックの個数と位置。文字の色、大きさ、フォント。 | |
| - | またロゴに加えて、発信者のシンボルとしての画像データを入れることもある。 | + | *またロゴに加えて、発信者のシンボルとしての画像データを入れることもある。 |
| - | + | ||
* [[シンボル(Wikipedia)>wikipedia_ja:シンボル]] | * [[シンボル(Wikipedia)>wikipedia_ja:シンボル]] | ||
| 38 行: | 38 行: | ||
例えば次のページはフォントの提供者であると同時に、そのホームページが種々のフォントをうまく使ったデザインをしている、とあどいう意味で参考になります。英文のページであるすが、見てわかると思います | 例えば次のページはフォントの提供者であると同時に、そのホームページが種々のフォントをうまく使ったデザインをしている、とあどいう意味で参考になります。英文のページであるすが、見てわかると思います | ||
| - | http://www.emigre.com/ | + | * http://www.emigre.com/ |
このページには、３Dのフォント、マウスを持ってゆくと表示される図柄（次章以下のジャバスクリプトを後で参照）など機能的な仕組みもなされています。 | このページには、３Dのフォント、マウスを持ってゆくと表示される図柄（次章以下のジャバスクリプトを後で参照）など機能的な仕組みもなされています。 | ||
2012年6月27日 (水) 05:14時点における版
ホームページ作成とアップロード ＞ Webデザイン
目次 |
概要
Webページのデザインにはどのようなことを留意したらいいでしょうか？
次のような項目についてあらかじめ決めておくことが必要です。
(1) ページの接続関係
- 一番トップになるページはどのようなものか？
- そこから直接リンクして飛べるページは何と何か？
- それらから更に飛べるページは何か？
- 全体の接続関係を矢印を使った線図で表すとよい。
(2) 各ページの特別な機能は？
- 閲覧している人がデータの入力ができる（買い物の時の配送先など）
(3) 各ページの基本構成を決める。
- 全体の配色は？ 背景の色、背景の分割。それらの配色。
- 配色(Wikipedia)
(4) メニューの形と並べる位置
- 左にたてに並べて配置するか、上部に横に配置するか？
- メインのロゴ配置と形。多くは左上
- [[ロゴタイプ(Wikipedia)>wikipedia_ja:ロゴタイプ]]
(5) メインの写真
- 使うとしたらその位置。
- 文章ブロックの個数と位置。文字の色、大きさ、フォント。
- またロゴに加えて、発信者のシンボルとしての画像データを入れることもある。
- [[シンボル(Wikipedia)>wikipedia_ja:シンボル]]
またロゴの文字や、ブロックごとの見出し、ページの本文中のフォントも何にするか検討が必要です。
- [[フォント(Wikipedia)>wikipedia_ja:フォント]]
例えば次のページはフォントの提供者であると同時に、そのホームページが種々のフォントをうまく使ったデザインをしている、とあどいう意味で参考になります。英文のページであるすが、見てわかると思います
このページには、３Dのフォント、マウスを持ってゆくと表示される図柄（次章以下のジャバスクリプトを後で参照）など機能的な仕組みもなされています。
その他の写真やリンクの位置
