独学でゼロからウェブデザインを勉強したいです。


どんなウェブサイトを見て勉強をすればいいでしょうか?
あと、どんな本を買えばいいですか?(オフラインでも本を読んで色々参考にしたいです。)
ツールは Adobe Dreamweaver や Adobe Fireworks など、アドビのクリエイティブクラウドに入っている機能を使います。
作るサイトは、色々な商品説明やレビューをいれたアフィリエイトサイトです。
ページの配色や、サイトを作る上での最新の考え方、サイトの構成などが分かるような本や情報元(URL)が欲しいです。よろしくおねがいします。

回答の条件
  • URL必須
  • 1人5回まで
  • 13歳以上
  • 登録:2013/05/12 17:57:44
  • 終了:2013/05/12 22:13:13

ベストアンサー

id:mododemonandato No.4

mododemonandato回答回数759ベストアンサー獲得回数772013/05/12 19:29:59

ポイント500pt

本当に最新の情報を知りたいのならば、月刊雑誌を定期購読するのが良いでしょう。
最新刊を2,3冊読んで作るだけでも良いです。
web業界はトレンドのスピードが速いですから、最新のデザインも直ぐに古くなってしまいます。
常に購読していれば流行に付いて行くことも出来るでしょう。



これから勉強すると言うのならば、やはり最新の基準となるHTML5に準拠したデザインを学ぶと良いと思われます。
古いHTML4でデザインを覚えてしまうと、新しい基準に覚え直すのが大変です。
初めからHTML5で学んでおけば、その心配も要りません。

id:i59sizu8yz9w0

あー、それは知りませんでした。助かりました!

2013/05/12 20:07:13

その他の回答(4件)

id:Yacky No.1

エネゴリ回答回数1374ベストアンサー獲得回数1542013/05/12 18:45:00

いろいろ挑戦してみたい気持ちは分かりますが、まずはとほほでテキストに打ち込んで基本的な事を習得しましょう。本はその後でもいいです。
あと、アフィリエイトはTwitterからの方が簡単にできますのでそちらから試してみてはいかがですか?
http://affiliate.rakuten.co.jp/susumeru/
慣れてきたらAdobe Photoshopなどのペイントソフトで画像の加工の練習などしてみてください。
独学が厳しいようならハローワークの職業訓練学校でWebデザインの講座がないか探してみてください。テキスト代だけで済みますし、失業しているなら雇用保険の期間延長もできます。また、Adobe製品のアカデミック版(学生版)を通常版より安く購入できこともあります。
参考にどうぞ。

id:i59sizu8yz9w0

ゴメン、ちょっと趣旨から外れています。

2013/05/12 20:05:42
id:dawakaki No.2

だわかき回答回数797ベストアンサー獲得回数1222013/05/12 18:49:07

ポイント250pt

Adobe Fireworksは生産終了となりました。
デザインソフトはDreamweaverに統一した方がいいです。

デザインを学ぶにはサイトより参考書がいいです。
サイトだと知識が偏ってしまうので、基本的な知識は書籍で補うのがいいのです。

デザインはCSSがベースになります。
CSSの教科書として以下の書籍をおすすめします。



デザインが優れていても、コーディングが標準から外れては元も子もありません。
以下の参考書も併せて読みましょう。

Web標準の教科書―XHTMLとCSSでつくる“正しい”Webサイト

Web標準の教科書―XHTMLとCSSでつくる“正しい”Webサイト



Dreamweaverによるデザイン参考書として以下もお勧めです。

id:i59sizu8yz9w0

いい情報ありがとうございます。

2013/05/12 20:06:16
id:holoholobird No.3

holoholobird回答回数574ベストアンサー獲得回数1042013/05/12 19:28:39

ポイント250pt

ウェブサイトを作るには、いくつか学ぶ必要があるプログラミング言語があります。
それぞれの役割と、学ぶ方法。そして学んだらどんなことができるのかを簡単に説明したいと思います。

