ローカル環境とネット環境でホームページの文字の大きさが違う

質問

Weboxというツールを使って、あるウェブサイトをまるごとダウンロードしたのですが、InternetExploreを使って閲覧すると、ローカル環境とネット環境とで、文字の大きさが一部異なる箇所があります。
(Firefoxでは一致しています)
CSSファイルのリンクはちゃんとできているので、なぜ違いがおこるのかがさっぱりわからないです。
ウェブサーバ側でなにかしらの補修をしているくらいしか考えつかないのですが、そんなことってありえるでしょうか？
またそれ以外にどんな原因が考えられるでしょうか？

どうか宜しくお願いいたします。

回答No.9

dora501 · ベストアンサー

成る程、apraxasさんの環境では違いますね（＾＾；

今少し時間があったのでソースも簡単に観てみたんですが、やはり Dreamweaver 使用してます？

余計な事かもしれませんしこの件にどれほど関係があるかは判りませんが…
自分が知る限りは、どのHP作成ソフトもレイアウトの際にかなり強引なソースを吐きます。
折角 xthmlでＣＳＳにしても、気をつけてないとインライン要素の中にブロックレベル要素を置いたりＣＳＳがあるのにhtmlタグでレイアウトを辻褄併せしたり…といった無茶なソースになりますからレイアウトを決めた後にソースの検証・手直し等をして気を付けた方が良いかと（＾＾；

Dreamweaver でローカル検証するとオンとオフのレイアウトがずれる…という話を聞いた事ありますけど、apraxasさんは WeBox からの保存ですもんね…。
キャプチャーを見る限りはＯＳやＩＥも同じですしＣＳＳが関係している事だから後は記述方法が何等か作用しているとしか理由が思いつかないですね。

今仕事場のＰＣなのでＣＳＳファイルは確認出来ませんが…
この感じだと恐らくはＣＳＳの＜div class="white_background"＞部分のクラス内容の記述と html 上でその中の＜span style="font-size: x-small"＞が原因でしょうね。

時間がまだあるなら、早く帰宅出来れば自分で判る範囲をもう少し確認してみますね。

お礼

なるほど。
"font-size: x-small"があやしそうですね。
ちなみにDreamweaverは使っていないです。

とりあえず一旦、締め切らせていただこうと思います。
大変お世話になりました。
また機会があればよろしくお願い致しますm(_ _)m

回答No.8

dora501

あら…
マイキャビって、nifty IDないと観れないんですね…
今気づきました、すみません。

キャプチャはここに移しました。
http://blog.goo.ne.jp/apprentice_dora/e/43a6fadaea695d9672535e77963a5129

お礼

遅くなって申し訳ありません。
確かに、IEのONとOFFで全く同じの表示になっていますね。
私の環境ですと、レイアウトに違いがあるのが
不思議です。

http://blogs.yahoo.co.jp/sweetplucky2000/

とはいえ、見ず知らずの私のためにここまでやってくださる
とは、世知辛い世の中における感動的な出来事です。
本当にありがたいです。

回答No.7

dora501

お待たせしました。

１）IEのオン・スクキャプ
https://cabinet.nifty.com/photo/owner/view_image.do/vcvkq/@nifty/photo/ie_on.jpg?type=big

２）IEのオフ・スクキャプ
https://cabinet.nifty.com/photo/owner/view_image.do/vcvkq/@nifty/photo/ie_off.jpg?type=big

３）webcapという全画面キャプソフト（IEエンジン/Trident使用）のスクキャプ。
https://cabinet.nifty.com/photo/owner/view_image.do/vcvkq/@nifty/photo/on.png?type=big

４）３の全画面キャプ
https://cabinet.nifty.com/photo/owner/view_image.do/vcvkq/@nifty/photo/%E3%83%87%E3%82%B6%E3%82%A4%E3%83%B3%E3%83%BB%E3%83%87%E3%82%B6%E3%82%A4%E3%83%8A%E3%83%BC%E3%82%BA%E4%BD%8F%E5%AE%85%E3%81%AE%E4%BA%8B%E3%81%AA%E3%82%89%E5%90%8D%E5%8F%A4%E5%B1%8B%E5%B8%82%E3%81%AE%E3%82%A8%E3%83%8A%E3%83%9F%E3%83%9B%E3%83%BC%E3%83%A0%E3%82%BA%E3%81%B8%EF%BD%9C%E6%96%BD%E5%B7%A5%E4%BE%8B.png?type=big

５）３のソフトでオフのスクキャプ
https://cabinet.nifty.com/photo/owner/view_image.do/vcvkq/@nifty/photo/off.png?type=big

６）５の全画面キャプ
https://cabinet.nifty.com/photo/owner/view_image.do/vcvkq/@nifty/photo/index.html.png?type=big

１と２だけでは判りにくいと思い、全画面キャプソフトでも撮りましたけどキャプ画面だけでは見分けがつかなかったので３・５を付属。
でも結局はこの３・５のURLと４・６のファイルネームの関係を信じて貰うしかないんですけどね（＾＾；

あ…４はURLに２byteが入ってるから貼るとこうなってしまうので開けない場合は各リンク先右上のページ送りで辿れますので。
締め切ってから適当に削除しますね。

