WEBデザインのセンスを身につけるにはどうしたらいいですか?

参考になるWEBサイト、書籍などがあったら教えてください

回答の条件
  • URL必須
  • 1人2回まで
  • 登録:
  • 終了:2007/01/25 22:18:14
※ 有料アンケート・ポイント付き質問機能は2023年2月28日に終了しました。

ベストアンサー

id:toguo No.3

回答回数72ベストアンサー獲得回数3

ポイント21pt
  • デザインが優れているサイトのソースを見る
  • 真似して作って見る

この繰り返しをしていく。

真似をしてみる時も最初は全部真似になってしまったりすると思いますが、その中から文字詰めとかいろんなテクニックを盗めると思います。

デザインの優れているサイトを見つけられない、もしくは見つけたとしても自分の判断に自信が無い場合は

Web Creme | Web design inspiration

CSSElite CSS Gallery - css gallery, website design gallery, web design resources, css design gallery

とか見てみたり、はてなブックマークから探してみるのもよいかもしれません。大体「CSS」「Webデザイン」とかのタグが入っていると思いますので、その中からブックマーク数の多い中に参考になるサイトがあるのではないでしょうか。

書籍に関しては多々あると思いますし、つい自分の経験を押し付ける形でしか薦める事が出来ないものだと思うので、Amazonとはてなのレビューを参考にしてから、実際に本屋で確認することをおすすめします。

以上、参考になれば幸いです。

id:pink-dark

回答ありがとうございます

2007/01/25 21:51:51

その他の回答14件)

id:SALINGER No.1

回答回数3454ベストアンサー獲得回数969

ポイント15pt

CSSをうまく使っているサイトを参考にするといいですね。

http://www.designlinkdatabase.net/

id:pink-dark

回答ありがとうございます

2007/01/25 21:51:43
id:you-pon No.2

回答回数1004ベストアンサー獲得回数23

ポイント15pt

Webデザイン講座

http://www.2uwebdesign.com/lecture/index.htm

色んなサイトを見て回り、自分の気に入ったデザインを参考にするのが一番良いと思いますよ。

id:pink-dark

回答ありがとうございます

2007/01/25 21:51:46
id:toguo No.3

回答回数72ベストアンサー獲得回数3ここでベストアンサー

ポイント21pt
  • デザインが優れているサイトのソースを見る
  • 真似して作って見る

この繰り返しをしていく。

真似をしてみる時も最初は全部真似になってしまったりすると思いますが、その中から文字詰めとかいろんなテクニックを盗めると思います。

デザインの優れているサイトを見つけられない、もしくは見つけたとしても自分の判断に自信が無い場合は

Web Creme | Web design inspiration

CSSElite CSS Gallery - css gallery, website design gallery, web design resources, css design gallery

とか見てみたり、はてなブックマークから探してみるのもよいかもしれません。大体「CSS」「Webデザイン」とかのタグが入っていると思いますので、その中からブックマーク数の多い中に参考になるサイトがあるのではないでしょうか。

書籍に関しては多々あると思いますし、つい自分の経験を押し付ける形でしか薦める事が出来ないものだと思うので、Amazonとはてなのレビューを参考にしてから、実際に本屋で確認することをおすすめします。

以上、参考になれば幸いです。

id:pink-dark

回答ありがとうございます

2007/01/25 21:51:51
id:sadajo No.4

回答回数4919ベストアンサー獲得回数49

id:pink-dark

回答ありがとうございます

2007/01/25 21:51:54
id:zaji999 No.5

回答回数73ベストアンサー獲得回数1

ポイント13pt

http://book.mycom.co.jp/book/4-8399-1501-6/4-8399-1501-6.shtml

スタイルシートスタンダードデザインガイド。

CSSの使い方が良く分ります。

id:pink-dark

回答ありがとうございます

2007/01/25 21:51:57
id:tekenaar No.6

回答回数343ベストアンサー獲得回数15

ポイント13pt

プロセス オブ ウェブデザイン 企画からデザインへ 落とし込みの技術

プロセス オブ ウェブデザイン 企画からデザインへ 落とし込みの技術

  • 作者: WEB CREATORS LAB.
  • 出版社/メーカー: 翔泳社
  • メディア: 大型本

ゼロから始めるWebデザイン

ゼロから始めるWebデザイン

  • 作者: 高橋 晃
  • 出版社/メーカー: 西東社
  • メディア: 単行本

伝わるWeb文章デザイン100の鉄則

伝わるWeb文章デザイン100の鉄則

  • 作者: 益子 貴寛
  • 出版社/メーカー: 秀和システム
  • メディア: 単行本

WEBに限らず、デザインにおいてカラーセンスを身に着けることも必須です。

Webカラーコーディネート―セーフカラーによる配色完全ガイド/「カラーイメージチャート」準拠

Webカラーコーディネート―セーフカラーによる配色完全ガイド/「カラーイメージチャート」準拠

  • 作者: 南雲 治嘉
  • 出版社/メーカー: グラフィック社
  • メディア: 単行本

