MacとWin、ホームページの画面表示が違います。

Macでホームページを作ってWebで画面確認したら、Macで文字(TEXT)が1行のはずがWinでは2行になってて、テーブル(小さい表)でもMacでは左右に2列に並べたのに、Winでは上下2段になってしまいます。画面表示の大きさがMac:Win=72:96dpiの違いだと思いますが、これをMacと同じ表示をWinで実現する方法はありませんか？もしくは最小限に修正する方法はありませんか？Winで見た知人から注意されて困ってます。ホームページはDreamweaver3で作ってますが、これはタグ書きでも同じ現象になるんでしょうか？ブラウザはIE5.0です。私はMacOS8.6です。回答どうか宜しく。

No.8 ベストアンサー 回答者： noname#5549 回答日時： 2003/12/22 14:18

再々度の回答です。

＞結局Webで正常に見えるように、オリジナルをずらして配置するのですが、これはDreamweaverでは当たり前の現象ですか？

当たり前ともいえるし、そうでないとも言えます。
そう表示されるには原因があり、この手の制作ソフトが万能ではない、ということです。
どうしてそうなるのかは、HTMLなどの知識があればある程度は分かりますし、必ずしもゴミタグのせいではないです。そうすればDreamWeaverのどこが不完全なのかも分かりますが、現時点では対処療法しかないように思えます。

GoLiveに換えても似たような場所で悩むことでしょう。

ちなみに僕自身はそもそもこの手のソフトは使いません。
結果的にテキストエディタの方が早いんです。（僕の場合）
でも、DreamWeaverでもタグ打ちは出来ますから、そこで見ながら修正すればいいでしょう。

この回答へのお礼

なるほど正確さから言えばテキストエディタに勝るものはないってことですね。改めてエディタの良さを痛感します。私もこれを機会にもう少しタグ打ちの習得に励むことにします。回答ありがとうございました。

お礼日時：2003/12/23 07:34

No.7 回答者： noname#5549 回答日時： 2003/12/19 23:46

こんにちは。

再度の回答です。
なにやら余計混迷を深めてしまったようで....

＞1.WebはHTMLなのに、どうしてMacとWinで見え方が変わるのですか？72dpiで共通してるならなおさら…？

確かにHTMLであることは同じですが、表示するブラウザ（Internet ExploreやNetscapeなど）が違うのは分かりますね？
さらに同じIEでもOSが違えば構造も（多少）違います。
さらにさらにフォントの表示はHTMLだけの責任ではなくシステム（OS部分）にも責任がありますので、又違ってくるわけです。
WEBクリエイターはこうった症状を把握し、経験値を積み重ね、正しく表示させています。

＞2.凝る人はJavaScriptなどでブラウザ、OSを判定し…済みません、意味がわかりません。今の私にはまだそこまでの知識がありません。

他の方の回答にもあるように、HTMLに挿入する形で使う言語に「JavaScript」があります。
今のウェブサイトはこの言語なしには語れません。
しかし、これもブラウザによって体系が異なり、必ずしも全てのブラウザで上手く動作するとは限りません。
そのJavaScriptを用いて、訪問者がアクセスしたときに使っているOSやブラウザの種類、バージョンを判定し、それぞれにに最適化したページを見せるわけです。
ここで、同じ内容のHTML自体を判定する種類毎に作るのも良いのですが、大抵の場合「スタイルシート」を用いて、フォントなどの見え方だけを変えるようにします。
この辺の構造は、ある程度HTMLとJavaScript、CSSを理解しないと全くもって意味不明です。

＞3.フォントサイズが変化しても対応可能なデザインにするのです。(Macだけでもフォントの表示サイズを変えれば擬似的に実現できます)…対応可能なデザインって？デザインがフォントで変化するのですか？

先にも説明したように、フォントの表示サイズはブラウザによって異なります。ですから、自分が想定した長さよりも長く表示されたりして、結局レイアウトが乱れてしまうわけです。
これを、伸縮してもバランスが崩れないデザインにしで、背景画像などを上手く使って配置する、という事です。

＞4.要らないと思っても様々な数値を省略してはいけないのです。…何の数値のことなのでしょうか？省略とは消すことなんですか？

これはHTMLを読める人で無いと分からないと思いますが、例えばテーブルの場合....

<table border="0" width="640" height="480" cellpadding="0" cellspacing="0">

なーんて感じで記述するわけですが、
この時、width（幅）やheight（高さ）の記述を怠ると、思わぬところでレイアウトが乱れたりするのです。

で、全体を見て感じたことですが、
おそらく皆さんのアドバイスを実践するには、
絶対的な知識量がちょっと足りないようです。

