ホームページ制作でのブラウザ対応とは？おすすめブラウザや対応注意点も【2024年最新版】

目的達成のために慎重にデザインされたホームページは、意図した通りにパソコンやスマホに表示されてほしいもの。しかし、Web担当になったばかりの方なら「どんなブラウザでもホームページの見え方は同じ？」という素朴な疑問を抱いているかもしれません。

• ブラウザによってホームページの見え方が変化する？
• ホームページ制作のブラウザ対応って？対応するブラウザを限定する？
• ターゲットブラウザの決め方は？対応すべき主要ブラウザを知りたい

そこで本記事では、ブラウザによってホームページの見え方が変化する理由、ターゲットブラウザを設定する必要性・決め方など、ホームページ制作の際に考慮しておきたいブラウザ対応の基本を解説！ターゲットブラウザの候補となる主要ブラウザも紹介していきます。

※ターゲットブラウザの選定を含め、さまざまな相談のできる実績豊富なホームページ制作会社を探している方は、Web幹事にご相談ください。専任のアドバイザーが最適なホームページ制作会社をご紹介します。相談料などは一切かかりませんので、お気軽にお問い合わせください。

【無料】おすすめのホームページ制作会社を紹介してもらう

ホームページ制作に役立つ記事もご覧ください ホームページを作るならこちらもチェック！おすすめの無料ホームページ作成ツール

ホームページ制作におけるブラウザとは

ブラウザ（Browser）とは、「拾い読み（Browse）」の意味から転じた、ファイルを閲覧するためのアプリケーションのこと。PDFファイルの閲覧に特化したPDFブラウザ「Adobe Acrobat Reader」など、ブラウザにもいくつかの種類がありますが、一般的にはホームページを閲覧するためのアプリケーション「Webブラウザ」をブラウザと呼びます。

HTMLファイルを閲覧するためのアプリケーション

HTMLファイルとは、ホームページのレイアウトや文章の構造をタグで指定するマークアップ言語「HTML」で記述されたファイルのこと。

ホームページを装飾する役割を持つCSS（スタイルシート）、動きを加える役割を持つJavaScriptがリンクされたHTMLファイルをブラウザに読み込むことで、私たちがいつも目にしているホームページが表示される仕組みです。

つまり、ブラウザとは「ホームページのレイアウト・構造・装飾・動き」を指定するプログラミング言語「HTML・CSS・JavaScript」の意味を解釈し、正確に画面に描画・表示させる機能を持つアプリケーションだといえます。

【無料】ホームページ制作時のブラウザ対応について相談する

ブラウザによってホームページの見え方が変化する理由

HTML・CSS・JavaScriptは、それぞれがホームページを表現するために標準化が進められているマークアップ言語・プログラミング言語です。通常であれば、標準化された開発・コーディングルールに従って開発されたブラウザであれば、種類が異なっても「同じように表示」されるはず。しかし、いくつかの理由から「同じホームページでもブラウザによって見え方が異なる」のが現実です。

ブラウザの種類やバージョン・OSの種類やバージョンの違い

どのブラウザも「HTMLファイルを閲覧する」という同じ目的を持っていても、アプリケーションであるWebブラウザの種類が異なれば、当然コアとして使われている技術も変わります。たとえば、ホームページに動きを加えるJavaScriptは、ブラウザ側に実装される実行エンジンによって動作しますが、各ブラウザが採用するJavaScriptエンジンはバラバラです。

たとえば、Internet Explorerの場合、文字の下に不自然な余白が生じるケースがあります。そのため、Google Chromeでの表示よりも文字が上に偏った表示になるのです。

また、同じブラウザでもバージョンが異なれば、各技術への対応度合いも変わります。インストールする端末のOSバージョンが異なれば、最新バージョンのブラウザが利用できないこともあります。それぞれの組み合わせによってホームページの見え方が異なる、あるいは表示できないことがあるのは、これらのことからも当然といえるのです。

常に進化するWeb技術

ある程度標準化されているとはいえ、Webに関連する技術は日進月歩で進化しています。当然、新たに追加された機能に対応するため、ブラウザ側でも頻繁なアップデートが繰り返されます。最先端技術で作られたホームページなどは、最新バージョンのブラウザであれば問題なく表示できますが、少し前のバージョンではレイアウトが崩れてしまうことも少なくありません。いずれにせよ、ブラウザの種類やOSの種類、バージョンの違いなどによってブラウザごとに見え方が異なると、場合によっては一部のユーザーにはサイト側から伝えたい情報が伝えきれなくなることもあるのです。

