Visual Studio Code、Web標準の「Baseline」チェックに対応。コード内のHTMLやCSSにカーソルを合わせれば説明表示

Visual Studio Code 1.100もしくはそれ以後のバージョンでは、標準でコード内のHTMLやCSSがWeb標準のBaselineに対応しているかどうかをチェックする機能が搭載されていることが、web.devブログで紹介されています。

これにより、HTMLやCSSが主要なWebブラウザで問題なく表示されるかどうかが、Visual Studio Codeで簡単にチェックできるようになりました。

Baselineは安心して使えるWeb標準

Baselineとは最新のWeb標準のサブセットです。Baselineに含まれているHTMLやCSSの機能であれば主要なWebブラウザで実装済みであるため、Webアプリケーション開発者が安心して使える機能となります。

その背景には、現在のWeb標準がリビングスタンダードとしてつねにアップデートが行われており、ChromeやFirefox、Safariなどの主要なWebブラウザが新しいWeb標準をサポートする時期や順番はそれぞれ異なるという事情があります。

そのため、Web標準となっていたとしても必ずしも全てのWebブラウザで実装されているとは限らない、という状況が発生しています。

そこで2023年に登場したのが「Baseline」です。Baselineに含まれるWeb標準の機能であれば、主要なブラウザでのサポートが行われており、Webアプリケーション開発者は安心して利用できるものとなっています。

参考：Web標準に新たなステータス「Baseline」が登場。変化し続けるWeb標準のうちWeb開発者が安心して使える機能群を示す。MDNドキュメントなどで表示開始

HTMLやCSSにカーソルを合わせるだけ

今回のVisual Studio Codeの新機能は、コードエディタ内のHTMLやCSSにマウスを合わせると、それがBaselineであるかどうかが表示されるというものです。いまコーディングしているHTMLやCSSがBaselineに対応しているかどうかがすぐ分かるようになります。

下記がその画面です。12行目の「aspect-ratio」にマウスを合わせると説明がポップアップ表示されます。いままでもHTMLやCSSに関する説明は表示されていましたが、その中にBaselineに関する説明が追加されました。

この機能は最新版となるVisual Studio Codeバージョン1.100とそれ以降のバージョンで利用可能です。