DreamWeaverを使い続けるなら、関連書籍を読みあさった方が良いでしょう。
DWでもJavaScriptやCSSは扱えます。要は慣れです。
あとは基本的なHTMLの知識。

頑張って下さい。

この回答へのお礼

詳しく教えて頂きまして感謝します。もう少しお願いしたいのですが、自分が考えたデザインをDreamweaverで制作してますが、それをブラウザで確認すると、テキスト部分ががデザイン位置よりずれて表示され、プロバイダのサーバーに転送して確認したら更にずれてしまいます。結局Webで正常に見えるように、オリジナルをずらして配置するのですが、これはDreamweaverでは当たり前の現象ですか？ゴミタグが邪魔をするのですか？その辺がDreamweaverの信用出来ないところなんですが、ソフトをGoLiveに変えても同じですか？ああいう矛盾した表示で何回も作り直しをしてます。ソフトで修正せずタグで修正するのですか？時間の無駄で困ってます。是非ともご教授お願いします。

お礼日時：2003/12/20 09:08

No.6 回答者： kiyomac 回答日時： 2003/12/19 16:21

A.コードの判定によってMac、ウインドウ、IE、ネスケ用の表示を作成する…コードの判定って何ですか？4種類のホームページを制作するのですか？

1,ジャバスクリプトのバージョンによってMac、ウインドウズ
を判定し、同ページに記入します。
2,OSを判定するジャバスクリプトを記入し、別ページにジャンプします。

B.この場合はフォントサイズ指定をポイントでなく『pt』で指定する…例えば<font size="3">ではなく、<font size="pt">にするってことですか？
font-size: 10px; line-height: 12em; color: #000000
と設定します。
C.テーブル形式を捨て、『カスケードスタイルシ－ト』で…返信用のフォームを作る時は、CSSの中でテーブルを作るのですか？
これは記載ミスで正解は『カスケードレイヤーシート』です。
ブロックをレイヤーとして作成してその中にテーブル構成、フイールドを作成します。
このレイヤー内データをフラッシュ形式で作成すれば
この表題の解決になる可能性は有ります。
ただし、テキスト情報が取得出来ませんので、
読み上げソフトは動作しないと考えます。

『テーブル形式を捨て』でも無く、実はフレーム構成を捨てたと言うのが正解です。
不適切な情報で失礼しました。

この回答へのお礼

まだまだ理解にはほど遠い私ですが、頑張って精進します。親切に答えて下さいましてありがとうございました。

お礼日時：2003/12/19 23:56

No.5 回答者： mayulilyca 回答日時： 2003/12/19 12:00

コツというか、確実に見た目を制御することができるのが

スタイルシートなんじゃないかな、と思った次第です。
ベースとなる文字サイズやらを一気に制御することが
できますので。

nowrapは、tableを指定するときに、<TD nowrap>という
具合で使います。タグがわからないと厳しいかな。
全部はわからなくても、とりあえずやってみるとよいと
思います。例題のページを見つけましたので、URLをつけて
おきますね。

Dreamweaverには、HTMLのクリーンアップ機能があったと
思います。
あまりアテにはしていませんでしたが、明らかなゴミタグを
多少は排除してくれたような気がします。

参考URL：http://www.asahi-net.or.jp/~bd9y-ktu/jirei_f/twr …

この回答へのお礼

アドバイスありがとうございます。とりあえずやって見ます。やって見ないと前に進みませんし。これで作表したものがずれなかったらラッキーなんですけど。

お礼日時：2003/12/19 13:04

No.4 回答者： kiyomac 回答日時： 2003/12/19 10:06

Macとウインドウで画面表示が異なる事は自明の事ですね。

それとIEとネスケにてもコードの解釈によって異なります。
ですから難しい問題です。
コードの判定によってMac、ウインドウ、IE、ネスケ用の表示を作成するのが、一番簡単なのかもしれません。
この場合はフォントサイズ指定をポイントでなく『pt』で指定すると軽減されるでしょう。
（解像度による表示には使えます。）
小生はテーブル形式を捨て、『カスケードスタイルシ－ト』で
サイトデータを作成しています。

この回答へのお礼

アドバイスに感謝します。幾つか質問があります。

A.コードの判定によってMac、ウインドウ、IE、ネスケ用の表示を作成する…コードの判定って何ですか？4種類のホームページを制作するのですか？
B.この場合はフォントサイズ指定をポイントでなく『pt』で指定する…例えば<font size="3">ではなく、<font size="pt">にするってことですか？
C.テーブル形式を捨て、『カスケードスタイルシ－ト』で…返信用のフォームを作る時は、CSSの中でテーブルを作るのですか？