Webセーフカラー・デザイニングノート―Webカラーコーディネート事典

Webセーフカラー・デザイニングノート―Webカラーコーディネート事典

  • 作者: 山口 敬
  • 出版社/メーカー: 秀和システム
  • メディア: 単行本

id:pink-dark

回答ありがとうございます

2007/01/25 21:52:01
id:kennzi9 No.7

回答回数1956ベストアンサー獲得回数9

id:pink-dark

回答ありがとうございます

2007/01/25 21:52:05
id:takahiro23 No.8

回答回数22ベストアンサー獲得回数3

ポイント12pt

周りのウェブデザイナーの人はMDN関連の書籍・雑誌はとても参考になると言っていました。

プロとして恥ずかしくないスタイルシートの大原則

プロとして恥ずかしくないスタイルシートの大原則

  • 出版社/メーカー: MdN
  • メディア: ムック


MDN のサイト

http://www.mdn.co.jp/

id:pink-dark

回答ありがとうございます

2007/01/25 21:52:09
id:kudo3 No.9

回答回数2ベストアンサー獲得回数0

ポイント11pt

いろんなデザイン商品をみたりして参考にすることが必要でしょうね。

例えば、

http://www.ddnj.com/product/hp/artweb/lineup.html

とか。

あとは、見やすいサイトを自分で集めてみて、

特徴を見つけてみることですかね。

大体は、変にHTMLでキレイに見せようとせず、

大胆に画像を利用しているサイトが見やすくキレイだったりします。

id:pink-dark

回答ありがとうございます

2007/01/25 21:52:12
id:fusuma321 No.10

回答回数43ベストアンサー獲得回数2

ポイント13pt

↓ココなんかを定期的に見るとイイかもです。

デザインサイトのデータベース

id:pink-dark

回答ありがとうございます

2007/01/25 21:52:15
id:akkk No.11

回答回数395ベストアンサー獲得回数6

ポイント18pt

まずは、IllustratorやFireWorks等で、ラフを作る練習をしてみてはどうでしょう。

その際、まず大前提として見出しを揃えるということです。

デザイン性が無いページはほとんど中央揃えにしていて、見づらいことこの上ありません。

また、例えば4枚の画像があったとして、それらの高さと幅を揃えることも重要です。

これだけで前々見栄えが違います。

ボタンや見出しのロゴなどはほとんどが画像です。

何でもかんでも画像にしてしまうのは良くないことですが、画像の方が見栄えが良いのは確かです。

この辺はプロのサイトをDLしてみて、どのようなところを画像にしてるのか、cssでデザインしているのか、HTMLでデザインしているのか、等を参考にしてみることは大変勉強になります。


あとは配色ですが、慣れない内は、無理に色を使おうとせず、白~灰色~黒のグレースケールだけを使って制作してみましょう。

IllstratorやPhotoshop等をお持ちでしたら、グラデーションを使ってみるのも良いでしょう。配色については、既に勉強なさってたらすみません。


個人のサイトならともかく、仕事として会社やお店のサイトを制作する場合、デザイン性よりも見易さ、わかりやすさです。

レイアウトも配色も、それらを考慮した上で決まります。

下手なデザインサイトを見るよりも、↓のサイトが一番参考になると思いますよ。


http://www.ikesai.com/

id:pink-dark

回答ありがとうございます

2007/01/25 21:52:20
id:tmoriya No.12

回答回数7ベストアンサー獲得回数0

id:pink-dark

回答ありがとうございます

2007/01/25 21:52:22
id:iw9876 No.13

回答回数4ベストアンサー獲得回数0

ポイント13pt

css Zen Garden:CSS デザインの美

このサイトは、あらかじめ用意されたHTMLファイルを元に、

CSSのみを使ってデザインを変化させています。

右側のリストからデザインを選ぶと、

http://www.csszengarden.com/tr/japanese/?cssfile=/197/197.css&am...

このようにデザインが変わります。

すべてCSSのみで変化させており、また、いろいろな人のデザインが見られので、参考になるかと思います。

id:pink-dark

回答ありがとうございます

2007/01/25 21:52:26
id:gessan No.14

回答回数154ベストアンサー獲得回数1

ポイント13pt

http://www.oswt.co.uk/

オープンソースのWebデザインテンプレート。

出来がいいので。

id:pink-dark

回答ありがとうございます

2007/01/25 21:52:31
id:hisatobb No.15

回答回数3ベストアンサー獲得回数0

ポイント18pt

大手企業サイトを業種別で集めているサイトです。

BestDesign.org


WEBサイトを作るうえでの根本的な考え方を知るという点で、とても参考になります。

WEBデザインは見た目だけではなく、ユーザビリティなど

ユーザーに立った目線でデザインをすることでセンスが身につくのではないかと思います。

ウェブユーザビリティの法則―ストレスを感じさせないナビゲーション作法とは

id:pink-dark

回答ありがとうございます

2007/01/25 21:53:24

コメントはまだありません

この質問への反応(ブックマークコメント)

トラックバック

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

回答リクエストを送信したユーザーはいません