ホームページビルダーかDreamwaverか

質問

こんにちは。情報系について勉強している大学生３回生です。

今回は趣味というか独学と言うかでホームページ関係の勉強をしようと思っています。
基本はCやPerlなのでHTMLとJavaScriptについては１回生の授業で初歩的なことは習っていますがせいぜい３週間程度しかやってません。
知識的にはタグの意味さえしっていれば読める程度です。（会社のHPは複雑すぎて読めませんが・・・)
最近授業でCSSやXML、XHTMLについて習い、興味がわいたのでマスターは無理でもある程度は使いこなせるようになりたいと思い、独学で学習しようと考えた次第です。
そして都合よく地元の趣味集まり(情報系は私のみ)のHPを作ろうということにもなったのでそれを作りつつ勉強しようと考えています。(つまりサーバは借り物)
そこで、手打ちでもよいのですがかなり時間がかかりそうなのでHP作成ソフトを購入しようと考えています。
で、出来上がりを読みながら理解を深めようという若干手抜きの考えです。だらけててすいません。
そして、タイトルどおり、どちらのソフトがいいでしょうか？？
以前にも似たような質問はいくつかなされていて各ソフトの性質や特徴は読みましたが私のようなケースはちょっとなかったので個人的な質問になりますが私の場合はどっちが向いているかということを教えてほしいのです。(“アドバイス”と表現するとアンケートカテゴリになるかもしれませんのであえて“教えて”で)
特に、CSSについて知識と技術を深めたいと思っています。
また、将来のためにHP作成ソフトを使えるようにするというねらいも含んでいるのでお金はかかりますが購入型のソフトにしようということも考えています。
さらに、その後は独学なので本を読み読み勉強をしようと考えています。ソフトを使いこなすという意味でお勧めの本があれば教えてください。HTMLやCSSについては別の本で学ぼうと考えています。
こんな欲張りな私ですが、なにとぞよろしくお願いします。

回答No.5

神崎 渉瑠（@taloo） · ベストアンサー

オーサリングソフトよりも、HTMLやCSSの文法を勉強して、
いわゆる手書きした方がいいのでは？

オーサリングソフトの使い方を覚えても
”オーサリングソフトの操作->ブラウザでどんな表示になるか->HTMLタグはどのように書かれているか->タグの意味を調べる”
という４段階を踏むことになりますし、通常、オーサリングソフトはHTMLを知らなくても作れる様な仕組みになっています。
つまり、”オーサリングソフトの操作->ブラウザでどんな表示になるか”で作れる仕組みです。

タグを直接覚えれば、
”HTMLタグの意味を覚える->ブラウザでどんな表示になるか”
という２段階で済みますから、HTMLを覚えるにはその方が早いです。

実際に勉強すべきなのは、表示がどうなるかではなく、タグの意味。
<h1>を使うと太字、大文字で表示されるという覚え方は全く無意味で、
小文字や斜体で表示することもできます。
それがスタイルシートです。

> 出来上がりを読みながら理解を深めようという若干手抜きの考えです。
それは手抜きではなく誰もがやることです。
仕上がりを見ないのが手抜きです。

「HTML/XHTML解説」としておすすめできるサイトや書籍はありません。
言語仕様書は比較的上級者向けだと思います。
http://www.w3.org/2005/11/Translations/Lists/OverviewLang.html#ja
（全部読めというわけではなく、下の方のHTML/XHTML、CSSに関する部分だけです。
余力が有ればアクセシビリティーについても。）
http://www.asahi-net.or.jp/~sd5a-ucd/rec-html401j/cover.html

「タグ辞典（英和辞典ならぬタグ和辞典、いわゆるリファレンス）」としてのサイトならたくさんあるんですけどね。
要するに仕様書を書き直したサイトです。
「HTML リファレンス」で検索するとたくさん出てきます。
見やすさは個人差がありますから、見やすいデザインの所を探してみてください。
http://www.tohoho-web.com/www.htm
http://www.scollabo.com/banban/index.html （HTML基礎編）
http://www.tagindex.com/index.html

お礼

貴重な意見、ありがとうございます。
手書きの方が覚えるための工程が少ないですね。難点はそれなりのものを作るまでにはある程度の時間が掛かるということですね。
長い目で見れば手書きの方が成長が早いかもしれません。

文法書については私は言語に限らず、なんだかやたらにリアルな動物の絵が表紙の本(メーカー覚えてないのですが)を使っていました。
詳しいと言うのは間違いないと思うのですが、学ぶという視点からするとお勧めできない本ですか？