以上の解説を宜しくお願いします。

お礼日時：2003/12/19 10:54

No.3 回答者： mayulilyca 回答日時： 2003/12/18 22:36

表示については、OSやブラウザによって違います。

それに、ブラウザで文字の大きさを（ユーザの任意で）
変更することができますし、使っているフォントの違い
もあります。どんな人が見ても「完全に同じように
見えるページを作る」ことは、WEB作成のプロでもなか
なか難しいようです。

確実に、かつシンプルにするなら、スタイルシートを
使って、フォントの種類とサイズを固定してしまうこ
とだと思います。

テーブルの中で、折り返しをしたくないのであれば、
nowrapを指定すればよいのではないでしょうか。

Dreamweaverに限らず、ソフトを使うとどうしても
無用なタグが入ってしまいます。それでは困る、と
いうことであれば、タグの知識をつけて不要なもの
を削除するのが一番だと思います。

この回答へのお礼

回答ありがとうございました。スタイルシートがコツなんですか？質問したいことがあるんですが、nowrapの指定ってどうするのですか？Dreamweaverで作ってブラウザで確認すると、『！』がたくさん表示することがありますが、あれもゴミタグと考えていいのですか？特別な意味がありましたら教えて下さい。

お礼日時：2003/12/19 08:41

No.2 回答者： raad 回答日時： 2003/12/18 18:56

「百聞は一見に如かず」ということで、実際にやってみてはどうでしょうか？

HP作成ソフトは確かに便利だと思います。
しかし、#1のhumourさんもおっしゃっていますが、ゴミタグが多く出力される欠点もあります。
テキストエディタで作成してみれば、自分で作っているのでどこが悪いのか、一目瞭然だと思います。
また、無駄な改行もなくなりHP全体が軽くなると思います。

ソースを確認してみましょう。

この回答へのお礼

現在作りかけているホームページでこのような現象が出ます。作って都度ページごとにサーバーに転送して確認してるのですが、MacとWinの画面が違うのです。時間がたっぷりあれば、私もタグ書きから作りたいのですが、なかなかおいそれとすぐにタグを憶えられるものでもありませんし、時間に迫られてしまうとソフトの方が早いと思ったのですが、こういう現象が出て…。回答感謝します。

お礼日時：2003/12/19 08:26

No.1 回答者： noname#5549 回答日時： 2003/12/18 15:02

こんにちは。

まず、ディスプレイの解像度は無関係です。
（見た目のサイズが「全体的に」異なるだけ）
それにどんなホームページも「72dpi」向けに作られます。96dpiの方が少数派。

で、何故表示が異なるか、原因はいつくかあるのですが、代表的なモノとしては「フォントサイズ」。
WinとMacでは同じ指定のフォントでも見え方が異なります。
ですから、凝る人はJavaScriptなどでブラウザ、OSを判定し、それぞれスタイルシートでフォントサイズを変更します。
そこまで出来ない場合は、フォントサイズが変化しても対応可能なデザインにするのです。
（Macだけでもフォントの表示サイズを変えれば擬似的に実現できます）

テーブルに関しては、ソースを見ないと何とも言えませんが、単純に書き方をミスったのでしょう。
WinとMacでテーブルの基本的な表示が違うなんて聞いたこと有りませんし。
ブラウザによって、補正してくれるミスが異なり、結果的に表示が違うというのは良く聞く話です。
だから、要らないと思っても様々な数値を省略してはいけないのです。

DreamWeaverは優れたソフトですが、ゴミタグが出るのも事実。
ソースは出来るだけ自分で確認した方が良いですよ。

この回答へのお礼

回答ありがとうございました。頂いたご返事から新たな疑問が出ましたので訊ねたいのですが…。

1.WebはHTMLなのに、どうしてMacとWinで見え方が変わるのですか？72dpiで共通してるならなおさら…？
2.凝る人はJavaScriptなどでブラウザ、OSを判定し…済みません、意味がわかりません。今の私にはまだそこまでの知識がありません。
3.フォントサイズが変化しても対応可能なデザインにするのです。(Macだけでもフォントの表示サイズを変えれば擬似的に実現できます)…対応可能なデザインって？デザインがフォントで変化するのですか？
4.要らないと思っても様々な数値を省略してはいけないのです。…何の数値のことなのでしょうか？省略とは消すことなんですか？

申し訳ありませんが、もう少し詳しく教えて頂けませんか。お願いします。

お礼日時：2003/12/19 08:10