聞いたことがあるかもしれませんし、この敵と向き合ったことがあるかもしれません。 Internet Explorer (IE) は、Web デザイナーにとって最悪の悪夢であることがよくあります。これは、常に時代遅れであり、少し風変わりであり、人気がありすぎて無視できないためです。 Windows オペレーティング システムにはすべて IE がプリインストールされています。つまり、非常に多くのユーザーが、より優れたブラウザーに切り替える代わりに、このブラウザーを定期的に使用しています。 面倒すぎるのかもしれませんし、切り替える方法や切り替える理由を知るほどコンピューターに精通していないのかもしれません。 皮肉に思われるかもしれませんが、私は現在 IE を使用してこの記事を書いています。 なぜなら 私はウェブ開発者です。 Internet Explorer でサイトを適切に動作させることができれば、Firefox でさらにうまく動作することを私は知っています。
一部の Web デザイナーは IE を完全に無視することを選択し、サイトを最大限に活用したい場合は Firefox または Chrome をダウンロードするのが最適であることを訪問者に知らせます。 しかし、インターネット ユーザーのほぼ 5 分の 1 が IE を使用しているため、このソリューションは最も賢明な方法ではない可能性があります。 他の人は、Web サイトを IE9 に準拠させ、古いバージョンではなくすることを選択する場合があります (IE9 は Firefox、Chrome、およびその他の標準準拠のブラウザーとほぼ同じくらい優れているため)。 しかし、IE8 を使用しているユーザーはほぼ 9% であり、IE9 を使用している 6.4% を上回っています。
それで、何をすべきですか？ Web デザイナーとして、すべてが失われるわけではありません。 デザインがすべてのブラウザーで適切に機能し、IE でサポートされていない要素、特に IE9 より古い要素を使用している場合に適切に機能を低下させるためにできることはいくつかあります。 私は、IE6 以前と互換性のあるサイトを作成しようとすることを拒否していることを認めなければなりません。 そうしようとすると、あらゆる種類のハックでコードが複雑になり、この時点で IE6 を無視しても安全です。 2012 年 4 月の時点で、IE6 を使用しているユーザーの割合は 0.7% でした。これらのユーザーはおそらく今では壊れたサイトに慣れているはずであることを考慮して、私はその周辺人口を無視することにしました。
そこで、真にクロスブラウザー互換性を持つようにサイトを設計する際に考慮すべき事項の短いリストを以下に示します。
- 有効な W3C 標準準拠のコードを作成する、W3C バリデーターで検証します。 HTML 4.01 または XHTML 1.0 で記述できます。適切なコーディング プラクティス (構造に (X)HTML を使用し、デザインに CSS を使用するなど) を検証して使用する限り、IE7/8 を含むすべてのブラウザーで一貫して表示されるはずです。 . 私は現在 HTML5 を扱っていないので、HTML5 の使用についてはコメントしませんが、私が見たサイトや行った少しの調査から、HTML5 は古いブラウザー、特に IE と完全に互換性がありません。 CSS とスクリプトを検証することもできるので、必ず行ってください。
- 複数のブラウザでテストする、 古いバージョンの IE を含む. ここで、IE や Firefox などの他のブラウザーが備えているこの便利な小さなシステムをまだ発見していない人のために、Internet Explorer 開発者ツールについて言及しなければなりません。 IE9 では、ツールバーの[ツール]ボタンでこれらを見つけることができ、[F12 開発者ツール]をクリックするか、単にキーボードで F12 を押します。 ここには、スクリプトや CSS の無効化 (CSS や Javascript を無効にして、それらがないとサイトがどのように表示されるかを確認してください。これにより、スクリーンリーダーがサイトをどのように読み取るかがわかります) からコードの検証まで、便利なツールがたくさんあります。 また、IE9 互換モード、IE8、または IE7 を選択できるブラウザ モードもあります (マシンに IE8 がインストールされている場合を除き、IE7 と IE6 を選択できます)。 したがって、このツールを使用すると、古いブラウザーがまだインストールされている古いコンピューターをドラッグすることなく、古いバージョンの Internet Explorer でサイトをテストできます。
- Mac を使用している場合、またはその他の理由で Internet Explorer を取得できない場合は、次のようなレンダラーを使用できます。 ネットレンダラー. サイトのスクリーンショットが表示されるだけで、インタラクションをテストすることはできません (ページを下にスクロールするような単純なものでも)。 より現実的なテスト方法については、Google で「Internet Explorer エミュレーター」を検索してみてください。 他にもオプションはありますが、私は Mac を所有していないので、それらをテストする気にはなりませんでした。
- サイトをコーディングする別の方法を検討する. CSS を使用して角を丸くしたり、影やグラデーションを作成したりする代わりに、昔ながらの方法で画像を使用することもできます。 多くの場合、画像は読み込みにそれほど時間がかからないように十分に小さくすることができ、その結果、すべてのブラウザーでまったく同じように見える美しいサイトになります.
コードを書いた後、IE7 で開いてみると、驚くべきことに、Firefox とまったく同じように見えるのは、とても気持ちがいいものです。 今 それは 成果。 そしてさらに重要なのは、あなたのサイトが感動を与えることができるということです 全て 優れたブラウザを使用しているユーザーだけではありません。 もちろん、それがあなたのターゲットオーディエンスでない限り。