回答No.9

神崎 渉瑠（@taloo）

長くなってきたんで簡単に。

.NET Framework（旧MFC）を使うか、WindowsAPIを使うか、そんな感じです。
ダイアログ１つ出すのにも.NET Frameworkなら１行ですみますが、
.NET Frameworkでできないこまかな設定を出せるようにするには、WindowsAPIを直接呼び出さないと行けませんし、
なにより.NET Frameworkの使い方を勉強し、.NET環境でなければ使えません。つまり、bcc（Borland）では使えない、と。
同様に、Dreamweaverを覚えてもExpressionWebは使えません。

> 必要スペック
いや、もうこれは体験版をインストールして動かしてみて下さいと言うしか、、、

> CPUが遅くて使用率50%程度ですけど。
これ自体が怪しいです。
アプリケーションを起動・終了時、DirectXを使ったゲームやらスクリーンセーバー、Audio Visual、ブラウザのFlashアニメーションが動いているとか、
そういうのでなければ数％に満たないはずです。
変な常駐ソフトが動いているとか、ともすればウイルスの可能性も考えられますので、調べてみた方がいいかもですね。

お礼

何度も回答ありがとうございます。
・・・ぜんぜんわかりません（笑）しばらく勉強してから再度質問しなおすとします。
丁寧に回答していただいたのに理解できなくてすいません。

CPUの使用率は通常は数％でメモリ使用率が50％ほどという意味です。
心配してくださってありがとうございます。

回答No.8

神崎 渉瑠（@taloo）

長文失礼。
意味がわからないところは、ソフトウェアの使い方やHTML/XHTMLを勉強すれば追々わかってくると思うので、今は聞き流して下さい。

Dreamweaverを使い、HTMLソースコードを編集せずに、デザインビューだけでW3Cが推奨する書き方でページを作ることも出来ます。
ですが、Dreamweaverの使い方をしっかり知っておかないと出来ないと思いますし、
ボタンを押すだけで簡単に、とすると、どうしても推奨されないHTMLコードが書き出されてしまいます。
それはおそらくホームページビルダーでも同様だと思います。

HTMLを勉強するために、オーサリングソフトの使い方を勉強するにはあまりにも遠回りになりますから、
オーサリングソフトを使うのであれば、
ANo.4、ANo.6の参考サイトを見るに、
ボタン１つで推奨される書き方ができるExpressionWebを推します。

オーサリングソフトというのは、学校でC/C++/C#、およびPHPを勉強していればいずれ出てくると思いますが、フレームワークの考え方に近いですね。
フレームワークを使えばたしかに早くできますが、ソースコードや実行ファイルにはフレームワークがはき出す、悪く言えば無駄が出ます。
あるフレームワークを使う・使わないで比べると、実行時間にも差が出ます。
もちろんコンピューターの性能により、無視出来る範囲となるかもしれませんが。
（Perlではこの無駄を嫌うので、あまりフレームワークは使われないと思います。CGI.pmという大きなライブラリでさえ嫌われますから。）

また、フレームワークを使いこなすには、
C/C++/C#、PHPの基本的な言語仕様を覚えて、かつフレームワークの使い方も覚えておかなければなりません。
フレームワークという"オーサリングツール"を使っても、結局、その根本は言語仕様になるんですね。
フレームワークで自動的に作り出せない部分が必ずありますから。

フレームワークがはき出すプログラムを見て勉強するのはたぶん、難しいです。
だから学校では、最初に小さな数行のプログラムを作って勉強し、
フレームワークは最後の方に、ということになると思いますよ。
基礎知識があれば、フレームワークは（おそらく）簡単に使いこなせるようになると思います。

お礼

とてもためになる回答ありがとうございます。
フレームワークはわからなかったので調べてみましたがオブジェクト指向のクラスに近い概念のように感じました。あってるかは不安なところですが。
Cで言うならば規格されている関数のもっともっと大きなものみたいなところでしょうか？
つまりは引数と戻り値が規定されているのでいらない戻り値まで返ってくると邪魔になるって感じですかね。いや、聞いてたらきりがないですね。後々理解できる日が来ると思うので勉強にはげみます。

本当に何度も申し訳ないのですが、ひとつだけ気がかりが増えたので聞かせてください。
私の使ってるPC、まだ３年しか経っていないのですがCPUがCeleronD2.93GHzなんです。メモリは拡張して1.25GありますがCPUが遅くて使用率50%程度ですけど。
ExpressionWebは分かりませんがDreamweaberCS3の必要システムはデュアルコア以上でした。つまりは64bitCPUでなければきついってことでしょうか？
CeleronDではきついのはわかりますが、一応動いてくれそうだと思いますか？答えはでないと思いますので、参考意見を聞かせていただけると嬉しいです。
何度もすいません。

