skillup

技術ブログ

デザイン

フォーム入力のポイント

投稿日:

以前のエントリーにならってさらにフォーム入力のデザイン上のポイントなどを。

選択肢は横よりも縦で

ラジオやチェックボックスなどで大量の選択肢を並べる場合、人間の視認性は横よりも縦のほうが勝るため、左右にずらずら並べるよりも縦に並べるようにしましょう。

エラーがすぐにわかる入力欄を

  • エラーの内容がすぐにわかる。文字だけでなく色ですぐにわかる。専門用語をつかわない。
  • リアルタイムでエラーチェックが行える
  • 入力例がある

会員登録ではメリットをわかりやすく

会員登録では基本的に煩雑なので、わかりにくい契約事項ではなく、メリットを分かりやすく述べる。

必須項目はなるべく少なくする

数項目だけで、会員登録でき、必要な項目はあとで入力できるようにする

重要な個人情報はできるだけ聞かない

Web見積もりだけなのに、住所や電話番号などをしつこく聞く

トラブル対応やカスタマーサポートなど

漠然とではなく、こちらから質問内容を絞る。商品の型番やお問い合わせの種類など具体性のある質問をする。

-デザイン

執筆者:


comment

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

関連記事

no image

HTML5について

CSSのサンプルを書いていく途中で、HTML5タグが出来てたので簡単におさらいです。 Contents1 HTML5のメリット1.1 form周りのhtml1.2 文章構造の明確化1.2.1 navに …

no image

tableのレイアウトに関して

tableのcssに関して。 https://github.com/umanari145/css 幅を決めるのでも%表記をしたいときはauto、数値固定で行きたいときはfixed。 詳しくはリンクのt …

no image

css animationの使い方、他スクロース量でのアニメーションなど

transitionとちょっと近いですがCSSでのanimationに関して。 HTML

CSS [crayon-6657cebbad …

no image

メインで使う画像のcssについて

CSSについていろいろと勉強したんですが、画像の使いに関して結構てこずったんでポイントをまとめておこうかと。 画像といっても商品の画像などワンポントでなくメインで使うタイプのものです。 imgタグをd …

no image

boostrapでのヘッダーナビ作成

昔から私の作るWEBアプリはデザインがめちゃくちゃなことが多かったんですが、最近は多少デザインにも気を配るようになってきました。 実はCSSがあまり得意ではなくて、うまく組むためにかなり苦戦していまし …

アーカイブ