住所の入力は時間がかかり、ストレスを感じることもあります。住所 2 行目は何に使用しますか?姓がない場合は、[姓] フィールドに何を入力すればよいですか?このような混乱を避け、ユーザーが住所フォームに記入できるようにします。
ユーザー フレンドリーなフォームを作成する
多くのフォームでは、名と姓にそれぞれ 1 つのフィールドを使用しています。ただし、姓がない人や、名前が 2 つの部分に分かれていない人もいます。そのような場合は、姓のフィールドにどのように入力すればよいですか?name フィールドには 1 つの <input> を使用します。詳しくは、さまざまな名前形式の処理をご覧ください。
調査によると、住所 2 行目はユーザーにとってわかりにくい可能性があります。アドレス全体に <textarea> を使用するか、住所 2 行目フィールドを <button> の背後に隠すことを検討してください。
フォーム コントロールの説明には注意してください。たとえば、米国では「ZIP」、英国では「postcode」と発音します。<label for="zip">ZIP or postal code (optional)</label> を使用して、ユーザーが入力すべきデータを把握できるようにします。郵便番号のフィールドを省略可にする。すべての住所に郵便番号があるわけではありません。
ユーザーが住所を入力できるようにする
autocomplete 属性を使用すると、ユーザーが住所を再入力しやすくなります。
autocomplete="name"autocomplete="street-address"autocomplete="postal-code"autocomplete="country"
autocomplete には、スペースで区切られた複数の値を定義できます。たとえば、配送先住所のフォームと請求先住所のフォームがあるとします。請求先住所の郵便番号をブラウザに伝えるには、autocomplete="billing postal-code" を使用します。配送先住所の場合は、最初の値として shipping を使用します。
enterkeyhint 属性を使用して、画面キーボードの Enter キーのラベルを変更します。最後のフォーム コントロールには enterkeyhint="done" を、その他のフォーム コントロールには enterkeyhint="next" を使用します。