本日は、ブラウザに対応しているか一瞬でわかる便利なサイトを紹介します。
Webサイトを作成する上で、使用している要素がどのブラウザに対応しているかを気をつける必要があります。
「しっかりとレイアウトしてるのに、このブラウザだとうまく表示されない…」「自分のHTMLコードが間違えているのか…」と思って数時間悩んだ結果、そもそもブラウザに対応していなかった…
使用している要素がブラウザに対応しているか一目でわかったらいいのにな…
そんな時に役に立つのが I Can Use… です！
こちらからサイトにアクセスできます。
どのブラウザに対応しているのか、調べたい要素を「I Can Use_____？」部分に入力して検索します。
すると、各ブラウザとそのバージョンの対応表が表示されます。
以下は、「transition」と検索した例です。
検索後の色分けでサポートされいるかどうかを確認できます。
Supported：サポートしている
Partial support：部分的にサポートしている
Not supported：サポートしていない
Support unknown：サポートしているかどうか不明
先ほどの画像の例は、現時点で全体の83.24%のブラウザでサポートされていることが分かります。
サポートされていないブラウザはなく、Support unknown は「Orera Mini」といったマイナーなブラウザなので気にしなくでいいですね。
また、Partial support や Not supported もないため、transitionはほぼ全てのブラウザで機能すると言えます。
このページは英語表記ですが、Google Chromeの英語翻訳機能を使えば、英語が苦手な方でも日本語で読むことが可能です。
これを使えば、ブラウザによって予期しない表示やレイアウトの崩れを防ぐことができます。気になった時にさらっと調べてみるのも知識になるのでおすすめです。
こちらからサイトにアクセスできます。
最後までお読みいただき、ありがとうございました。