とはいえ、不特定多数のユーザーに向けて情報発信するホームページの役割を考えれば、ユーザーがどんな環境であっても意図通りに情報を伝えたいものです。そのため、どのようなブラウザにも対応できるものなのでしょうか。

すべてのブラウザに対応するのは現実的ではない

ブラウザの違いによる影響を極力排除し、100％同じとはいかなくともどのような環境でもホームページをできる限り同じ見た目にすることは不可能ではありません。たとえば、最新技術の活用を控え、標準的なCSSやJavaScriptでホームページ制作するなどです。

しかし、これではホームページ制作の自由度が、ブラウザを理由に大きく制限されることになってしまいます。ブラウザの種類・バージョンとOSの種類・バージョンの膨大な組み合わせをテストする必要もあり、費用面から考えても現実的だとはいえません。

【無料】ホームページ制作時のブラウザ対応について相談する

ホームページ制作で考慮すべきブラウザ対応

もっとも現実的な解決方法として考えられるのは、対応するブラウザを限定したうえでホームページ制作プロジェクトを進めることです。この方法であれば、ブラウザ・OSの組み合わせを確認するためのテスト量を削減しながら最先端技術を活用可能。この場合の対応ブラウザを「ターゲットブラウザ」と呼びます。

それでは、ターゲットブラウザはどのように選定すればいいのでしょうか。

シェアの大半を占める「Google chrome」は選択肢として無難

画像引用：StatCounter

できる限り多くのユーザーをカバーするようホームページ制作するには、シェアの大半をカバーできる複数のブラウザ、かつ最新バージョンに絞り込んでサポートするのがおすすめです。たとえば、Webトラフィック解析の結果を公開するWebサイト「StatCounter」によると、2022年8月現在、日本におけるブラウザのシェアは上記データの通り。圧倒的にGoogle chromeがトップのシェアとなっています。そのため、Google chromeは最低限ターゲットブラウザとして定めましょう。

※ターゲットブラウザの選定を含め、さまざまな相談のできる実績豊富なホームページ制作会社を探している方は、Web幹事にご相談ください。専任のアドバイザーが最適なホームページ制作会社をご紹介します。相談料などは一切かかりませんので、お気軽にお問い合わせください。

【無料】おすすめのホームページ制作会社を紹介してもらう

ターゲットブラウザの候補となる主要ブラウザ

多くのホームページ制作会社が採用するターゲットブラウザの例を紹介しておきましょう。Samsung Internetを除き、ほぼStatCounterのブラウザランキングと同じであることがわかります。

※ブラウザのバージョンは、ホームページ制作時点での最新バージョン

Google Chrome

画像引用：Google Chrome

「Google Chrome」は、Google社が開発・提供するWebブラウザです。G-mail、Gドライブ連携をはじめ、多種多様なプラグインで機能を拡張していける柔軟性を持ち、日本はもちろん、世界で最も利用されているWebブラウザです。スマートフォン / タブレットへのインストール率も高いため、ターゲットブラウザとして外せない存在です。

ほとんどのAndroidのスマホやタブレットでは、Chromeが標準的に用意されています。そのため、Androidユーザーが多い利用者をターゲットにしたサービスを提供する企業には確実におすすめといえます。

Apple Safari

画像引用：Apple Safari

「Apple Safari」は、macOS・iOS・ iPadOSに標準でインストールされるApple社製Webブラウザです。Apple製品のデフォルトブラウザに設定されており、メジャー・マイナーを問わず、OSアップデートの際に最新バージョンへと更新されるのが特徴。追加インストールしたWebブラウザをデフォルトに設定しない限りSafariが優先されるため、ターゲットブラウザとしての対応は必須。特にApple製品のシェアが高い日本では重要な存在です。

Microsoft Edge

画像引用：Microsoft Edge

「Microsoft Edge」は、Internet Explorerの後継製品としてMicrosoftが開発したWebブラウザです。Windows 10以降は、Edgeが標準ブラウザとしてインストールされるようになっており、近年シェアを伸ばしつつあります。macOS版もリリースされていますが、最新のWindows PCを利用するビジネスユーザーが大半。BtoB向けのホームページ制作、ECサイト制作では対応が欠かせないといえるでしょう。

Mozilla Firefox

画像引用：Mozilla Firefox

