- ベストアンサー
ホームページ作成ソフトの選び方とリニューアルの悩み
- ホームページビルダー12で運営中の商用サイトをリニューアルしたいが、CSSの問題やブラウザ間の見え方の違いに悩んでいる。
- ドリームウィーバーや直接のHTML+CSS入力、ホームページビルダー16のどれを選ぶべきか迷っている。
- SEO対策も考慮しながら、パソコンのスペックや更新頻度を考慮してアドバイスを求めている。
- みんなの回答 (3)
- 専門家の回答
質問者が選んだベストアンサー
ブラウザによって見え方が違う、最大の原因は多くの場合「互換モード」と「標準モード」の差であることが多いでしょう。 以前のIEは、過去のいきさつもあり独自の仕様に長くこだわっていました。しかし、それはウェブの本来の目的 「HTML文書が、ブラウザやプラットフォームの違いを超えてうまく働くべきであるということは、多くが認めるところである。 ( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/intro/intro.html#h-2.2.1 )」(以下の文章を読んでおくこと。) ウェブが、IEを筆頭とする「ユーザーの囲い込みのための独自仕様」によって、分断されていくことに危機感を抱いた人たちによって、ウエブ標準が提唱され、HTML4.01strictが勧告されました。他のブラウザがそれに従い、その有用性が認められるにいたってついにIEもそれに従うようになったということ。 ところが、過去の蓄積の多いIE専用のサイトなどの過去の仕様に対処するために、互換モードが存在すると考えればよいかと。 言い換えると、HTMLを標準モードで動作するように記述すれば、どのブラウザで見てもほぼ同等に見えるページが作成できます。 ※DOCTYPEスイッチ - Google 検索 ( http://www.google.co.jp/#hl=ja&sa=X&psj=1&ei=O2o-T8etIIeiiAeagonaBA&ved=0CBsQvwUoAQ&q=DOCTYPE%E3%82%B9%E3%82%A4%E3%83%83%E3%83%81&spell=1&bav=on.2,or.r_gc.r_pw.,cf.osb&fp=e4983194fbbc0760&biw=1013&bih=600 ) 残念ながら、ビルダーは、基本は互換モードです。 ビルダー16が、ウェブ標準に対応しているとは言っても、絶対にオーサリングツールだけでは不可能な部分があります。 ★HTMLは、文書をそれを構成する要素に分けて、その構成要素を示すようマークアップする。 この部分は見出しだから<h2></h2>で括る。この部分は引用だから<blockquote></blockquote>で、この部分は定義リストだから<dl><dt><dd>で・・・。こんなこと文書を読み解く能力のないオーサリングツールでは無理なのは理解できるでしょう。著者が自身で、HTMLにはどのような要素(タグ)が用意されていて、どのようなときに使用するかを正しく知っていないとマークアップできません。オーサリングツールが出来るのは、その綴りが正しいか否か程度 ★要素(タグ)で足りない部分は、idやclass名で文書構造を示します。 『DIV要素とSPAN要素は、id属性及び class属性と併用することで、文書に構造を付加するための一般機構を提供する。 ( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/struct/global.html#h-7.5.4 )』 ですが、どのようなclass名がよいかは、オーサリングツールは知りません。たとえば、HTML5では、このclass名が要素として独立します。 『新しい要素 ( http://standards.mitsue.co.jp/resources/w3c/TR/html5-diff/#new-elements )』 それらがそのまま、class名として使うとよいのですが、あくまで人が、それぞれの意味を知ってつけないとならない。 ★スタイルシートに対応しているのは、プロパティだけです!!。セレクタは自分で書かなきゃなりません。 [例]HTML5で書いておきます。HTML4だと、それぞれ<div class="header"></div>のようになります。 <body> <header> <h1>見出し</h1> <p>・・・・</p> </header> <section> <h2>章見出し</h2> <section> <h3>項見出し</h3> <p>・・・</p> <aside> <p>本文と関係ない文章</p> </aside> <figure></figure> </section> </section> <footer> </foote> </body> これをスタイルシートでデザインするとき、CSSを知っていれば、 section section{font-size:0.9em;} section aside p{color:gray;} とか、実に簡単に書けるし。後日誰が見ても、「本文ニ階層目は小さな文字で」と読み解けますから、HTML見なくても修正できるでしょう。オーサリングツールでは、せいぜい著者が文字を小さくする要素を選択して、本来不要のclass名でもつけて書かざるを得ませんね。なぜなら彼らには読解力なんてないですから。CSS(カスケーディングスタイルシート)のもっと重要なカスケーディングは、機械に読み取れても利用するのは原理的に無理なのです。 オーサリングツールは、大変便利な道具ですが、テキストエディタですらすら書ける人以上に、HTMLやCSSを知っていないと、まともなページを作るのは無理です。HTMLやCSSの仕様書に加えてツールのマニュアルを読んで理解しなきゃならない。 どんな大規模なサイトでも、作るのはテンプレートに当たる数タイプのHTML・・・数ページと、手でしかまともにかけないCSSです。 使うタグなんてせいぜい40個・・・(中学校で覚えるべき英単語が2000語 )・・・。 SEOを誤解されています。SEOとは、検索エンジン最適化と言う意味で、検索エンジンがページの情報を正確に把握できるようにマークアップすることです。--結果的にその情報を検索したときに上位に出てきますが、それは結果です。HTML5で導入される新しい要素は、googleなどが強く求めてきたものです。 プロで、ホームページビルダーを使う人はまずいないでしょうが、DreamWeberが圧倒的に多いですが、それはサイト管理やコンテンツ管理が容易だからです。HTMLやCSSは、著者の力量によります。 私は今は、HTML,CSSの最初のステップは HTMLエディタ ( http://ja.wikipedia.org/wiki/Web%E3%82%AA%E3%83%BC%E3%82%B5%E3%83%AA%E3%83%B3%E3%82%B0%E3%83%84%E3%83%BC%E3%83%AB ) です。理由は次の記事『問題点 ( http://ja.wikipedia.org/wiki/Web%E3%82%AA%E3%83%BC%E3%82%B5%E3%83%AA%E3%83%B3%E3%82%B0%E3%83%84%E3%83%BC%E3%83%AB#.E5.95.8F.E9.A1.8C.E7.82.B9 )』ですね。特にビルダーは『作成したウェブサイトの影響 ( http://ja.wikipedia.org/wiki/%E3%83%9B%E3%83%BC%E3%83%A0%E3%83%9A%E3%83%BC%E3%82%B8%E3%83%BB%E3%83%93%E3%83%AB%E3%83%80%E3%83%BC#.E4.BD.9C.E6.88.90.E3.81.97.E3.81.9F.E3.82.A6.E3.82.A7.E3.83.96.E3.82.B5.E3.82.A4.E3.83.88.E3.81.AE.E5.BD.B1.E9.9F.BF )』があって、使うことはありません。 というか、私の仕事のもっとも負担--利益にならなくて、もっとも労力を要するのが、ビルダーで作られたサイトの再構築なのです。
その他の回答 (2)
- ORUKA1951
- ベストアンサー率45% (5062/11036)
>とりあえずでは良いけども、将来性を考えたらキッチリ勉強した方が良い気がしてきました。 いえ、最初にすべきことが勉強なのです。「学問に王道はない」 少なくとも、 ★HTML 4.01 Specification (ja) ( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/cover.html ) ビルダーのマニュアルの1/10もありません。 ・一度は通して読んでおくこと。 ・そして必要なとき、索引などを使って読むこと これを繰り返すことが最善です。オーサリングツールを使い始める前に理解しておくこと。 CSSはこちら ★REC-CSS2 邦訳 ( http://www.swlab.it.okayama-u.ac.jp/man/rec-css2/cover.html#toc ) たとえば、見出しH1,H2,H3,H4,H5,H6について 『【引用】____________ここから 見出しの要素は、その章・節で述べられる話題を短く記すものである。見出し情報は、ユーザエージェントによって、例えば文書の目次を自動生成するために用いられたりもするであろう。  ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ここまで[The global structure of an HTML document (ja)( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/struct/global.html#h-7.5.5 )]より』 この一文とその後のサンプルを知っているだけで、ビルダーの使い方が変わることでしょう。 >知識レベルとしては、HTML+CSSの本をざっと一冊読んだ程度です。 本当に知っていれば、本を書こうなんて思いません。仕様書を読めば完璧なことを、わざわざまどろっこしい長文にする必要はない。 今は、HTMLやCSSは手で書くほうが、断然はやくなってしまったのでHTMLやCSSをツールに頼ることはまったくありません。
お礼
「最初にすべきことが勉強なのです」に、たしかにそうだなあと感じています。 どんな事も、わけもわからず経験だけで進むのと、まず基礎をつかんでから実践していくのでは大違いですね。オーサリングツールを使うにしても、その前段階をしっかり抑えておかないと、と実感しました。 HTMLやCSSを手で書けるようになりたいです。 貴重なアドバイスありがとうございます。
- 4610-564459
- ベストアンサー率31% (59/188)
■この機会に思い切って別のソフト(ドリームウィーバー等)にした方が良いのか、 DWは、デザイン畑の人間の作るビジュアル プログラム畑の人間が扱うPHPなどの 連動が行えるプログラムです。 CSSなんて所詮骨組みでしかないわけで、Webにかかわる人間なら日本語のあいうえおを使える 程度の代物ですから、すごいことでも 特別な技術でも何でもありません。 Webページの根本は「ビジュアル」ですから、 文字ばっかり CSSで組まれたスクエアカラーばっかり のページなら、こんなソフトを使う必要もありませんが、それでは「広告媒体」としては使えないでしょう。 結局は使う人間がデザインなのかプログラムなのかに特化しているかでソフトは変ります。 ■時間をかけてでもHTML+CSSを直接打ち込むようにした方が将来的には良いのか、 個人の趣味で納期がないのであれば時間掛かかってもかまわないですけど 私たちのような「本業」の人間には“納期”があります。 先ほども行ったのですがHTML+CSSは解っててあたりまえ、解らなくても辞書引けば理解できる 必要な項目を見つけ出せるのが前提です。 ただ、そんなことをいちいちやってたら納期に間に合わないので、ツールを使うんです。 例えば、ホットケーキを作るとします 片方は、手で卵を割り 手で粉を混ぜ がすこんろに火をつけとします。 片方は、たまごをわったら、ブレンダーを使ってかき混ぜ ホットプレートに温度を設定して焼きます どちらがお手本に忠実で手早く 見てくれの良い売れるものになりますか?と言うことです。 DWはCSSや打ち込んだタグを補助して修正までしてくれます。 手打ちじゃエラーが出るまで気がつきません。探すほうは、新聞の一面の文字数から誤字を1文字探し出すような手間を食います。 苦労をして時間をかける=いいものが必ずできるの法則は当てはまりません。 うっかりのミスを補助さえされていれば、法則は決まっているのですから 短時間でもいいものはできるのです。その手間を肩代わりしてくれるのがソフトなのです。 ■やっぱり慣れと手軽さでビルダー16にした方が良いのか迷っています。 作るほうがそれでいいならそれでいいですよ。別に「困っていないなら」かまいません。 ただ、仕事にされるのなら そのソフトはクライアントの高度な要求を満たせないことになります。
お礼
すばやい回答をいただき本当にありがとうございます。 わかりやすいお話で、まずはソフトを使わない選択肢は無くなりました。 ウェブサイトを作ること自体はあくまでも仕事にはしません。(というか自分にはムリですが) 目的を考えれば、ビルダーで十分なような気がしてきました。 食品の販売なので、見た目の美味しそうな雰囲気が出れば良いかと思います。
お礼
ご回答いただきましてありがとうございます。 う~ん、深い!という感じでわからない単語も調べつつ何度も読み返してます。 結局のところ、ビルダーは互換ソフトなんですね。 とりあえずでは良いけども、将来性を考えたらキッチリ勉強した方が良い気がしてきました。 中学の単語の数との比較もわかりやすいです。 ビルダーのサイトの再構築の件、ずしりと重いです。 しっかり検討してみます。