回答No.7

神崎 渉瑠（@taloo）

なるほど、オーサリングソフトとしてはExpression Webがベストなようですね。
Dreamweaverは古いブラウザへのこだわりが、文字通り拘束となってしまっている様に思えます。
高機能を詠うなら古いブラウザへの互換性と、
XHTML1.0 Strict（欲を言えばXHTML1.1 Strict）を選択できるくらいになってほしい所なんですが。
いまだにインラインフレームに対応してないわけですし。

所用のついでに近所の本屋さんによってきました。
小さな本屋さん（といっても近所では最大の２階建て(笑)）なのでそれほど種類は置いてないですが、
「Web標準XHTML+CSSデザイン クリエイターが身につけておくべき新・100の法則」（加藤善規他共著、インプレスジャパン ISBN-10: 4844324241 ）
その他「アクセシビリティー」「ユーザビリティー」「web標準」というキーワードで探してみると、良さそうな本がありましたが、
内容はW3Cなどの内容とほぼ同じのようです。
著者が違うためそれぞれ表現も異なりますから、理解しやすいものを読めばいいと思います。

> 文法書については私は言語に限らず、なんだかやたらにリアルな動物の絵が表紙の本(メーカー覚えてないのですが)を使っていました。
オライリーですね。
全般的にバイブルとも言われている本ですので、間違いないと思います。
が、私は読んだことがありません。読んだことがない本を薦めることはできません。
http://www.oreilly.co.jp/books/4873111277/

http://okwave.jp/qa3187137.html
こちらに出てくる
「Web標準の教科書」-XHTMLとCSSでつくる正しいWebサイト-（益子貴寛、秀和システム ISBN-10: 4798010928 ）
という本も、Amazonで目次を見てみると、解説とともにリファレンスとしても使えると思います。
600ページというページ数から、オライリーに似てるのではないでしょうか。

英語が読めるなら以下のサイトもご参考に。
邦訳も探せばあるると思うんですけどねぇ。。。
http://www.w3.org/TR/WAI-WEBCONTENT/
http://www.w3.org/WAI/
http://www.htmlhelp.com/design/
http://www.w3.org/QA/Tips/

以下、ブックマークの奥から探してきたもの。
http://bfree.purewell.net/
http://jp.fujitsu.com/about/design/ud/assistance/
http://www.kokoroweb.org/tips/part1-2.html
http://www.mozilla.gr.jp/standards/webtips/index.html
http://www.scollabo.com/banban/apply/ap10.html

アクセシビリティーを考えるのは、その基礎知識としてHTMLタグの意味が必要です。

お礼

本屋さんにまで足を運んでいただき、ありがとうございます。
私も今日図書館で探し、オライリーであることがわかりました。
オライリーの本は何でも載っていますが読みやすいかというと良くわからないといったところでした。ルールブックのような読み心地です。
あと、Dreamweaverの良いところがわからなくなってきましたね。Expressionが圧倒的に良いのでしょうか・・・そんなこともないと思うのですが・・・
Expressionを主において試験が終わってから体験版をそれぞれやってみようと思います。
本屋さんは大阪のヨドバシカメラに行く予定が近日の夏休み中にあるのでそこで試し読みをします。
たくさんの本を調べていただいてありがとうございます。

回答No.6

fab76

追記しますね
>Dreamweaverも多種類のブラウザに対応していると聞いていたのに・・・

これは意味違いです。文書型、DTDに沿ったきれいなコードを書き出します。あくまでDreamweaver上でのレンダリングがおかしいだけなのです。比較的新しいFirefox等モダンブラウザでの表示が正しい表示ということです（IE7においてもどうもfloatの解釈がおかしいと思える…、気のせいかな？）

この悪しき仕様は前バージョンの8、MX2004でも見られたのでCS3で大幅な改善を期待していましたが引きずっているようです、残念。

>Microsoft Expression Webは2007バージョンなのでしょうか？

はい、今年の5月（2月だったっけ？）にリリースです、よってWeb上でも書籍でもほとんど情報はありません（汗）
【Webデザイン・ツール「Expression Web」を試してみた/ ＠IT】
http://www.atmarkit.co.jp/fdotnet/special/expressionweb01/expressionweb01_01.html
【Expression Webを使ってみよう】
http://www.wanichan.com/web/expression/

