<dialog>要素
モーダルやダイアログのための組み込みHTML要素。<dialog>とshowModal()で、かつては大量のJavaScriptが必要だった背景のオーバーレイ、フォーカストラップ、Escでの閉じる動作、正しいアクセシビリティが標準どおりに手に入る。
自作を避けられるものは多い。本物のモーダルには、フォーカスが内側に閉じ込められること（Tabで外に出ない）、背景が操作不能になること（::backdrop）、Escで閉じること、閉じたら元の位置へフォーカスが戻ること、スクリーンリーダー向けの適切なARIAロールが必要で、自作するとバグだらけでアクセシブルでない実装になりがちだった。<dialog>.showModal()はこれらすべてを組み込みで正しく提供し、show()ならモーダルでない版になる。描画はブラウザの「トップレイヤー」で行われ、z-indexやoverflowに左右されない。非モーダルのポップアップ向けPopover APIやアンカー配置と相性がよい。2022年から広く利用でき、プラットフォームがライブラリから領分を取り戻した好例である。