一部のUIが`appearance: base;`時は`cursor: pointer;`になる

9月9日の会議では、カーソルを指定している33のデザインシステムのうち27がpointerを採用しており、ブラウザの標準は少数派であると報告されていました。

しかし筆者は、これがそこまで強い根拠になるのかどうか懐疑的です。デザインシステムでの採用状況は、あくまでもデザインシステムでの採用状況であり、Web全体からするとわずかな領域に感じます。

それぞれのデザインシステムが、ユーザテストを経てリンク以外でも指ポインタを採用するべきだと判断したのか、そうでないのかも気になります。

Issueの中でも、colmtuite氏によって次のような指摘がされています。

さらに10月21日の会議では、調査対象のデザインシステムを増やして見直したところ、defaultとpointerがおよそ半々に分かれたという発言もありました。

npmで配布されているモジュールではpointerが圧倒的に多い一方、BootstrapやTailwindのようなデザインシステムでは6:4でdefaultのほうが優勢だったようです。

リンクでないUIならば、カーソルを指ポインタにするべきではない。の記事内で紹介しているCodePenには含めませんでしたが、実はすでにリンクでなくても指ポインタになる例外が存在します。

画像だけでは押せることが伝わりにくいためでしょうか？input[type="image"]は送信ボタンとして振る舞うにもかかわらず、ブラウザによっては指ポインタになります。

今あるものから最善を目指し、さまざまな意見を総合して仕様を決め、進化していく。そういった側面も含めて、筆者はWebというテクノロジーを素晴らしいものだと思っていますし、今回の決定も受け入れていこうと思います。

誤字がそのまま生き残っていたり、命名規則が他とズレていたり。Webとは、そういうものなのです。

いつかこの決定が、Webの体験をより素晴らしいものにしてくれることを願っています。

今回の決議は、ブラウザが標準で適用するスタイル（UAスタイルシート）を決めるものです。

フォーム関連要素のappearance: base;でcursor: pointer;に指定されるからといって、開発者がpointerを採用しなければならない、というわけではありません。

最終的にカーソルをどう表現するかは、「ブラウザの外にあるOSやアプリケーションのUIと操作感を揃えたい」といった、Webデザイナーの意図によって決められてよいはずです。

今回の決議は、クリック可能なUIを指ポインタに「してもいいこと」を明確にしたものであって、「するべき」でも「しなければならない」でもないと筆者は理解しています。

よって、当サイトでは引き続き「リンクならば指ポインタ」という従来の整理を維持したいと思います。

そもそも、リンクなのか別窓で開くリンクなのか、ボタンなのかがわかるように、UA側で教えてくれればよいのではないでしょうか。pointerだけだからおかしくなるのであって、defaultとprogressの見た目の違いのように、指ポインタの横にもう1つアイコンを付けたらいいだけな気もします^[1]。

先ほど紹介したHaz氏（diegohaz氏）もIssueで同じような趣旨のことを述べていますが、筆者も本当にそう思います。

→ diegohaz氏のコメント - w3c/csswg-drafts#14251

summary要素とか[tabindex]:not([tabindex="-1"])とかも、どうにかなってpointerに揃う未来があるのでしょうか。

フォーム関連要素のスタイリングを扱う仕様の議論なので対象外なのかもしれませんが、Issueを読んだ限りでは、summary要素やdetails要素への言及は見当たりませんでした。

こうなったら、フォーム関連要素とそれ以外のマウス操作ができる要素で表現を分ける必要はないはずなので、この辺りのチグハグがどう解決されていくのか、とても気になります。