Webサイトのブラウザ検証はどこまで対応すべき？対応の線引きとは

Webサイトのブラウザ検証は、どこまで対応すればよいのかわからないという人もいるのではないでしょうか。本記事では、その対応をどこまでするべきか、対応すべきブラウザはなにか、クライアントとトラブルを起こさないためのポイントについて解説します。ブラウザ検証で悩んでいる人は、ぜひ参考にしてください。

Webサイトのブラウザ検証はどこまでするべき？

Webブラウザは数多くあります。対応しているブラウザによって表示が違うこともあるでしょう。しかし、結論からいうと、すべてのブラウザに対応することは困難です。

もちろん、すべてのブラウザの最適化が理想的ですが、各ブラウザやOSによって機能が異なるため、一部には特有のバグへの対処など、細心の注意を払う必要があります。また、全てのブラウザに対応するとコストがかかります。

ゆえに、範囲を決めてブラウザ検証する方が現実的といえるのです。対応すべきブラウザについて、PC版とスマートフォン版それぞれ解説します。

対応すべきブラウザ

PC版だとInternet Explorerは11以降、Firefox、Safari、Google Chrome、Microsoft Edgeは最新版です。一般的にPC版に関しては、自動的に最新バージョンへアップデートされるため検証作業も最新バージョンで行えば問題ありません。

しかし、Internet Explorerはバージョンによって表示が変わることもあるので気をつける必要があります。また、11も2025年にはサポートが終了してしまうので、そのことも把握しておくとよいでしょう。

スマートフォン版ではiPhoneは最新とひとつ前のiOSでSafari、Google Chromeの最新版に対応しましょう。Androidはふたつ前のiOSでGoogle Chromeの最新版です。スマートフォンの対応はブラウザとあわせてOSのバージョンや解像度ごとに確認が必要です。

ブラウザのバージョンが同じでも、解像度が違うと表示が変わるため注意しましょう。その際の検証には、ブラウザに搭載されているデベロッパーツールの利用がおすすめです。すべてのブラウザの確認は難しいものの、ひとつのツールとして考えてみてもよいでしょう。

なお、タブレットはノートPCとほぼ同じ解像度になっているのでPCサイトが表示されることがほとんどです。クライアントの閲覧環境が古い場合を除けば問題なく表示されます。

ブラウザ対応を含めたWeb制作の考え方

ブラウザ対応でもっとも苦労するのはIE11への対応です。日本ではGoogle Chromeがブラウザシェアのトップですが、Internet Explorerのユーザーも多いため、IE11の対応をしない選択はできません。

とくに、企業のパソコンであればInternet Explorerを使用している場合も少なくありません。ここからは、ブラウザ対応を含めたWeb制作の考え方について解説します。

自動化できることはなるべく自動化する

IE11への対応は大きな壁ですが、可能なら自動化することがポイントです。たとえば拡張機能を使うほか、ベンダープレフィックスをつける作業はツールに任せた方が労力がかかりません。

CSSハックはできるだけ避ける

CSSハックとは、ブラウザの表示を同じにするために実装するCSSを変える技術です。CSSは、できるだけ避けた方がよいでしょう。CSSハックによりコードが煩雑になり、可読性が落ちるからです。結果、IE11の対応がより困難になります。おすすめはavaScriptやPHPを使用し、ブラウザやOSの情報を取得後classをつける方法です。

Google Chromeの使用をすすめる

Google Chromeに移行するよう表示を出すこともできます。IE BusterというツールのCDNのリンクを貼るだけで実装できるので簡単です。

ブラウザ対応でクライアントとトラブルを起こさないためのポイント

ここまで、ブラウザ検証についてお伝えしてきました。Web制作で大切なことのひとつにクラアントとの入念なヒアリングがあります。なぜなら、作業効率もあがり、お互いに気持ちよくやり取りができるからです。

ヒアリングに向けて、クライアントのコンセプトをしっかり把握し、制作目的を明確にしておくとよいでしょう。たとえば、ITリテラシーが低めな場合は、PCにはじめから入っているIEを使う傾向があります。逆に、技術系のクライアントでは拡張機能が多いGoogle Chromeを使うケースもあります。

このような背景を事前にまとめ、準備した上でヒアリングをするとクライアントも理解しやすいでしょう。また、あらかじめ対応するブラウザを決めておくことでトラブルを防げます。

お互いの考えを一致させ、ブラウザ検証を行うことで納得いくものを作れるでしょう。お互いの考え方に相違があるまま作業を行い、途中で修正するにも工程が進んでいるほど大変です。トラブルを避けるためにも、しっかり確認しておくことをおすすめします。

まとめ

本記事ではWebサイトのブラウザ検証の範囲やWeb制作する上でのポイント、クライアントとのトラブルを起こさない方法について解説しました。Web制作ではユーザーの環境への配慮やクライアントとの擦り合わせが必要です。

ブラウザ検証のポイントを押さえておけば、作業はスムーズに進みます。近年ではさまざまなWebサイトブラウザが存在しており、すべてのブラウザを網羅するというのは不可能に近いです。そのため、ある程度ブラウザを絞って対策を施すやり方のほうが、賢明な選択です。