web-dev-qa-db-ja.com

YesまたはNoの質問のセマンティックフォームマークアップ

次のプロトタイプのHTMLフォームのモックアップを頻繁に受け取ります。

いくつかの質問はイエスかノーの質問ですか？ （o）はい（）いいえ

このプロトタイプの(o)および( )は、ラジオボタンを表します。私の個人的な見解では、質問の値がtrueまたはfalseのみの場合、チェックボックスにする必要があります。そうは言っても、私はこれまでに働いたほぼすべてのデザイナーからこの種の「レイアウト」を見てきました。

私が彼らの決定に疑問を投げかけたり、クライアントの決定に疑問を投げかけたりしなければ、おそらく次のようにマークアップするでしょう。

<p class="pseudo_label">Some long winded yes or no question?</p>
<input type="radio" name="the_question" id="the_question_yes" value="1">
<label for="the_question_yes" class="after_radio">Yes</label>
<input type="radio" name="the_question" id="the_question_no" value="0">
<label for="the_question_no" class="after_radio">No</label>

私は本当にそれをしたくありません。プッシュボタンを押して、2つのラジオボタンではなく、これが実際にチェックボックスであることを説得したいと思います。しかし、私の質問は、それらを納得させられない場合、試してみてください-スクリーンリーダーユーザーにとって意味があり、少なくとも理解できるように、元の設計要件をどのようにコーディングすればよいですか？

私の苦しみを説得して彼らの考えを変えることができたら、おそらく次のようにコーディングするでしょう。

<label for="the_question">Some long winded yes or no question?</label>
<input type="checkbox" name="the_question" id="the_question" value="1">

この問題についてどう思いますか？プッシュバックする必要がありますか？おそらくもっと重要なのは、どちらかの方法が意味的に正しいことですか？

UPDATE：あなたの提案に従って、UI SEに関連する質問を投稿しました。ここで見つけることができます： https://ux.stackexchange.com/q/3335/349

htmlsemantic-webmarkup
6
sholsinger

あなたのチェックボックスのアイデアははるかに効率的ですが、理にかなっている質問としてそれを述べることを避ける必要があると思います。例えば：

<label for="the_question">I would answer yes to this long winded question.</label>
<input type="checkbox" name="the_question" id="the_question" value="1">

ただし、デザイナーがラジオボタンモデルを維持することに固執している場合は、fieldsetタグを使用する方がはるかに意味のある意味を持つと思います。

<fieldset>
  <legend>Some long winded yes or no question?</legend>
  <input type="radio" name="the_question" id="the_question_yes" value="1">
  <label for="the_question_yes" class="after_radio">Yes</label>
  <input type="radio" name="the_question" id="the_question_no" value="0">
  <label for="the_question_no" class="after_radio">No</label>
</fieldset>

一部のスクリーンリーダーは、フォームを読んでいる間に段落をスキップするという厄介な習慣があるという噂を聞いたことがあります。ただし、それが正確かどうかは完全にはわかりません。

5
Jacob Hume

私は両方のアプローチに反対します。

ほとんどの場合、「長い質問」に実際に2つの答えがある場合、「はい」と「いいえ」は適切な選択肢ではありません。オプションは、行われている決定を示す短いフレーズである必要があります。

例。これの代わりに：

チケットの一部として会議宿泊を今すぐ予約しますか？
（ ） はい
（ ） 番号

これを行う

チケットの一部として会議宿泊を今すぐ予約しますか？
（）宿泊を予約したい
（）私は自分の宿泊施設を手配します

2
Bevan

デザイナーには、多くのプログラマーにはない特定のスキルセットがあります。同様に、ほとんどのプログラマーには、多くのデザイナーにはない特定のスキルセットがあります。時々、スキルはクロスオーバーしますが、真の専門家は専門です。

一部のプログラマーはコンピューターサイエンスのバックグラウンドを持っています。彼らは、ほとんどの素人が決して思いつかないことを学びます。これらのスキルは、これらのプログラマーが非常に複雑な問題を解決するのに役立ちます。

一部のデザイナーは、グラフィックデザインとユーザビリティに関する正式な教育を受けています。彼らは人間の行動を研究しています。彼らは異なるユーザーインターフェースの違いを研究し、彼らの専門知識を現実世界に適用します。

あなたは反対するかもしれませんが、デザイナーが尋ねることをしてください。私は、弁護士向けに15,000ドルのWebサイトを構築するデザイナーと協力しており、彼らが下す決定はすべて、アプリケーションを可能な限り明確かつ直感的にすることを目的としています。

デザイナーが仕事をしてお金を稼ぐデザインを作成することを信頼してください。順番に、彼らはあなたに彼らの強力なビジョンを実現する高品質のアプリケーションを作成することを信頼します。

0
jmort253