WEB制作|仕事の進め方

WEB制作|仕事の進め方

ユーザーが混乱しない、使いやすいフォーム

newsing it!

ユーザーが混乱しない、使いやすいフォームを実装するために
気をつけたい10のポイントというような記事を見かけましたので、
自分用リマインダーとして。


『使いやすいフォームを実装するために気をつけたい10のポイント』


1.入力フィールドはシンプルに
   たいていのフォームには複数の入力フィールドがあります。
   フォームの目的はユーザーからの適切なフィードバックを得るのが目的なので、
   必要無いものや関係無い入力フィールドは削除します。

 2.ラベルは分かりやすく
   入力するユーザーの立場にたって、ラベル付けします。
   例えば、「コメント」と単に記すだけでなく、
  「コメントを残してください」
  「あなたの意見をどうぞ」
  などです。
 
   また、「URL」などは用語に精通していないユーザーもいるので、
  「ホームページ」のように分かりやすい文言にします。

 3.必須入力のサインは目立つように
   入力フィールドに必須項目がある際、それを認識できなかったユーザーは
   エラーになると混乱します。
   必須項目に「*」だけを使用するのはシンプルでよさそうにみえますが、
   はっきりと「必須入力」などのようにテキストで明記します。

 4.入力の流れを壊さない
   ユーザーがフォームを入力する際、スムーズに入力できるように
   各入力フィールドを配置します。
   例えばサブミットボタンの後に、チェックボックスなどのちょっとした
   入力フィールドを配置しないでください。

 5.入力は簡単なものから
   入力フィールドが複数ある際、ユーザーが簡単に答えられるものを
  最初に配置します。
   例えば、コメント欄より名前・メールアドレスを先に配置します。
   ユーザーが思考するなどして入力が困難なものほど終わりに配置します。

 6.フィードバックは少しでも早く
   入力時のエラーのフィードバックはAJAXなどを使用して、
  少しでも早いタイミングで ユーザーに伝えます。
   
   入力文字数に制限がある場合などは、ユーザーが入力してから
   エラーを伝えるのではなく、入力する前にユーザーに分かるように
   フィールドの隣に明記します。

 7. CAPTCHAは避ける
   入力したのが人なのか、コンピューターなのかを区別するために使用する
   CAPTCHAは可能であれば避けてください。

   WordPressであれば、標準のAkismetのプラグインを使用することで
   スパムを排除できます。

 8.習慣には従う
   自分が考えた新しい機能は使用しないでください。
   おそらくそれは失敗する見込みが高いです。
   
  多くのウェブサイトで使用されている書式やデザインにならって
  フォームを作成します。

 9.多言語対応の検討
   ウェブサイトは全世界の人が閲覧可能で、フォームを全世界の人々が
   入力するかもしれません。
   そのため、異なる言語の習慣を念頭において制作します。

   手始めとして、名前の入力フィールドは「姓」「名」と二つのフィールドに
   分けてしまうと、姓と名が逆の順番の言語や二つ以上の文化もあるので、
   名前のフィールドは単純に一つにします。

10.ビジュアルだけにたよらない
   ビジュアル要素は非常に大事な表現方法ですが、フォームに関してはユーザーを
   混乱させてしまう場合があります。
   
   例えば、ウェブサイトの入力欄にアイコンだけを設置するのではなく、
   記述的なラベルを使用した方がユーザーを混乱させないでしょう。
| デザイン |

WEBディレクター、WEBサイトの仕事の進め方、失敗しないWEB制作について、ホームページ制作、ホームページ作成に関する質問



WEBディレクターの新着記事

EFO(Entry Form Optimization: エントリーフォーム最適化) (seo)

今日は入力フォームのコンバージョン率をアップさせる方法、EFO(Entry Fo・・・

Gumblar(ガンブラー)ウイルス (WEBディレクター)

ご挨拶が遅くなりましたが、新年あけまして おめでとうございます。本年もよろしくお・・・

W3Cとは? (seo)

W3C(World Wide Web Consortium)とは、世界のホームペ・・・

企業サイトのページボリュームとSEO (seo)

SEOとページのボリュームの関係を少し調べていたところ、詳しく解説しているサイト・・・

エア参拝 (生活)

今年も残すところ1ヵ月と少しになりました。普段、ふとした時に参拝したいと思った時・・・

高機能なSEOツール SEOチェキ! (seo)

今日は、使いやすくて高機能な国産のSEOツール『SEOチェキ!』の機能をご紹介。・・・

meta descriptionの文字数は? (seo)

meta descriptionの文字数は?SEOを考慮した場合、descrip・・・

単調なウェブサイトのデザインに手を加えてクオリティをアップ (デザイン)

デザインを制作する上で、一度完成されたデザインに手を加えて、クオリティーを上げる・・・

ユーザーが混乱しない、使いやすいフォーム (デザイン)

ユーザーが混乱しない、使いやすいフォームを実装するために気をつけたい10のポイン・・・

HTTPリダイレクト(redirect,転送) (seo)

HTTPリダイレクト(redirect,転送)について、その動作とSEOの効果に・・・

ユーザビリティって? (デザイン)

一般的に、「ユーザビリティ」と言う言葉は「使いやすさ」という意味合いで使われてい・・・

理想的なHTMLや最適なSEOよりも時間対効果 (seo)

今、すでにあるホームページを「SEO的に強くしたい」とった目的で新たにSEO対策・・・

会員登録を阻害するハードル (デザイン)

携帯向けサイトなどでアクセス数はそれなりにあるのになかなか会員登録に結びつかない・・・

説明下手の理由 (生活)

今までに、自分の言いたいことがうまく伝わらないといった経験がある方は少なくないと・・・

過去のSEOテクニック (seo)

効果があると言われていたSEOのうち既に過去のものになっている対策方法や、気にす・・・

スタイリッシュなロゴをさくっと作れるサイト (デザイン)

今回は、単にロゴが作れてしまうツールがありました。簡単に作れる割には、結構カッコ・・・

これまでのSEO対策の効果をうまく引き継ぐサイト移転方法 (seo)

『ドメイン変更によるSEOのリスク』今の検索エンジンはドメインの「年齢」を評価す・・・

3大検索エンジンでの順位を一括検索 (seo)

今日は、手軽に3大検索エンジンでの順位を一括検索できるツール提供サイト「SEO ・・・

日本のブログ界を一望 (WEBディレクター)

今日は、ブログの勢力図のようなサイト、ブログランキングサービス『TopHaten・・・

ウェブサイトをリラックスして楽しんでもらう (デザイン)

ウェブサイトをユーザーにリラックスして楽しんでもらえるようにするために、Webデ・・・


お問い合わせフォーム

TEL:03-6435-4240
午前9時~午後9時まで

WEBデザイン制作 東京