- ベストアンサー
IEと、他ブラウザの表示がうまく合いません
Dreamweaver CS3、macにてHPを制作中なのですが、safariやクローム、オペラで確認する表示と、 IEで確認する表示が異なり、困っています。 文字詰めやフォントもそうなのですが、IEで表示するとサイドのメニューバーの高さがページによって変わってしまう（広がる）ことに一番困っています。（メニューを選択した際、右側に表示される内容が多くスクロールが発生する場合） テーブル設定の問題？とも思ったのですが、IEだけなので困っています。 文章での説明分かりづらいかもしれませんが、この現象を回避できる方法をお教え頂ければ幸いです！どうぞよろしくお願いします。
- mohuneco3
- お礼率10% (6/60)
- ホームページ作成ソフト
- 回答数2
- ありがとう数5
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
DreamWeaberでそのようなページできないはずですが・・・ IEで表示が大きく異なる原因は、互換モードで動作することが最大の要因になる事が多いです。 IEの互換モードは、他のブラウザを駆逐するためにのかって第一次ブラウザ戦争( http://ja.wikipedia.org/wiki/%E3%83%96%E3%83%A9%E3%82%A6%E3%82%B6%E6%88%A6%E4%BA%89#.E7.AC.AC.E4.B8.80.E6.AC.A1.E3.83.96.E3.83.A9.E3.82.A6.E3.82.B6.E6.88.A6.E4.BA.89 )の名残で、ＩＥは斬新な独自仕様を取り入れてＯＳと抱き合わせで頒布して他のブラウザを駆逐してしまいました。ブラウザによるOS不要を目指したNetscapeを危険と判断したのです。--結果的にその時代は来てしまいましたが-- 『互換性のないフォーマット毎に分け隔てられた世界に分割され、すべての関係者にとっての商業的可能性が減少することとなるであろう、大きなリスクを負うこととなる。( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/intro/intro.html#h-2.2.1 )』と危惧を抱いたW3Cなどによって、『どんな環境からもWebの情報を利用できるようにすべきだという方針の下に開発されている。例えば、様々な解像度や色深度のグラフィックディスプレイを持つPCや、携帯電話、モバイル機器、音声入出力機器、帯域が広いコンピュータや狭いコンピュータ、等の環境である。( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/intro/intro.html#h-2.2.1 )』としてウェブ標準が提唱され、多くのブラウザがそれに従う中、ＩＥ勝手の独自仕様で作られたサイトへの対応から、ウェブ標準への対応が大きく遅れました。また、そのようなサイトを利用するために互換モードを持っています。 ★ここまではウェブ開発者は知っておくべき--リンク先を読んでおくこと。 ＩＥを標準モードで動作させるためにはDOCTYPEスイッチを正しく記述する必要があります。DreamWeaberCS3は古いためデフォルトが異なりますので修正する必要があります。 DOCTYE宣言を HTML4.01Transitionalでしたら、 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> HTML4.01Strictでしたら、 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> と記述することで、他のブラウザと合うはずです。 ⇒DOCTYPEスイッチ－HTMLの基本( http://www.htmq.com/htmlkihon/302.shtml ) なお、 ＞文字詰めやフォントもそうなのですが、IEで表示するとサイドのメニューバーの高さがページによって変わってしまう（広がる）ことに一番困っています。 それ以前の問題も含んでいます。 そもそも『HTMLは、どんな環境からもWebの情報を利用できるようにすべきだという方針の下に開発されている( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/intro/intro.html#h-2.2.1 )』のですから、スマホのような小さな画面でも、視覚障害者がフォントやそのサイズを指定しても、利用しづらくなったらダメなのです。 リキッドで表示幅を小さくしてもスクロールが必要になったりはまずいのです。 HTML5を目前にした状況では、HTML4.01strictで作成しましょう。
その他の回答 (1)
- dragon-man
- ベストアンサー率19% (2699/13646)
ブラウザはHTML+CSSの文法に沿って解釈、表示するソフトです。解釈の仕方（表示の仕方）はブラウザによって幾分異なります。文字フォントはweb側が特定のものを指定してなければ、ブラウザの標準フォントが使われます。Windowsの場合、おそらくMSPゴシックが使われるでしょう。Macの場合は知りません。その表示の仕方（行間、フォント、文字詰めなど）はブラウザによって多少異なります。どれがいいかは好き好きです。ブラウザによって違いが起きないようにするには、webデザインの際フォントを特定のものを指定するべきです。私はメイリオを使っています。今はWindows,Macとも普及しているはずです。 web表示画面以外のメニューバーやタスクバーはHTML文法と無関係です。ブラウザ製造者が自由にデザインでき、ブラウザごとに異なります。これも好き好きです。表示の仕方もオプションなどで変えられるものが多いです。それがブラウザごとに（IEだけが）違うのが気に入らなければ、IEを使わなければいいだけのことです。 「メニューを選択した際、右側に表示される内容が多くスクロールが発生する場合」という意味がいまいちよく分かりませんが、スクロールが発生しないように表示ウィンドウ（Macでは何というのか？）を十分に広げればいいだけのことでしょう。そのもとになるモニタ画面のサイズはいろいろですから、web作成者はそれに見合った大きさにデザインすべきです。出来たら１５インチ程度の小さなモニタを想定して、（少なくとも横方向の）スクロールが発生しないサイズにwebデザインするべきです。そうしないと小さなモニタを使っている人は見づらいので見てくれないでしょう。 ちなみに上部のメニューバーやタスクバーの面積（上下幅）をいちばん小さくできるのはIEだと思っています。
関連するQ&A
- Safariの表示と他ブラウザの表示の違い
HPを制作し、その表示確認にはwinのIE/NN/Firefox/Opera、Mac/IEを使用していますが、Safariで確認できる環境にありません。Safariってどんな感じでしょうか？上記で確認してOKなら、Safariでも大丈夫（そうな）感じですか？また、CSS等の扱いで、Safari独特のものなどもしあればお伺いしたいのですが。
- ベストアンサー
- CSS
- IEと他ブラウザでの行間について
CSSにてレイアウトを行っていますが、IEで表示したとき行間が詰まってしまいます。 全体的に狭くなってしまうのはもちろんなのですが、 たとえば文章と文章の間を<br><br>で一行開けた場合も、Firefoxなどでは -------------- 一行目 二行目 -------------- となってくれるのですが、IEだと -------------- 一行目 二行目 -------------- につまってしまいます。 作成環境はMacOSX、DreamweaverCS3 確認はmacでFirefox3、Safari3、Opera9.5、Netscape7.1です winでIE6、Firefox3です。 ブラウザ間の表示誤差をできるだけ少なくするにはどのような指定方法がよいのでしょうか？ CSSのフォント関係の指定の部分のみ抜粋します。 html {font-family:'Verdana', sans-serif; color:#444444; font-size:66%; line-height:2.0; letter-spacing :0.2em; } これは小さなことなのですが、他にもIEでの表示でつまづくことが多いので困っています。
- ベストアンサー
- HTML
- IEで表示されない！
初めて、ホームページをMacでDreamweaver CS3を使用し、作成しました。 「ブラウザの互換性」で問題がないことをチェックしアップしましたが、 firefox,safariで問題なく表示されますが、IEで全く何も表示されない状況です。 原因はどういったことが考えられるのでしょうか？？ かなり困っております。。。。
- ベストアンサー
- ホームページ作成ソフト
- IE7でだけ作ったメニューが表示されません。
サイトを作っているのですが、IE7でだけHOMEやImageなどのメニューが表示されません。safari,firefox,operaでは表示されました。 どうしたら表示できるのでしょうか？ またここはこうした方がいいなどHTML,CSSのアドバイスなどもして頂けるとうれしいです。 よろしくお願いします。
- ベストアンサー
- HTML
- WINのIEのプルダウンメニュー
WINのIEのプルダウンメニューだけ、右側にスクロールバーが出て全部表示されないことってありますよね？ あれって、回避できるのでしょうか？ あと、一つ分だけ伸びてくれるだけでいいんですけどね、、、sizeを入れると表示が変わるし、、、(^-^;)
- ベストアンサー
- HTML
- Dreamweaverでブラウザ表示が崩れます
ウェブサイト制作に、Dreamweaver CS6を使用しています。作業中、ブラウザで表示すると、レイアウトした画像や文章などが全て左に寄ってしまう（ヘッダーやフッター、サイドメニューなどどのページにも共通な部分以外）、という問題にぶつかっています。 素人で、調べながら作業していまして、作業中に手違いをしてしまったものと思われます。 解決方法を御存じの方がいらっしゃいましたら、ご教示お願い致します。
- 締切済み
- CSS
- ブラウザが違うと制作中のHPの表示が異なってしまう
HP制作初心者です。 macのテキストエディットでHPを作っているのですが、だいたいのレイアウトや全体像ができたところでWinのIE（バージョンまでは確認していません…）で表示してみたところ、レイアウトやフォントなどmacのsafariとかなり違いがありました。 制作中のHPをおおまかに書くと、背景などは使っていなく（白）、すべてosakaフォントの10pt～7pt、基本レイアウトはcssによるヘッダ・本体・（フッダ）の構成でfloatは使っていません。 レイアウト崩れなど回避できた所もあるのですが、 今解決できないのはWinのIEではフォントの違い（→WinではMS Pゴシックが表示されるようにしています。その他sans-serifとsans-serifに分類されるフォントも指定しています）によって字詰めや大きさが変わってしまう（ひとまわり小さくなるようです）、古いIEでは定義タグが一部効かない箇所がある、トップページは中央に画像一つとコピーライト（画像）なのですがフッダで画面の下に配置したコピーライトが中央の画像にかぶってしまう。などです。 自分の環境がmacのsafariとfirefoxしかなく、調べてみるとIE6などバグが多く発生するらしいもののシェア率がかなり高いようなので、いっきに不安になりました。 なんとなく全ての環境で同じように見えるというのは無理そうな事が分かってきたのですが、ブラウザが変わっても、見え方が近くなるこつなどはあるのでしょうか？ また、HP制作でそれらをさける為にまずやるべきこと。などがあれば教えていただきたいです。 HP制作用のソフトを使えばいいのか？など分からないことだらけなのですが、何かアドバイスなどあれば、よろしくお願いします！
- ベストアンサー
- CSS
- 各ブラウザで表示するには
はじめまして。 現在HPを作成してるのですが、IE8・firefoxでは罫線が表示されるのに、googleghromeとsafariでは表示されない状態です。 何らかの記述が必要なのでしょうか？当方最近HPを作成し始めばかりで、何が原因なのか見当がつきません。 ご教授の程、宜しくお願いいたします。 制作環境 OS:Win7 ソフト:DreamWeaber CS5
- 締切済み
- ホームページ作成ソフト
- IEでの正しいサイトの表示確認がしたい
自分のサイトをsafari、firefox、operaで表示確認をしているのですが とりあえず３つのブラウザでは正しく表示されていました。 しかし、最近漫画喫茶にある本物のIEで確認した所、 かなり表示が崩れていた為、とてもショックを受けました。 当方OSXを使っているのですが macでもIEでの表示確認が出来るソフトはありますでしょうか？ IE6や7で簡単に確認できる方法がありましたらお教え下さい。
- ベストアンサー
- Mac
- Flash8のフィルタがIEだけで表示されない?!
Flash8で制作したデータで、ムービークリップにフィルタ（ベベル）をかけたものがWinのIEでだけ表示されません。 MacOSXではFirefox、Safari、Opera、NN（いずれも最新Ver）、IE5.2で正常に表示されます。 WinXPではFirefox、Opera、NN（いずれも最新Ver）で正常に表示されますが…IE6だけ、フィルタをかけた部分だけが表示されません。 他の部分は正常に動作・表示されるのですが、その部分だけ欠けている（透明になっている）のです。 同じような症状が見受けられた方、いらっしゃいますでしょうか？ 何か解決策があれば宜しくご教授ください。
- 締切済み
- ホームページ作成ソフト
補足
ご回答ありがとうございます。 「メニューを選択した際、右側に表示される内容が多くスクロールが発生する場合」 分かりづらくてすみません。 メニューとは左側に表示する ・ホーム ・会社情報 ・採用情報 などの事で、それらをクリックしたとき右側に内容が表示されるようにしたいのです。 しかし、「会社情報」が長くなり、下へのスクロールが発生すると、左側のメニュー ・ホーム ・会社情報 ・採用情報 の行間（高さ）にばらつきが発生してしまうのです。 それがブラウザごとに（IEだけが）違うのが気に入らなければ、IEを使わなければいいだけのことです。 自分はmacなのですが、やはりwindows、IEを使用する人の方が多いと思うので、それを想定してページを作成したいのです。 他のサイトはsafariで見てもIEで見ても大差ないので、自分の作り方が悪いのだと思うのですが、 初心者故うまくいかない状況です。