• ベストアンサー

ショックです。作ったHPがめちゃくちゃです。

Mac(OS10.6.8)で、Dreamweaver CS5を使い、ホームページを作成しました。 Windows Vistaで確認したところ、画像もテキストも、とんでもなく散らばっていました。 多少の違いは覚悟していましたが、これほどまでの目を覆いたくなるほどの惨状にショックで落ち込んでいます。 Macでは、全て完璧な仕上がりです。 一体、何が問題なのでしょう。 どなたか早急に教えてください。 お願いします。

質問者が選んだベストアンサー

  • ベストアンサー
回答No.6

一応、他のやり方として。 複雑なレイアウトはブラウザ依存度が高くなります。 そのブラウザ依存度を吸収するため、CSSハックを多用する事になりますが、 これを嫌って簡単なレイアウトで終わらせる方も多いです。 ーーーーー | ヘッダー | ーーーーー | サ | 本 | | イ | 文 | | ド |   | | バ |   | | | |   | ーーーーー | フッター | ーーーーー オーサリングソフトを使うと複雑なレイアウト、デザインも簡単に作れますが、 そこを我慢して簡単なレイアウトで作り替えるというのも、ひとつの手段だと思います。 簡単なレイアウトにしておけば、 CSSハックを使わなくても、いろんな環境で見たときに、デザインビューで見たまま、ほぼ同じレイアウトになることが多くなります。

noname#146657
質問者

お礼

あまりのショックに、みなさまへコピーのお返事を失礼いたします…。 みなさまからたくさんのご回答いただき、 大変ありがとうございました。 イラストデザインをやってるのに、web 作成に素人なため、 今まで Windous で「ホームページ作成ビルダー」を使い、かなり 手作り感あふれた ページを作成してきました。 その時は Mac. でもほとんど狂わず正確に反映されていました。 その後 PC を Mac.に買い替えたため、ソフトも dreamweaver に 変えて、同じものを作った結果、Mac. では非常に鮮明できれいな 画像ページが出来あがり、とても満足にひたっていたのですが… Win であんなことになっていようとは(多少のずれやフォントの違いくらいは 予想してましたが)…   皆さまのご助言で、無知でお手軽ソフトに依存しまくったための結果だと 思い知らされました。 ありがとうございます。

その他の回答 (5)

回答No.5

そのためにCSSハックという物があります。 詳しくは「CSSハック」で検索して、 それぞれの環境で見たときに、期待通り表示されるように調整してください。

noname#146657
質問者

お礼

あまりのショックに、みなさまへコピーのお返事を失礼いたします…。 みなさまからたくさんのご回答いただき、 大変ありがとうございました。 イラストデザインをやってるのに、web 作成に素人なため、 今まで Windous で「ホームページ作成ビルダー」を使い、かなり 手作り感あふれた ページを作成してきました。 その時は Mac. でもほとんど狂わず正確に反映されていました。 その後 PC を Mac.に買い替えたため、ソフトも dreamweaver に 変えて、同じものを作った結果、Mac. では非常に鮮明できれいな 画像ページが出来あがり、とても満足にひたっていたのですが… Win であんなことになっていようとは(多少のずれやフォントの違いくらいは 予想してましたが)…   皆さまのご助言で、無知でお手軽ソフトに依存しまくったための結果だと 思い知らされました。 ありがとうございます。

  • ORUKA1951
  • ベストアンサー率45% (5062/11036)
