HTML5対応ブラウザ一覧｜対応状況の確認方法や追加・変更・廃止されたタグ

HTML5対応ブラウザ一覧

HTML5に対応しているブラウザと対応バージョンは、以下のとおりです。

HTML５は、メジャーなブラウザの最新版であれば基本的に全て対応しています。

しかし、上記のブラウザであっても過去のバージョンの場合は、全てのHTML5タグに対応しているとは限りません。そのため、ブラウザの種類だけではなく、対応バージョンにも注目する必要があるでしょう。

HTML5対応状況チェック方法

前述のように、ブラウザやそのバージョンによって、HTML5で表現できるタグとできないタグがあります。

HTML5のタグの最新の対応状況を調べるために活用できるのが、「Can I use…」というサイトです。入力欄にタグの名前を入れるだけで、ブラウザやバージョンの対応状況を簡単にチェックすることが可能です。

例として、「datalist」というタグを調べてみると、下記のように、対応状況を色分けして表示してくれます。

画像引用：Can I use…

色による分類

• 緑色・・・サポートしている
• 茶色・・・一部サポートしている
• 赤色・・・非対応
• 灰色・・・不明

datalistというタグは、緑が大部分を占めていますが、茶色と赤色も見受けられます。そこで、画面の右上を見ると、世界でどのくらいの割合の人がこのタグを正しく見ることができるかということが表示されています。

今回は、「94.8%」という数字となりました。大きな数字に見えますが、ブラウザの対応状況に目を戻すと、IE10を使っているユーザーには、datalistタグはサポートされていません。つまり、対象ユーザーの多くがIE10を使用していることがわかっている場合には、datalistタグ使うことは控えたほうがよいと考えることができます。

このように、「Can I use…」は、サイトの表現に新しいタグを使うかどうかの判断基準として活用することができます。

HTML5で追加された要素タグ一覧

HTML5で新規に追加された要素タグは、以下のとおりです。

上記は新しいタグが多いので、「Can I use…」で対応したブラウザを確認してから使用を判断するのがおすすめです。また、今後廃止される予定のタグもあるので、該当のタグを使う場合は注意しておきましょう。

HTML5で変更された要素タグ一覧

HTML5で変更された要素タグは、以下のとおりです。

変更されたタグは、以前の機能と現在の機能に違いが見られる場合もあるので、意図したデザイン・表現のとおりに動作していない可能性があります。

以前使ったタグが正常に動作しているかを確認しておくことがおすすめです。

HTML5で廃止された要素タグ一覧

HTML5で廃止された要素タグは、以下のとおりです。

廃止された要素タグを使用した場合、サイトのデザインの崩れや動作の不具合が起こる可能性があります。そのため、以前に上記のタグを利用しているものがないか確認しておくことをおすすめします。

まとめ

当記事では、HTML5に対応しているブラウザの紹介と、使いたい要素タグがブラウザにどのくらい対応しているかを「Can I use…」を用いて調べる方法について解説しました。

サイトを作成する際には、使用するタグが各ブラウザにどれくらい対応して、どれくらいの人が利用できるのかを事前に調べておくことで、利便性の良いサイトが作成できるようになります。

また、HTML5では要素タグが新しく追加や変更、削除されています。今回紹介した一覧表の中から、変更されたタグがないかも調べてみてください。