ブラウザ互換について - 1262867677

1：たかさん（管理人）：2010/01/07(木) 21:34:37: ブラウザやバージョンによっての表示の誤差はクリエイターとして一番厄介なポイントです。
デザイン時に困った点や解決方法・知っておくと便利なツールなどの情報を書き込むスレッドです。
2：たかさん（管理人）：2010/01/07(木) 21:45:07: 一見同じように見える場合でもブラウザによって、またはバージョンによって表示が変わってきます。
レイアウトが崩れない程度で妥協する必要もありますが、表示の違いの確認はいずれにせよ必要です。

marginやpadding、borderの点線、form関連、あたりが違いが出やすいようです。

確認するツールとしては以下のようなものがあります。

Adobe BrowserLab

https://browserlab.adobe.com/index.html

WindowsXP

•FireFox 2.0
•FireFox 3.0
•FireFox 3.5
•Interner Explorer 6.0
•Interner Explorer 7.0
•Interner Explorer 8.0
•Chrome 3.0
OS X

•Safari 3.0
•Safari 4.0
•FireFox 2.0
•FireFox 3.0
•FireFox 3.5
BrowserLabでは以上のブラウザチェックができます。

アップしたデータの確認はできますが、ローカルにあるデータでは確認できません。

--------------------------------------------------------------------------------

IE Tester

http://www.my-debugbar.com/wiki/IETester/HomePage

IE5.5 IE6 IE7 IE8 が確認できます。

IE7.0以上をインストールしておく必要があります。

--------------------------------------------------------------------------------
Internet Explorer Collection

http://finalbuilds.edskes.net/iecollection.htm

IEのバージョン１．０から８．０までを試すことができます。

また、上記のサイトではWindows９５からのどのOSがどのIEのバージョンに対応しているかもわかります。

あまり古いバージョンまで検証する必要はないので、古くてもIE5.5以上で良いと思います。
3：たかさん（管理人）：2010/01/11(月) 08:35:32: もう一つリリースされました。
こちらはマイクロソフト製なので、純正の安心感があるかも…

Microsoft Expression Web SuperPreview for Windows Internet Explorer
http://www.microsoft.com/downloads/details.aspx?FamilyID=8e6ac106-525d-45d0-84db-dccff3fae677&displaylang=en

IEの６．７．８をウインドウを分割して見比べることが出来ます。
６と８ではフレーム系・マージン、パディング系がだいぶ違うようです。
とりあえず、大きく崩れるようでなければＯＫでしょう。
4：たかさん：2010/02/10(水) 22:14:47: いよいよ、サイトもアップと佳境になってきました。
レイアウト等で苦労すると思いますが、現状でブラウザを色々と使って試しましたが、
レイアウト崩れを起こしていないのはzapさんとＳＹさんだけでした。
一応、学校のモニターで崩れを起こしていない場合でも、ワイド画面でみると大幅に崩れる人も
数名。
これはコンテンツの幅指定をしてある状態で囲んでいないので、画面によって崩れます。

また、学校で確認できない部分としてＩＥ６への対応があります。
特にフレームを使っている場合は、最悪表示しないことも考えられるので、実機があるようでしたら確認しておくと
良いでしょう。

上で紹介した、Adobeのブラウザラボでも確認できます。
ＳＫさんのサイトデザインはほぼ完璧でしたが、マイナーなブラウザsleipnirでは記事部分が下へ回り込んでしまいました。

また、DTD宣言と使っているタグの一致がないと言う場合は、XHTML形式を使っていないかを確認すると良いでしょう。
5：たかさん：2010/02/16(火) 23:01:14: 学校は修了しましたが、もっと学びたかったと言う人はいませんか？
色々なアプリケーションもそうですし、ビルダーを買ったと言う人もいるでしょう。
また、自分で作成したサイトもブラウザによって表示が崩れてしまった方は原因を知りたいのでは？

まだ就職まで時間があり、スキルアップに勉強したいという方は、ここに書き込んでください。

○何についてやってみたいか？
○持ち出せるＰＣ（モバイル＆ノートパソコン）を持っているか？
○学習するための場所がないか？（できれば無料、あるいは電源、ネットワークのある教室）

などの情報を共有していきましょう。

とりあえず私の知っているところとして、本日打ち上げをした近くのヤングジョブの入っているビルの上に
会場を借りられる所があります。
また、インターネットカフェのようなところでも少人数ならできないでしょうか？

場所は限定しませんので書き込んで見てください。
6：＜削除＞：＜削除＞: ＜削除＞