win８の場合、サイトが壊れて表示される！

先日から８５０ｐｘ幅に設定している自分のサイトが上手く表示されなくて相談した者です。

症状は、通常なら、
横一列に「商品の購入」「特定商取引」「質問」「会社概要」「サイトマップ」「その他リンク」と並ぶナビが、

win8だと

一列目が→「商品の購入」「特定商取引」「質問」「会社概要」「サイトマップ」で

二列目が→「その他リンク」となって表示されていて、明らかに横幅が縮小されているという症状です。

家電店の方と色々と検討した結果どうやらwin８だけに起こる症状でした。

2000、xp、win7、は正常に表示されています。

win8でも正常に表示させる方法ってないのでしょうか？

他のosで正常に表示されているんで特別ソースやcssが悪いように思わないのですが？

精通されていて、出来れば正常に表示されない根拠をご説明できる方が居られましたら宜しく
お願いします。

No.13 回答者： k_kota 回答日時： 2013/03/02 20:17

わかってると思うならそれでいいんじゃないでしょうか。

具体例は例えばIE6でのボーダーとパディングの扱いとか。

その他山ほどありますし、そういうのはちゃんと学ぶのがあるべき姿で、自分で調べる方がいいですよと、少なくともOSとかブラウザに文句を言うのはそっちが終わってからですよ、と言いたいわけです。

多くの人に問題なく見せたいのかどうか、と言うのが焦点なので、
それを気にしないなら別に今までのやり方でも良いと思います、仕事でも無いのでしょうし。

ただ、WEBの正しいことは10年で全然変わってしまいますね。

この回答へのお礼

出きるだけ多くの方に見せたいですし、ネット販売が当社の仕事です・・

１０年で徐々に不具合が生じるなら、こんなにあせらないですが、IE１０で一気にWEBが壊れましたから、困っているんですよ！

山ほどって言ったって、IE10との違いはそんなに沢山あるのでしょうかねぇ～？

お礼日時：2013/03/02 21:10

No.12 回答者： k_kota 回答日時： 2013/03/02 10:17

>デフォルトに任せては崩れるのですか？デフォルトって分かりやすく言えば標準的な設定ですよね・

デフォルトと言うのは良くない表現かもしれません。
ブラウザの設定で変わる要素を指定しないで確認用のブラウザだけで見た目を合わせれば、他の設定でおかしくなる可能性があります。

>ブラウザで差分って？具体的にご指摘頂かないと理解できません
初期設定の文字のサイズが違う、CSSの解釈が違う場合がある、実装されている機能が違うなど。
基本的な事項です。

>読み上げって音声でってことですか？そんなの使用していません
あなたしか見ないならそれでいいです。
一番極端な例ですし、対応してない人も多いですがそういう事例があることは理解して下さい。

>フレーム枠を使用しています
frame要素を使うこととフレームワークと言うのは全く別な話です。
これも調べてからお話して下さい。
要するに、ブラウザ差分を吸収してくれる仕組みもあるからそれ使えばいいよねってはなしです。

>標準や推奨に近い書式で書く？それをお聞きしているんですがねぇ～
W3Cで調べるのがいいんじゃないでしょうか。

>全体的にうむー！ってかんじです・・
一旦WEBデザインの本くらい読んだほうがいいと思います。
わからないのは教えるのが下手だからと思うのは勝手ですが。
結構基本的なところでわかってないようですので。

この回答へのお礼

度々、ありがとうございます。

１、
CSSの解釈が違う場合って、verによって解釈が違ってくるってことですか？
例えば？


２、
フレームワーク、すみません。これは私の完全な読み間違えでした。

３、
教えるのが下手というより、具体的な陳述がないので主旨が解決できないってことです。

４、
基本的なところが分かっていない、って言われましても、実際１０年間何ら支障無しにwebをアップしているので、ある程度は分かっていると思っているのですが・・

お礼日時：2013/03/02 10:48

No.11 回答者： k_kota 回答日時： 2013/02/28 21:46

妥当なコードと言うのが正しい表現かは置いておいて、