なお、基本的にプログラミングの勉強は複数のウェブサイトを渡り歩くよりも本を購入して学習したほうがいいです。
ウェブサイトと違って体系的に書かれてありますし、一冊は高くても2000円台で購入できます。

さらにウェブデザインを学ぶのに必要な知識を習得するのに必要な参考書は高々2冊程度です。
ですので、個人的には本の購入を検討することをお勧めしたいと思います。

では基本的な言語から説明したいと思います。

・HTML
internet explorerに文字や画像を表示する言語です。
internet explorerであるページを表示させたときに、HTML言語を使って「こんにちは。」と記述すると、画面に「こんにちは。」と表示されます。
HTMLを知らないと、ウェブサイトが作れません。

・CSS
「HTMLのように、ただ画面上に文字を並べるだけでは味気ない。」
「どうせならデザイナーの本のように、見やすくセンスあふれたデザインのウェブサイトを作りたい!」
という人が使います。つまり、サイトの「デザイン」を設定する言語です。
文字のサイズから画面の配色まで、ウェブサイトを見やすくなるように設定したいなら必要です。
ただデザインセンスが悪いと、見にくいサイトができてしまいます。

当たり前ですが、HTMLとCSSは基本的にセットです。
というよりもHTMLだけでは
http://www.ibarakiken.gr.jp/www/
http://info.cern.ch/hypertext/WWW/TheProject.html
こういうホームページしか作れません。(ちなみに上が日本最初のホームページ、下が世界最初のホームページのコピーです。)

HTMLとCSSを学ぶには、実際に手順に沿って作るのがいいでしょう。
http://www.amazon.co.jp/HTML/dp/4883375412
私はこの本を使って、手順通りにすすめました。

というのもホームページ作成系のウェブサイトは、説明不十分なところが少なからずあり、読んでて不明なことが多かったからです。
逆にこの本は説明がくどいくらいあるのですが、少なくとも読み進めていって、なぜこれがこうなるのかわからなくなることはありませんでした。

この本を一冊終わらせれば、よくあるホームページテンプレート系のウェブサイト程度なら作ることができるようになります。
しかしこの本を学習する本当の効果は、idとかclassとか、CSSの設定とかの意味が理解できるようになることです。

自分でいざ新しいウェブサイトを作ろうとするとき、必ず何かしら技術的な問題にぶち当たります。
知識がなければこの問題を解決するにはどういう検索を行えばいいのかすら理解できませんが、この本で知識を付ければ検索で簡単に解決方法を導くことができます。

ちなみに私もこの本に書かれている演習はDream weaver4を使って行いました。
Dreamweaver便利です。かゆいところに手が届くので、演習を気持ち良く進めることができました。

・PHP
ある商品の名前やユーザーの名前を検索したときに、検索結果を表示したいとします。
あらかじめ、すべての商品のホームページを作成するのは手間がかかります。
そこでどのような情報をどのような画面で表示するかをあらかじめHTMLとCSSで作成しておき、ここには商品の名前、ここには商品の説明、ここにはユーザーの名前を入れる

、などPHPで設定すると、わざわざすべての商品のページを作らなくても、PHPが一人で作ってくれます。

・MySQL
いわゆるデータベースです。EXCELみたいなものを想像してください。
これがあると、商品名、商品の情報、登録したユーザー、商品のレビューなどを効率的に検索したり、保存したり、管理できます。
PHPで商品の情報などを検索するときには、MySQLで条件を検索した後、PHPで検索結果を表示させています。


さて。PHPとmysqlに関しては、下手な説明サイトを読むよりもまずはこの本を購入して読んでみたほうが絶対にいいです。
http://www.amazon.co.jp/dp/4798119865

これを読めば、あなたがどんなサイトを作ろうと思っても、どういうプログラムを作ればいいのかが、実例付きで、分かります。
この本が一冊あれば、仮にあなたがプログラミングを全く行ったことがない素人でも、PHPとMySQLでデータベースを使ったサイトを作れるようになるうえに、セキュリティの

