知らなきゃ損！HTMLだけでこんなことまでできるって知ってた？

「えっ、HTMLだけでそんな実装ができるの？」と驚くような便利な機能や、意外と知られていない最新のHTML仕様について紹介します。JavaScriptに頼りすぎていたあんな機能も、実はブラウザ標準のHTMLで完結するかもしれません。

2026年になってもNoScriptを使い続けてる、統計データとしては少数派の人間がここにいるよ。サイトごとにJavaScriptを有効にするスタイルだけど、今のモダンなウェブだと正直かなりキツイ。こういうモダンなHTMLの機能がもっと普及してくれるといいんだけどね。あと、ほとんどのケースでSingle Page Applicationなんて必要ないんじゃないか、って気づくことも大事だと思う。普段フロントエンドのコードを書くことはあまりないけど、いざ書くとなると、今のHTMLでできないインタラクションなんてほとんどないよ。最悪でもHTMXみたいなのをちょっと足せば済むし。

わかる。「HTMLやCSSだけでできること」の大ファンだよ。特にCSS側の:hasやkeyframes、コンテナクエリなんかはかなり便利だしね。標準で無料で使えるものを、わざわざコードを複製してまでやる必要なんてないでしょ :)

yurishimoさんのこのコメントは[dead]にするべきじゃないと思うな。

一応言っておくと、厳密な制約が必要な場合にdatalistはあまり良い解決策じゃないよ。ユーザーはフィールドに好きな値を入力できるし、曖昧検索やタイプミスの補完機能もないからね。そういった要件を付け加えると、高機能なコンボボックスを提供するライブラリを使ったほうが、プロジェクトとしては納得感があるはず。

その通り！HTMLは確かにすごいことができるし、用途によっては100%事足りることもある。でも、ユーザーが選択肢から値を選ぶようなフォームが大量にあって、それ以外の文字列を入力させず、かつ検索体験も良くしたいなら、datalistじゃ力不足だね。

関連して、HTMLでソート可能なテーブルを標準サポートしてくれたら最高なんだけどな。よくあるニーズなのに、そのたびに自分で実装し直すハメになってる。

Grouped <details>を見たよ。試しにFirefoxで隠しコンテンツをCtrl+Fで検索したら、ちゃんと開いて該当箇所をハイライトしてくれた。detailsタグの存在を知ってからずっとこの修正を待ってたんだ。

date入力でISO形式を強制できるようにしてほしいな。今の「プラットフォーム標準」だと、ブラウザが表示されているページとOSの言語設定が違う場合にユーザーが混乱するから。多国籍企業だと、OSの言語設定に関わらず管理画面を全部英語にしたいってケースはよくある。英語のページなのにOSのせいで日付形式が変わっちゃうスクリーンショットを送るなんて、想像しただけで面倒でしょ。

JSなしでどこまでやれるか実験するためにtextlog.ccを始めたんだけど、結果、かなりやれる！Service Workerスクリプトが必要なWeb Push通知を除けば、あとは全部サーバーサイドレンダリングされたReactだけ。ホバーカードやポップオーバーがあるからJSが動いてるように見えるけど、全部HTMLだけで完結してる。この制約をすごく楽しんでるし、開発が滞ることもない。HTMLだけでもかなりのことができるっていう証明だね。

Popover、dialog、invoker commandsは、うちのプロダクションアプリで至るところで使ってるけどすごく快適！dialogやpopoverが「トップレイヤー」でレンダリングされて、ネストされたポップオーバーが自動的に重なって「カスケードクローズ」する仕組みは、標準仕様としての完成度が非常に高いよ。

唯一難しいのは、トリガーになった要素の近くにポップオーバーを配置することかな。例えばボタンの上下にコンテキストメニューを出したいときとかね。CSSでアンカーポジショニングができるようになったけど、対応状況はまだ限定的だし、理解するのがちょっと難しい。

あとLLMはこの新しい標準仕様については本当にポンコツだね。知ってたとしてもベースラインじゃないと思いがちだし、これまでみんなが苦労して使ってた奇妙なJSやCSSの膨大な学習データに比べれば、新しい標準に関する知識はほとんどゼロに等しい。

HTMLには最初から<select>があったのに、みんな<div>と大量のJSで再発明しようとしてきたよね。せっかくの内蔵機能も、特にタイプヘッドみたいなやつは、自由にスタイルを当てられるようにならないと主流にはならないだろうな。

2026年のHTMLは、1996年のネイティブなデスクトップGUIフレームワークがやってたことのほとんどをやり始めている感じだね…。まあ「ほとんど」と言うのは言い過ぎかな、ミレニアム前後にNeXTやAppleのAppKitが提供していたものと比較すると特に。

Web 2.0でみんながUIフレームワークの最低公約数に合わせるようになったのは、フロントエンドにとって大きな後退だった。それから何十年もかけて、チェックボックスやメニューボタンを貧弱に再構築するだけの時間を過ごしてしまったんだ。

Microsoftはこの件で大きな役割を果たしたよ。2001年頃に傲慢になって、圧倒的なデスクトップ支配力があればインターネットのUI層を独断で決められると勘違いしたんだ。それで（95%のシェアを持っていた）Internet Explorerの開発を停滞させて、HTMLの代替としてXAMLのような独自ソリューションに全力投資してしまったわけだ。