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