回答No.4

 Dreamweaverを使おうと、何を使おうと、きちんとかけていれば、OSやブラウザの表示誤差は知れたものです。(IEのシェアが5割を切ったと言え、いまだに無視できない状態ですが、問題となっているIEは、シェア2.74%のIE6以前です) 【引用】____________ここから HTMLは、どんな環境からもWebの情報を利用できるようにすべきだという方針の下に開発されている。例えば、様々な解像度や色深度のグラフィックディスプレイを持つPCや、携帯電話、モバイル機器、音声入出力機器、帯域が広いコンピュータや狭いコンピュータ、等の環境である。  ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ここまで[Introduction to HTML 4 (ja)( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/intro/intro.html#h-2.2.1 )]より  それでいて、表示がそこまで崩れるのは、Macに限らずHTMLそのものの書き方が間違っているとしか思えません。HTMLにミスがある場合、ブラウザはそのミスを無理やり解釈して、何とか表示を試みます。現状はその処理結果によってそのように見えているだけです。  Macでもfirefox( http://mozilla.jp/firefox/ )など他のブラウザを使えば、やはり崩れると思います。 >一体、何が問題なのでしょう。  多分一箇所ではないと思います。 ★Another HTML-lint gateway ( http://openlab.ring.gr.jp/k16/htmllint/htmllint.html )  でチェックしてみてください。  Dreamweaverに限らず、オーサリングツールを使うと、その機能に頼ってとんでもないHTMLを書いてしまいます。言い換えると、オーサリングツールを使う場合は、テキストエディタで作成する人以上に、HTML(やCSS)を知っていないと、そのような結果になってしまいます。  一度、デザイン(プレゼンテーション)を一切無視して、白紙の状態でHTMLを書いて見られることをお勧めします。  そのとき、「ある段落が見出しなら、見出しでレベルを選んでマークアップする」程度で書いてみることが重要です。  そのまえに、 はじめてのWebドキュメントづくり ( http://www.asahi-net.or.jp/%7Esd5a-ucd/www/ )  あたりから、学んだほうが良いと思いますよ。急がば回れ・・

noname#146657
質問者

お礼

あまりのショックに、みなさまへコピーのお返事を失礼いたします…。 みなさまからたくさんのご回答いただき、 大変ありがとうございました。 イラストデザインをやってるのに、web 作成に素人なため、 今まで Windous で「ホームページ作成ビルダー」を使い、かなり 手作り感あふれた ページを作成してきました。 その時は Mac. でもほとんど狂わず正確に反映されていました。 その後 PC を Mac.に買い替えたため、ソフトも dreamweaver に 変えて、同じものを作った結果、Mac. では非常に鮮明できれいな 画像ページが出来あがり、とても満足にひたっていたのですが… Win であんなことになっていようとは(多少のずれやフォントの違いくらいは 予想してましたが)…   皆さまのご助言で、無知でお手軽ソフトに依存しまくったための結果だと 思い知らされました。 ありがとうございます。

  • shigenobi
  • ベストアンサー率43% (19/44)
回答No.3

No.1 の回答者です。 >そうだとしたら、どうすればよいのでしょうか。 No.2の回答者様が仰る通り、DWを使っていくのであれば、 ブラウザ毎の互換性をチェックし、どのタグが有効/無効なのかを 確認しながら作っていくしかないのではないかと思います。 [ブラウザの互換性をチェックする] http://kb2.adobe.com/jp/cps/707/7070.html [日本のブラウザシェア] http://lhsp.s206.xrea.com/misc/browser-share.html まだまだ世界でも日本国内でもIEが圧倒的ですね。 私はChromeですが・・。

参考URL:
http://kb2.adobe.com/jp/cps/707/7070.html
noname#146657
質問者

お礼

あまりのショックに、みなさまへコピーのお返事を失礼いたします…。 みなさまからたくさんのご回答いただき、 大変ありがとうございました。 イラストデザインをやってるのに、web 作成に素人なため、 今まで Windous で「ホームページ作成ビルダー」を使い、かなり 手作り感あふれた ページを作成してきました。 その時は Mac. でもほとんど狂わず正確に反映されていました。 その後 PC を Mac.に買い替えたため、ソフトも dreamweaver に 変えて、同じものを作った結果、Mac. では非常に鮮明できれいな 画像ページが出来あがり、とても満足にひたっていたのですが… Win であんなことになっていようとは(多少のずれやフォントの違いくらいは 予想してましたが)…   皆さまのご助言で、無知でお手軽ソフトに依存しまくったための結果だと 思い知らされました。 ありがとうございます。

  • 4017B
  • ベストアンサー率73% (1336/1814)
回答No.2

今は自分、Dreamweaverは使ってないのであれなんですが…。 確か、メニューのどこかに「ブラウザの互換性をチェック」ってのがあったはずでは?それを使えば良いんじゃないのかなあと。 P.S. 老婆心で物申せば。身内に公開する小規模なwebサイトならいざ知らず。一般の不特定多数に公開前提のwebサイトを作っているのであれば、まずはIE前提で作って、表示が可笑しい様ならMac(Safari)は切り捨てるくらいの覚悟で無いとweb製作は難しいと思いますよ(世の中の9割はWindows+IE環境です)。

noname#146657
質問者

お礼

あまりのショックに、みなさまへコピーのお返事を失礼いたします…。 みなさまからたくさんのご回答いただき、 大変ありがとうございました。 イラストデザインをやってるのに、web 作成に素人なため、 今まで Windous で「ホームページ作成ビルダー」を使い、かなり 手作り感あふれた ページを作成してきました。 その時は Mac. でもほとんど狂わず正確に反映されていました。 その後 PC を Mac.に買い替えたため、ソフトも dreamweaver に 変えて、同じものを作った結果、Mac. では非常に鮮明できれいな 画像ページが出来あがり、とても満足にひたっていたのですが… Win であんなことになっていようとは(多少のずれやフォントの違いくらいは 予想してましたが)…   皆さまのご助言で、無知でお手軽ソフトに依存しまくったための結果だと 思い知らされました。 ありがとうございます。

  • shigenobi
  • ベストアンサー率43% (19/44)
回答No.1

こんにちは。 ブラウザの違い、またそのブラウザのバージョンによっても、タグが有効であったり無効であったりするために、キレイに表示される/されないが出てきます。 Macのパソコンでは、Safariを使って表示の確認をされているのではと思います。 一方VistaではIEの8か9?になると思います。 使用されているDream Weaverから出力されたhtmlタグが、少なくともIEに対応していないということが言えますね。

noname#146657
質問者

お礼

ありがとうございます。 その通りだと思います。 そうだとしたら、どうすればよいのでしょうか。 どなたでも回答をよろしくお願い致します。

関連するQ&A