フォームデザイン虎の巻：フォームの基礎をおさえる

エ・ビスコム・テック・ラボ
2008/07/17 08:00

ユーザーから情報を受け取る大切な窓口「フォーム」。しかし、フォームのデザインが悪ければ不正確な情報が入力されたり、入力をあきらめてページから離脱されてしまう。窓口の整備を始める前に、まずはどんな種類のフォームがあるのかをみていこう。

　フォームはユーザーから情報を送信してもらうために、さまざまな場面で利用されている。ブログのコメント投稿フォームやオンラインショッピングの注文フォーム、検索用のキーワード入力フォームなど、フォームがなければサイトの用途は半減してしまうだろう。

　しかし、せっかくフォームを用意しても、使い勝手が悪いせいで、ユーザーが情報を送信してくれなければ何も始まらない。また、情報を送信してもらえても、入力ミスが多発するようではせっかくの情報も役に立たなくなってしまう。

　情報を正確に入力して送信してもらうためには、フォームをわかりやすく、ユーザーを迷わせることのないようにデザインすることが求められる。どこに、何を、どのような形で入力すればよいのか。それが簡単に伝わるデザインこそ理想的だ。

　そこで、本連載では4回にわたってフォームの基本的なデザインについて取り上げていく。今回は、フォームのタイプについて見ていきたい。

フォームのタイプ

　フォームには次のように多様なタイプがあり、組み合わせて利用することができる。わかりやすいフォームを作成するためには、送信してほしい情報に合わせて最適なタイプを選択することが必要だ。

フォームのタイプ フォームのタイプ
※ブラウザで表示を確認する

　そこで、それぞれのフォームのタイプがどのような情報の入力に適しているのか、どのように利用するのが有効なのかを次のページから見ていこう。

記事に関係する情報をコメントでお寄せください

ニックネーム : CNET_IDにログインしてコメントする

コメント本文（必須） :
  • 新着記事
  • 人気記事
  • 特集
  • ブログ
  • 話題のタグ
Mozilla JavaScript HTML PHP CSS モバイル セキュリティ リファレンス Java Chrome Google iPod touch Linux Ajax Internet Explorer データベース iPhone Firefox 3 WebKit RIA ソフトウェア開発 小技 脆弱性 Webサービス Windows 仮想化 プログラミング言語 アプリケーション Windows Vista UI 開発環境 Opera インストール ブラウザ OS Safari Off Topic Windows 7 Windows XP Mac OS X Flash Database オープンソース Firefox Microsoft Webデザイン Apple Tips マイクロソフト iPhone 3G
  • 話題のタグを見る »