知識からホームページの公開方法まですべてがわかります。

基本的に、HTMLをCSSの知識があれば、あとはこの本1冊あればあなたが作りたいものはまず確実に作れます。
上級者になる場合でも、この本を理解したならどういう勉強をすればいいのかがおのずと分かるでしょう。

この本である程度理解したなら、自分でプログラムが作れるようになります。
分からないことが出てきても、この本を読み返せば大抵解決策が載っています。

それでもわからないことが出てきたら、googleで検索すれば必ず答えが出てきます。

・javascript
いわゆる、「動く」サイトを作ることができます。
ちょっと下のURLを見てください。

http://bunkai-kei.com/special/Bridge-of-Babel/
flashとは違います。flashのように読み込む時間もかからず、これだけのサイトを作ることができるのがjavascriptです。

まだあるのでいろいろ見てください。
http://makoto-tanaka.com/%EF%BD%8Aquery/119/


ちなみに、PHPとjavascriptは一般的なプログラミング言語と似た感じで記述されています。
まずPHPを学習して、そのあとjavascriptを勉強するとスムーズに……は行きませんが、いくらか楽に勉強できます。

javascriptは本を購入するのではなく、実際に自分が使いたい機能を実行するコードを探して、そのコードを改造する感じで少しずつ勉強していくのがいいです。
ちなみにjavascriptでは細かな機能を実行することができます。

こんな感じです。
http://www.webcreatorbox.com/tech/jquery-tips20/

PHPを学んだあとなら、大体どんなことを言っているのか理解することができるようになるでしょう。
分からないことがあったら、わからない部分を検索すれば、その部分が何を言っているのか理解できるようになります。
余談ですが、私はjavascriptの勉強をしているとき、コードを読んでは検索し、コードを読んでは検索し、を繰り返しましたが、なんだか英語の長文を読んでいるようだと思いました。
実際、javascriptの勉強は英語の長文を読むのに似ています。
javascriptはコード中に「関数」がとても多いため、英単語のごとく関数の意味を暗記しなければコードを読むことができないからです。


javascriptは上記4つの言語を学習した後に、余裕があれば少しずつやるような形で進めるといいと思います。

がんばってください。

id:i59sizu8yz9w0

かなり丁寧にありがとうございます。

2013/05/12 20:06:56
id:mododemonandato No.4

mododemonandato回答回数759ベストアンサー獲得回数772013/05/12 19:29:59ここでベストアンサー

ポイント500pt

本当に最新の情報を知りたいのならば、月刊雑誌を定期購読するのが良いでしょう。
最新刊を2,3冊読んで作るだけでも良いです。
web業界はトレンドのスピードが速いですから、最新のデザインも直ぐに古くなってしまいます。
常に購読していれば流行に付いて行くことも出来るでしょう。



これから勉強すると言うのならば、やはり最新の基準となるHTML5に準拠したデザインを学ぶと良いと思われます。
古いHTML4でデザインを覚えてしまうと、新しい基準に覚え直すのが大変です。
初めからHTML5で学んでおけば、その心配も要りません。

id:i59sizu8yz9w0

あー、それは知りませんでした。助かりました!

2013/05/12 20:07:13
id:amai_melon No.5

amai_melon回答回数2011ベストアンサー獲得回数472013/05/12 21:41:06

以下の本はいかがですか。

Dreamweaverレッスンブック Dreamweaver CS6/CS5.5/CS5/CS4対応 (-)

Dreamweaverレッスンブック Dreamweaver CS6/CS5.5/CS5/CS4対応 (-)


id:i59sizu8yz9w0

うーん、その情報はぐぐれば普通に出てくるからダメ。

2013/05/12 21:54:55

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

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

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

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

絞り込み :
はてなココの「ともだち」を表示します。
回答リクエストを送信したユーザーはいません