ターゲットとするブラウザ、ユーザに可能な限り意図した通りに見られるもの。
通常はユーザを選ばない、ブラウザも選ばないで綺麗なのが理想だが、結構難しいので、適当に妥協点を置く。

デフォルトに任せないできっちりしているする。
ブラウザで差分が出るとことはケアする。
読み上げとかで使う場合も意識するべきではある。
場合によってはフレームワークを使うのも手。
表示できればいい、ではなくて、今の標準や推奨に近い書式で書く。

とかそれくらいですかね。
多分色々あると思いますが、職業でやってる人の方がより良い回答が出ると思います。

この回答へのお礼

１、
デフォルトに任せては崩れるのですか？デフォルトって分かりやすく言えば標準的な設定ですよね・

２、
ブラウザで差分って？具体的にご指摘頂かないと理解できません

３、
読み上げって音声でってことですか？そんなの使用していません

４、
フレーム枠を使用しています

５、
標準や推奨に近い書式で書く？それをお聞きしているんですがねぇ～

全体的にうむー！ってかんじです・・

お礼日時：2013/03/01 07:49

No.9 回答者： k_kota 回答日時： 2013/02/27 22:25

基本的にweb画面はブラウザが描画しますので、ブラウザの確認が必要です。

今までOKだったブラウザはどれで、同じブラウザでwin8だけだめで他のOSならOKというならOSの問題です。

ただ、WEBサイトはクライアントを選ぶ権利はなく、一般的なブラウザは可能な限りサポートするのが基本です、もちろん古いものは切り捨てる場合もあります。

そのために標準と言うものがありますし、それを気にしてれば多少のことがあっても崩れません。

逆に言うとこれまでクセのある環境に特化して作ってたのであれば、標準化に合わせて崩れるかもしれませんし、そうじゃなくてもブラウザの設定範囲での変更で崩れるサイトは結構多いです。
※なのでみなさん確認したブラウザが何かを気にしてます。

なので、win8の人をあなたが切り捨てるのかどうかはあなたの自由です。

正常に表示させるにはバージョンの差分の影響を受けにくい妥当なコードを書くという事になります。それには結構勉強が必要です。
スマートフォンやタブレットも最近はありますしね。

UserAgent見て振り分けるってのもありますけど、サーバ側での仕事が必要です。

この回答へのお礼

妥当なコードとはどんなコードですか？

お礼日時：2013/02/28 13:20

No.8 回答者： Green_Tree 回答日時： 2013/02/27 15:02

#7です。

＞特別、VERを意識して作ったサイトではないのですが・・

逆に意識していないから崩れるといったこともありますが。
IEに限らず、他のブラウザでも表示が違うことはあります。
かなり前になりますが、自サイトが異なるブラウザで表示が違ったため、そのブラウザにあわせてCSSの記述を書き加えたことがあります。
そういった記述の変更や追加などが必要になることもあるんです。

で、互換表示での確認はされたんですか？

あるサイトに下記のコメントがありました。
「IE10は、HTML5やCSS3、ECMAScript 5、WebSocketなど、IE9では対応していなかった様々な最新の技術をサポート」

こういったことから、IE10で表示が崩れるといったトラブルは出ています。
検索すれば一杯出てきますよ。
IE10に対応した記述をするか、強制的に旧バージョンでの表示にする記述もあるようですが、具体的にはわかりません。

表示が崩れる理由を知りたいということだったので互換表示の確認をお勧めしたのですが、互換表示で正常になるならば、IE10でも正常に表示できる記述について新規に質問を立てたほうがいいんじゃないでしょうか。

この回答へのお礼

なるほど・・
けど、IE10は、HTML5やCSS3、ECMAScript 5、WebSocketなど、IE9では対応していなかった技術ってありますが、

これって新たに付加された技術であって、旧の技術を否定するものではないように思いますが・・

けど、実際に壊れているんですからしかたないですかね

お礼日時：2013/02/27 19:19

No.7 回答者： Green_Tree 回答日時： 2013/02/27 12:48

IEのバージョンによって、表示のされ方が違うことがあります。

