ウェブサイトの中でユーザーが操作する部分と言えば、お問い合わせや会員登録などの「入力フォーム」が主なところだと思いますが、
ただ単にinputタグでコーディングされたフォームだったり、ブラウザ標準のスタイルのままでは、ユーザーにとっては入力しにくいと思います。
特にスマホやタブレットなどのタッチデバイスでは マウスのような精密な操作ができないため、
フォームでの操作にストレスを感じることがありますが、
ちょっと手を加えるだけで入力しやすく親切なフォームを実装することができます。
よく見かけるお問い合わせフォームです。
デザインを再現し、メールフォームとしての機能を最小限実装した場合はこちら(メールは送信されません)。
更にこの状態から、入力しやすいようにコーディングしていくと、このような感じになります。
実際にコーディングしたフォームはこちら(メールは送信されません)。
いかがでしょうか。
変更点をリストアップするとこのような感じです。
・labelタグで見出しと入力ブロックを紐づけ、クリックで入力ボックスへ移動
・入力ボックスをクリックしやすいように、paddingをつけて領域を拡大
・チェックボックスやラジオボタンは、テキストにも選択領域をつける
その際、「テキスト部分もクリックできる」という認識を持たせるため、マウスカーソルを変化させる
・送信ボタンが「実際にアクションするボタン」なんだということをわかりやすくするため、マウスを乗せると見た目が変化する
更にもっと!、となれば「住所自動入力」や「必須項目をポップアップで知らせる」など・・・
ユーザー側の手間を減らせれば、メールフォームから送信されやすくなり、
会員登録や資料請求されやすくなります。