ソフト自体はFrontPage2003のメジャーバージョンアップなので安定あるはしています。悪い評価のもととなった変なコードも吐かなくなりました。

特筆なのはExpression Webを含むスイート製品　Expression Studo
http://www.microsoft.com/japan/products/expression/expression-studio/default.mspx
のアカデミック版がこんな値段で…、「信じら～レナイ」といったといったところ。
本来の目的Web標準、XHTML+CSSとはずれていきますがリッチコンテンツの開発まで視野に入れるのならこちらを選びたいところです。

Flashの普及に対してWindows Presentation Foundation(WPF) がどのくらいまで食い込めるかはまだ未知数ですが面白そうです。
「WPF」、「Apollo」あたりのキーワードで検索してみるといいでしょう。

WPFで作られて公開されているサイトとしてはマイクロソフトと旭山動物園が作った「Mother Earth ～母なる地球」
http://www.asahiyamazoo-aict.jp/
があります。
XP環境でも.NET Framework 3.0
http://www.microsoft.com/downloads/details.aspx?FamilyId=10CC340B-F857-4A14-83F5-25634C3BF043&displaylang=ja
のインストールで閲覧可能です。

お礼

再びアドバイスありがとうございます。
確かにWebについてまなぶならHTML系だけでなく画像系についてもそれなりに手を出したいところですね。
画像や動画の編集と連携がAdobeでは有名と言うことでしょうか。
ExpressionについてもStudioでまとめて買えることがアカデミックを買える今しかできない贅沢ですね。
Expression、良さそうです。あとは学校のOSがLinuxであるところを何とかしなければ！！
LinuxだとAdobeも動かないですからね(苦笑)

回答No.4

fab76

何がなんでもDreamweaverなら止めるつもりはありませんが、Web標準・XHTML+CSSのツールとして考えた場合Microsoft Expression Web
http://www.microsoft.com/japan/products/expression/expression-web/default.mspx
が優れていると思います。ASP.NETは関係なくともCSSまわり、コードビューにおいての入力補完（IntelliSenceと呼んでいます）などDreamweaverCS3と比較しても凌駕していると思います。

ツールとして不可欠だと考えるソフト上でのレンダリングの差はExpression Webに分があります。「基本が ～」という意見ももっともなのですが、一般論であって現実に何十ページも仕上げなくてはならない場合、これらのツールを使わない場合効率面で無理があります。

■（Dreamweaverは前バージョン8ですが）レンダリング機能の差
http://www.valumore.jp/shop/u_page/exweb.aspx
△これに関してはCS3でも引き継いでしまっているようです
http://www.wanichan.com/web/before/page12.htm

あくまで個人的な意見ですが
ホームページビルダーは私は選びません、理解できる人が使って初めて"普通のツール"となります。
分かっていなければご意見無用のとんでもないコードを吐いている場合も見受けられます。

Expression Webにおいても無敵ではありませんが前身のFrontPage2003の困った点は払拭されています。
ただしMicrosoft製品に見受けられるインストール時の関連付けの変更、OfficeIME2007のデフォルトでのインストールなど冗長な部分も変わらずです。

体験版が60日フル機能で使えるので（Dreamweaverもあり、一部機能は限定）ご自身で判断されるといいでしょう。

#関係ないですがスイートのExpression Studioが\14000台で買えるアカデミック版がうらやましいです。

お礼

たくさんのアドバイス、ありがとうございます。あと私の質問上のDreamweaverのスペルミス、申し訳ないです。
Microsoft Expression Web、こんなソフトが存在することをしりませんでした。HPを見る限り、とてもよさそうなソフトですね、私の要求に一番合っているソフトでないかと感じました。
Dreamweaverも多種類のブラウザに対応していると聞いていたのに・・・結果は無惨でした。ウソを広告していたのか？？
皆さんの意見を聞いていて、ビルダーの線は薄くなってきました。逆にMSの製品との比べになってきましたが。
追加質問ですが、このMicrosoft Expression Webは2007バージョンなのでしょうか？もうすぐ新しいバージョンがでるなら待ってみようと考えています。
体験版は試験が終わってからじっくり試してみることにします。

アカデミックはほぼ半額なのでこれはとても嬉しいことです。むしろそんなことが出来るなら一般用も安くすればいいのにと思います。学生のうちに色々な高価なソフトを買いだめをしようかと友人とほくそえんでます(笑)

回答No.3

degitalman