まずは試しに、互換表示でどのようになるか確認してみてはどうでしょう。
http://support.microsoft.com/kb/2772016/ja

ついでにIE10のトラブル対処法
http://support.microsoft.com/kb/2772010/ja

尚、インターネットオプションのフォント設定が他のバージョンのものと同じであることを確認してください。
互換表示で、以前のバージョンと同じように表示されたのならIE10の表示問題が原因でしょう。

この回答へのお礼

特別、VERを意識して作ったサイトではないのですが・・

全てのVERに対応する方法ってあるのですか？

可也、難しい質問ですかね・・

お礼日時：2013/02/27 13:52

No.6 回答者： x-1919 回答日時： 2013/02/27 09:01

一点訂正。

昨日 2/26 のことだが、マイクロソフトは Windows 7 向けの IE10 を正式公開してた。
Windows 7 に IE10 を入れてみればブラウザについては Windows 8 と同条件になるわけだからデザイン確認の作業もはかどると思う。

ただしそのサイト、閲覧者のブラウザを限定できる環境 (社内とか) じゃなく広く一般公開するのなら、IE 以外の有名どころのブラウザでも確認することをお勧めする。

この回答へのお礼

ありがとうございます

お礼日時：2013/02/27 09:36

No.5 回答者： x-1919 回答日時： 2013/02/27 08:51

原因は IE10 って線は硬いと思う。

（少なくとも質問者の見えている範囲ではね）
IE9 以前のものに比べて IE10 は 「IE 以外のブラウザ」 と同じように描画しようとするブラウザなので、むしろ Windows 8 だけで表示が狂うっていう認識じゃなくて、Mac の Safari、Google Chrome、Firefox などでも同じようにレイアウトが崩れて表示されてるんじゃないかって点、確認してみてはどうだろうか。
IE9 以前のブラウザは特殊なんだよ。
まぁ IE9 はがんばっているほうだけど、IE8,7,6 なんて目も当てられない。
つまり Windows 2000, XP, 7 (というかそれらの Windows 用の IE) でのみ正常に表示されているっていう、、、
私は Web デザインの知識があるわけではないのでソースを見てもチンプンカンプンだけどね。

この回答へのお礼

ですが、そうならもっとネット上でも問題になっているんじゃないですかね・・

お礼日時：2013/02/27 09:35

No.4 回答者： nanden1548 回答日時： 2013/02/27 07:35

販売店の店員の知識がどの程度かが問題ですが、他の方も言われているように、ブラウザには問題がないので、ソースがおかしいのでは？・・・としか言えません！

ソースをアップされてみてはいかがですか？・・・
HTMLとＣＳＳがあれば、適切なアドバイスができます。

この回答へのお礼

ソースっていいますが、では2000、xp、win7、で正常に表示されて、WIN8、IE10では正常に表示されないソースって考えられますか？

一応、今回はナビのソースを添付しますが、仮にこのソースに不具合があったとしても、では2000、xp、win7・で正常に表示される根拠は説明できますか？・・多分、できないのではないですか・・

そんな不具合ネット検索でも出てきませんがねぇ～・・？



div.navi a{
font-size :12px;
border:outset #33ffff 4px;
background-color: #3399ff;
color:white;
margin:0px 0px 0px 0px;/*間隔１*/
padding:0.25em;
display:block;
width:16.6%;
float:left;
}

お礼日時：2013/02/27 08:38

No.3 回答者： oioi_douda 回答日時： 2013/02/26 21:06

>けど店頭に並んでいるデスプレイでwin８だけがIEのverが違うってことないと思うよ・・

Windows8でしか現状IE10が出ていないから。
Windows7にもIE10は提供されるとは発表されてはいるけどまだ正式版は出ていない。

>逆にosじゃないっていう根拠ありますか？
Webサイトの描画はWebブラウザの描画エンジンがやるからOSは関係ない。

この回答へのお礼

けど、IE１０で今回のような不具合が生じるなら、もっと、ネット上でも問題になっているでしょ。

検索してもヒットしませんから・・

お礼日時：2013/02/27 08:25