回答No.6

dora501

今はしてませんが自分もちょろっと触ってたし今でも興味がある分野ですから自分の為もあるんですよ、それにまぁ今は暇人ですからお気になさらずに（笑

トップ以外は殆ど確認してなかったのでレイアウトも違うと言う事なのでIEで確認と、ついでにFXとsafariでも見てみました。

やはり当方の環境ではIEのオンオフ同じなんですよね・・・。
OSの違いかフォントの関係、もしくはIEのバージョンが関係してるんだと思いますが一番怪しいIEがCSSに関してかなり曲者ですからね…。
IEは７からCSSの対処を変えたからオンオフで何処か対応が違うのかもしれませんね。

まぁ後は参考までに…
トップ以外は流石に当方の環境でもオンのIEとFXでレイアウトのズレがありますね。
あとsafariは流石にトップから行間等が他と違いますけど各子ページを軽く確認したところsafari同士のオンオフでの違いはなかったです。

お礼

いやいやありがたい限りです。
ブラウザによって表示の違いがあるのはいいとして、
問題は同じIEにもかかわらずオン、オフで表示が違うところが
不可解です。
しかし、回答者様の環境ですと同じというところが
ますます不可解です。
もし可能でしたら、「施工例」のスクリーンショットを
IEのオン、オフで頂けるとうれしいです。

回答No.5

dora501

あら・・・画像は別枠で開かないんですね(^_^;)
一応、IEとIEのオンオフ・FXとIEをオンオフ両方で透過処理かけて重ねたショット画面（1280×800）を撮ってるので必要であれば云って下さい、どこか適当にうｐしますので。

回答No.4

dora501

私の環境で同じようにＴＯＰページだけですが試してみました。
まず、オンライン上で両プラウザ（IE と Firefox）で確認したところ違いはありませんでした。
次に WeBox で当該サイトをＤＬしてＩＥからローカルで開いてみましたが私の環境ではＩＥのオン・オフと FIrefox と三つ同じになってました。

※参考までに当方の環境
OS XP/SP3
IE6
Firefox3.05
メイリオ入れてClearType指定で ClearTypeTuningControl 入れてます。
OS/IE/Firefox フォント指定可の部分はメイリオにしてるのでサイズは下げてます。

ん…質問者さんの環境でも文字サイズのみの問題でレイアウトは関係ないのであれば閲覧環境と font-family の問題だと。
私も勉強不足で、ここがこうだから…と断言出来ないので申し訳ないですが詳しくは下記リンクを参考に。

え…それと質問者さんはサイト作成者さんですか？
私の勘違いで違ってたら申し訳ないですが…。
CSS をここまでするのなら ヒラギノ角ゴ Pro W3 は英字表記にしてメイリオの指定も入れた方が良いかと思いますよ。

参考：Adobe.com
http://www.adobe.com/jp/devnet/dreamweaver/articles/css_takano.html
webデザイナーのナナメガキ：
http://loconet.web2.jp/blog/archives/2007/02/cssfontfamily.html
ここも参考になるかも？
http://h-fd.spaces.live.com/blog/

お礼

大変お手数お掛けしまして恐縮の限りです。
お金払わないといけないくらいですね。
ＩＥのオン・オフとで全く同じとは驚きました。環境によるんですね。
話がややこしくなると思って書かなかったのですが、私の環境だと
「施工例」とかの他ページだと文字サイズばかりでなく、オンとオフでレイアウトも変わってしまうのです。
いまいち釈然としませんが、ここまでお付き合いして頂けるとは感謝感激です。

回答No.3

dora501

ん・・・判るかどうかわかりませんが、時間も同ソフトはあるので試してみます（笑

補足

なにとぞ宜しくお願い致します m( _ _ ;)m

回答No.2

dora501

あ…少し勘違いしてました、すみません。。。

該当サイトの総てのソースを見てみないとはっきりとは言えませんが…
当該ページにパスがきちんと通ってない記述があるのでは？
絶対パスだとローカルではパスが通らない場合もありますので。

補足

htmlファイルをしらみつぶしに見ましたが、
リンクをミスってる所はなさそうです。

該当サイトは、http://www.enamihomes.jp/　です。

Weboxでサイトをまるごとダウンロードして、index.htmlをネット上から、ローカルからそれぞれIEで閲覧すると、ページ頭の文字の大きさが違います。
一体なぜなのでしょうか……。

回答No.1

dora501

ＩＥ（InternetExplore）のバージョンが判りませんが、Firefox とは違って見えるのはおかしくないです。
ＩＥと Firefox では html や CSS の対応が違いますからね、プレーンなテキストのみのサイトならまだしも同じに見えるサイトを作る方が苦労しますよ。

補足

ご回答ありがとうございます。
説明不足で申し訳ありません。

ＩＥとFirefox での見え方の違いではなく、
同じIEにもかかわらず、ローカルファイルか「http」がつくネット上のファイルかで見え方が違ってしまうのです。
ローカルファイルの方だと一部の文字(h1など)がやや大きめに表示されるのです。
どういった原因が考えられるでしょうか？