問題タブ [web-accessibility]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
html - フィールドセットなしでアクセス可能なフォーム入力をグループ化する方法は?
問題: フォーム要素のグループ化
HTML フォームがありますが、単一のコントロールが複数の入力で構成されている場所はほとんどありません。1 つの例は、ラジオ ボタンのグループです。
これらの入力とそのラベルを明示的にグループ化して、スクリーン リーダーも (1 行に並べて表示するだけでなく) この関係を理解して通知できるようにしたいと考えています。
たとえば、次のようなコントロールがあるとします。
標準的なソリューションの問題: フィールドセットのスタイリングの問題
fieldset要素とその子legendは、まさにそのために作成されているようです (以下の例で使用)。
問題はfieldset、legend要素を通常の要素のようにスタイル設定できないことです (それについてのいくつかの議論)。最近では、Firefox 以外では、レイアウトが必要とする Flexbox を使用してそれらを 1 行に揃えることができません。
質問: 他の方法はありますか?
fieldset要素を使用する以外に、いくつかのフォームコントロールをグループ化するアクセス可能な方法があるかどうか疑問に思いますか?
考えられる解決策: role="group"?
シンプルに追加できる「グループ」ロール (以下の例で使用) があり、それはdiv仕事をするように見えますが、フィールドセットを使用するのと機能的に同等であると明確に述べられていません。もしそうなら、どうすればこのグループの要素を と同等の役割を果たすようにマークできlegendますか?