Webデザイン基礎知識・Web製作支援サイト|小道具屋|

ウェブデザインサイト・小道具屋
文字サイズ変更  文字サイズ拡大 文字サイズ縮小 元に戻す
Webサイトを構築する全ての人のために。
小道具屋サイト開催1999/09/06 HOMEに戻る Webサイトの顔であるindexを考えてみましょう。 デザインにはコツがあります。コツさせ掴めば結構簡単かも? ユーザーをコンテンツに導くナビゲーションはしくじると使いにくいサイトになります。 デザインとは直接関係ないですが小技を紹介。 ブログ ご連絡・お問い合わせはコチラまで。

小道具屋管理人・ごあいさつ デザインを考える前に・はじめに WEBサイトの顔・トップページ 大きさや容量・サイズ 色の持つちからは重要・カラー

さてWebサイトを作るのには何から始めましょうか?いきなりオーサリングソフト(ホームページ作成ソフトのこと)を立ち上げて書き始めると失敗する可能性があります。よっぽど明確なデザイン案が無いのであれば、まずは机上でデザイン案を練ることが、成功への近道です。


サイトテーマを決めましょう
じっくり練り上げて、よりよいサイト作りを。

サイトテーマが無ければ始まらない
テーマはもうお好きな物をどうぞ。しかし色々なテーマを最初から盛り込もうとしても上手く行かないのでテーマは1つにしておいた方が無難でしょう。ここで言うテーマとは、例えば”車”と”食べ歩き”とか、”政治”と”写真”とかジャンルが違う場合はサイト自体を分けた方が良いです。同じジャンル”ラーメン”と”お寿司”とか”車”と”バイク”などは1つのサイトでも問題はないでしょう。


ページネーション(設計図)を作りましょう
JavaScriptによるリンク先です:画像拡大拡大[16KB]

ページネーション(設計図)を作りましょう
まだページデザインの設計では無く、フォルダ構成の設計です。htmlファイルやパーツ(gifやjpg)などを同じルート上に置いてしまうとパーツ点数が多くなったときに非常に分かりにくくなってしまいます、私の場合は作成を始める前に左記のようにフォルダを作ってしまいます。ちょっと見にくいのですが、左上から、cgi、icon、img、news、original_png、一時パーツ、cssファイル、indexファイルなど必要と思われるパーツの保存先を作って起きます。これは各人好きな(分かりやすい)名前でOKです。だたしアップロードするフォルダには日本語は使ってはいけません。UNIXサーバーは日本語を解釈出来ませんので。


ラフスケッチを作りましょう
JavaScriptによるリンク先です:画像拡大拡大[12KB]

ラフスケッチを作りましょう
えっ?っと思われるかもしれませんが、サイトテーマ及び設計図が決まりましたらパソコンの電源を入れる前に、紙と鉛筆を用意しましょう。方眼紙を用いてキッチリ描くデザイナーさんも居ますがそこまで必要無いでしょう(描けたら描いた方が良いのでしょうが)気に入るまで何枚も書いて見ましょう。その際に画像やアイコンのパーツサイズも書いておいた方が後々楽です。ここで一つ注意ですが、次ページの【トップページ】にも記述しますが、そのサイトはコンテンツがドンドン増えて行くサイトですか?最初に考えたコンテンツ以外は増えないって言うサイトは良いのですが、増えて行く予定ならページの拡張性も考えてラフスケッチしましょう。
最近では、紙へのスケッチではなくFireWorks上でやることが多くなってきてます。(左図参照)