結論から言いますと、kiki28さんのような技術を習得できる環境があるのであれば、Dreamweaver（以下DWと略）をお奨めします。それを踏まえ、理由を書かせていただきます。

DWとビルダーの製品の位置づけですが、DWは世界的にHP作成開発者（プロ）や中上級者、企業で多く使われています。ビルダーはどちらかというと、初中級者、個人ユースがターゲットになっているように思います。それを踏まえてお話ししますが、最近のHPの作り方は、デザインよりもSEO対策やW3C（Web開発の世界標準を策定している団体）に基づいたコーディングが要求されています。
そのため、XHTMLやCSSのきんちとした知識や技術の習得が必要な時代になっており、それを活かした製作技術が要求されるようになってきています。
そういう観点から言うと、ビルダーはあまりW3Cのことなど気にしてないように思います。
W3Cを意識せずにHP作成をするのであれば、ビルダーでも構いませんが、きちんとしたHPの作り方、コーディングを身に付けたいのであれば、DWの方が適しています。

簡単な例を言うと、非常に細かい部分ですが（ルールというものは細かいものですので）、W3Cが推奨していて、Dreamweaverがきちんと意識している部分、ビルダーが意識していない部分は、
・HTMLファイルの冒頭に書く「文書型宣言」の書き方
・タグは大文字ではなく、小文字で書く
・JavascriptやCSSはできるだけ外部ファイルとして利用する
・タグの性格がハッキリわかる書き方
・終了タグを明確にする
などなどですが、他にもいろいろとあります。
最後の部分のタグの性格うんぬんというのは、たとえば、太字のタグですが、従来は文字修飾の意味で「b(bold)」というタグが使われていました。が、太字は強調させて見せたいタイトルや文字ということで「strong」を推奨するようにしています。ビルダーではたぶん「B」タグのアイコンをクリックするとそのまま「b」で書かれると思いますが、DWは「strong」で書くのが標準となっています。また、以前のHTML基準では、終了タグを書かなくても各ブラウザが自動的に認識してきちんと表示させていましたが、現在はきちんと終了タグを書かなければいけなくなっています。たとえば、フォーム入力のタグで<input></input>
がありますが、終了タグは省略するのが一般的でした。その部分に関していうと、</input>タグを使わない場合は、<input ・・・/>というような書き方をすることというふうになっています。DWはそれを自動で認識して的確に書いてくれます。
以上の部分を参考にして選び方の判断にしていただければと思います。
書籍に関しては、だいたいの知識はお持ちのようですから、基本的な操作を覚えるだけなら、ソーテック社から発行されている「Dreamweaver CS3スーパーリファレンス」が良いと思います。

お礼

たくさんのアドバイス、ありがとうございます。あと私の質問上のDreamweaverのスペルミス、申し訳ないです。
SEO対策は学生のうちはないと思いますが(笑)W3Cの推奨にあわせることはとても重要であると言う事がわかりました。
色々なページのソースを見る限りまだHTML4.0が多いようですがいずれXHTMLになるとするとタグの問題などは重要だとわかりました。手打ちでソースコードを書き直すことを考えるとDWの方がよさそうですね。
degitalmanさんはお勧めを教えてくれたので助かりましたがいつも頭を悩ませるのは「初級、中級、上級」の言葉の定義なんです。特に初級はどの変をさすのか頭を悩ませます。大学で情報を専攻している人間として、情報分野にかんして初級を名乗るわけにはいきませんし、むしろ全ての日本人を対象にしたうえでの平均を平均とするなら上級でなければなりません。しかし、HPに関しては作ったことがないという意味で初級かなと考えるわけです。
このようなソフトを使用する人々の「初級、中級、上級」とはどのような技術レベルを表現しているのでしょうか？よければ教えてください。
さいごに、回答、ありがとうございます。

回答No.2

my-hobby

素人でしたら訳も解からず出来たＨＰで良いですが、ある程度勉強した方はソフト作ったか解かりまし、
又基本が無いので、編集も無理です

勉強するのでしたら、やはり基本が大切で時間節約程度のソフト利用ですか、（編集は出来るので）
又最近のＨＰは画像ソフトの熟知が又必要、ＨＰ付属の画像ソフトは限界が有ります

お礼

アドバイスありがとうございます！
画像系ソフトとの連携ならAdobeが有利な気がしますね。

あ、今気づいたのですがDreamweaverですね。
スペル間違っていました。すいません。

回答No.1

noname#34874

http://www.soratoumi.com/web/websoft.htm

お礼

早い回答ありがとうございます！
とても参考になりました。