Visual Studio CodeのHTMLファイルで、Emmetを利用し、『!』⇒tabを押すと、以下のようなコードがでてきます。
1 2 3 4 5 6 7 8 9 10 11 12 |
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> </body> </html> |
このコードにでてくる、
1 |
<meta http-equiv="X-UA-Compatible" content="IE=edge"> |
とは、どんな意味があるのでしょうか。
この記事で、できるだけわかりやすく説明します。
この記事の内容
【簡単に】<meta http-equiv=”X-UA-Compatible” content=”IE=edge”>を解説
1 |
<meta http-equiv="X-UA-Compatible" content="IE=edge"> |
は、一言で表すと、
『IEで見ているなら、あなたの持っているパソコンのできる範囲の最新バージョンで、このページを見てね』
という意味になります。
- 『IEで見ているなら』
- 『できる範囲の最新バージョン』
この2つがポイント。
よくわからない人は、今から詳しく説明していきます。
【初心者用】<meta http-equiv=”X-UA-Compatible” content=”IE=edge”>を解説
まず、パソコンやスマホでインターネットのサイトを閲覧するとき、以下のようなソフト(Webブラウザ)を利用しますよね。
- Internet Explorer
- Edge
- Google Chrome
- Firefox
- Safari
この記事で関連してくるのが、『Internet Explorer』と『Edge』。
『Internet Explorer』というのは、マイクロソフトが開発していたWebブラウザです。
最新バージョンは11。ですが、このバージョンも2022年6月15 日にサポートを終了します。代わりに使用するように勧められているのが、『Edge』です。
(サポートが終了したとしても、利用できなくなるわけではありません。ですが、セキュリティ上の問題が発生しても、フォローがないので、別のwebブラウザを利用するようにしましょう。)
この記事で解説している、<meta http-equiv=”X-UA-Compatible” content=”IE=edge”>というコードをhead内に書くことで、IEの最新バージョンでサイトを見るように指定できます。
ただし、注意点が2つ。
- 最新バージョンとは、『パソコンにインストールされている中で』の最新を意味する
- IEとEdgeは別物
この2つですね。
それぞれ簡単に説明します。
パソコンにインストールされている中で
<meta http-equiv=”X-UA-Compatible” content=”IE=edge”>の記述によって、IEの最新バージョンで閲覧するように指定できますが、あくまでパソコンで対応しうるバージョンの範囲内です。
- windows10 ⇒ IE11 Edge
- windows8.1 ⇒ IE11
- windows8 ⇒ IE10
- window7 ⇒ IE8-11
- windows vista ⇒ IE7-9
このようにOSによって、対応しているバージョンが異なります。上記の範囲で最新バージョンというわけです。
さらに、そのバージョンをパソコンにインストールしている必要があります。
例えば、パソコンのOSがwindows7でIE11をインストールしているなら、IE7でサイトを閲覧していたとしてもIE11でサイトを閲覧させることができます。
一方、windows8では、IE10のみの使用となるので、IE11での閲覧をさせることはできません。
IEとEdgeは別物
windows10でEdgeとIE11をインストールしている場合、IE11で閲覧しているときは、今回のコードが書かれていたとしてもIE11での閲覧となります。Edgeでの閲覧をさせることはできません。
IEとEdgeは別物なので、それを飛び越えることはできないわけです。
ちなみに、
1 |
<meta http-equiv="X-UA-Compatible" content="IE=edge"> |
このコードを、
1 |
<meta http-equiv="X-UA-Compatible" content="IE=11"> |
という風に、IE11の指定をすることもできます。
ですが、ここでもIEとEdgeは別物なので、Edgeで見ている場合、IE11で閲覧するようにはできません。
まとめ
ここまでをまとめると、<meta http-equiv=”X-UA-Compatible” content=”IE=edge”>というコードは、
- Edgeで見ている人→変わりなし
- IE11で見ている人→変わりなし
- IE11未満で見ている人→対応できるバージョンの範囲内で最新に変更させる
という感じにまとめることができるわけです。
具体的に言うと、windows7やwindows vistaの人が、古いIEバージョンで見ている場合、できるだけ最新のIEバージョンで見せるようにするためのコードということになります。
IEのバージョン別の使用率を調べた
では、実際に、IEの古いバージョンを使っている人はどれくらいいるのでしょうか?
調べてみました。
『StatCounter Global Stats』というサイトで、日本においてEdgeやIEの使用率は、以下の通り。
Chrome | 62% |
---|---|
Edge | 16% |
safari | 7.6% |
Firefox | 6.5% |
IE11 | 4.9% |
IE10 | 0.02% |
IE9 | 0.02% |
IE8 | 0.01% |
上記は2021年8月のパソコンでの使用率です。マイクロソフトが新しく開発したEdgeでも使用率は16%で、IE11未満のバージョンに至っては、0.05%(0.05%、1万人に5人)しかいませんでした。
<meta http-equiv=”X-UA-Compatible” content=”IE=edge”>というコードは、IE11で見ている人をEdgeで見せるようにするためのコードではありません。
あくまで、IE11未満のバージョンを使っている人のために書くコードなので、この1万人に5人しかいない人のために、このコードを書く必要があるかを検討する必要があります。
以上です。
最後まで読んでいただいてありがとうございました。