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

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

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

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

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

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

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

フォームのタイプ

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

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

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

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

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

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