「Mozilla Firefox」は、Mozilla Foundationが開発・提供するオープンソースのWebブラウザです。オープンソースのため拡張性が高く、拡張機能を自由に追加・アレンジすることで、ユーザーが自由に便利にカスタマイズできる特徴もあります。

日本でのシェアは5%程度ですが、根強い人気を保っており、世界シェアで見た場合はEdgeをしのぐ人気を誇ります。macOS・Windowsはもちろん、Android・iOSやLinuxにも対応し、パスワード・ブックマーク・タブの同期ができるため、マルチデバイスで愛用するユーザーも少なくありません。パスワードマネージャーや新たなセキュリティ拡張機能が導入されたため、近年セキュリティがアップしています。

Microsoft Internet Explorer

「Microsoft Internet Explorer」は、8.1までのWindowsに標準でインストールされていたWebブラウザです。2022年6月にはMicrosoftのサポートも終了しており、1%程度を保っているシェアも、今後さらに低下していくと考えられます。

【無料】ホームページ制作時のブラウザ対応について相談する

ホームページ制作時のブラウザ対応での注意ポイント

ホームページ制作会社の設定するターゲットブラウザに従っていれば、インターネットユーザーの大半をカバーできます。そのため、特に問題が起こることはありませんが、いくつか注意しておきたいポイントもあります。

Microsoft Internet Explorerへの対応

もっとも注意しておきたいのは、Microsoft Internet Explorer（IE）への対応をどうすべきかです。

法人での利用が減ったとはいえ、まだまだWindows 7 / 8.1が稼働している企業は少なからず存在しています。IEから他ブラウザへの切り替えに躊躇している企業も相当数存在します。BtoBビジネスを展開する企業であれば、ホームページ制作のターゲットブラウザとしてIEを外すわけにはいかないと考えるかもしれません。

しかし、モダンブラウザの要件も満たしていないIEに対応させるには、ホームページにCSSを含む追加のコーディングが必要な場合がほとんど。結果的に、可読性が低く管理のしにくいホームページになってしまう危険性があります。また、先述の通りすでにサポートが終了し、それによりセキュリティ面でも不安が増えるともいえます。今後もシェアが低下していくと思われるIEは、ターゲットブラウザから外してしまうというのも一つの方法です。

画像引用：IE Buster

「IE Buster」などを利用して、Chromeへの乗り換えを促すのもおすすめです。

ターゲットブラウザを決めるタイミング

IEの取り扱いを含め、ターゲットブラウザは要件定義フェーズまでには決定しておくべきです。
※要件定義：ゴールとなる具体的な目標数値と、構築するホームページの目的・目標・必要な要素

上述したように、IEに対応させるか否かで、ホームページ制作のコーディング量は変わります。制作コストへ影響することも考えられるため、IE対応が原因で制作会社とトラブルになる可能性もあります。こうした無駄なトラブルを避けるには、コーディング前の段階でターゲットブラウザを明確にしておくことが重要です。

【無料】ホームページ制作時のブラウザ対応について相談する

ホームページ制作ブラウザまとめ

本記事では、ブラウザによってホームページの見え方が変化する理由、ターゲットブラウザを設定する必要性・決め方など、ホームページ制作の際に考慮しておきたいブラウザ対応の基本を解説しました。また、ターゲットブラウザの候補となる主要ブラウザも紹介してきました。

意外に見落としてしまいがちですが、ホームページ制作におけるブラウザ対応は非常に重要。基本となる主要ブラウザを念頭に、自社のターゲット層、各ブラウザのシェアでバランスを取り、適切なターゲットブラウザを設定していく必要があります。

ブラウザの選定を含め、少しでもホームページ制作の内製が不安がある方は、専門知識・スキルを持った制作会社への相談が無難です。貴社の状況をヒアリングして最適なブラウザも提案してくれるでしょう。

※ターゲットブラウザの選定を含め、さまざまな相談のできる実績豊富なホームページ制作会社を探している方は、Web幹事にご相談ください。専任のアドバイザーが最適なホームページ制作会社をご紹介します。相談料などは一切かかりませんので、お気軽にお問い合わせください。

コンサルタントのご紹介 岩田 Web制作会社を設立し、
3年間で上場企業を含む50社以上制作に携わらせていただきました。

様々なお客様のWeb制作を実際に行ってきましたので、
初心者の方でも安心してご相談ください！

【無料】おすすめのホームページ制作会社を紹介してもらう