振り分け画面でユーザを逃していませんか？ (ユーザビリティ実践メモ)
会員・非会員など、ユーザの状況によってウェブサイトに複数の入り口がある場合、振り分けが必要となります。今回は、そのような振り分け画面での要素の配置についてのコツを紹介します。 この画面を訪れたユーザは、すでにサービスに入会している方でしたが、少し迷った末、一番上の「○○プランお申し込み」（新規入会者用のリンク）をクリックしてしまい、かなり先に進むまで自分が間違えていることに気づきませんでした。 そこで、上の画面を、次のように変えてみたところ、ユーザはスムーズに自分の状況に適したリンクを選択することができるようになりました。 この画面で問題が解消された最大のポイントは、振り分けの要素を左右に並べたことです。 人は左右に並んでいる要素に対しては「対等な要素」、あるいは「対比されている要素」だと認識する傾向があります。したがって、左右に要素を並べられると、無意識的に「2者を比較しよう」というモー
2/3 押しやすいチェックボックスやラジオボタンを作るCSS [ホームページ作成] All About
押しやすいチェックボックスやラジオボタンを作るCSS(2ページ目)HTMLのinput要素で作る「チェックボックス」や「ラジオボタン」は、標準ではクリック可能な範囲が狭くて使いやすくはありません。label要素を使ってラベル文字部分もクリック可能にしたり、fieldset要素を使ってグループ単位で囲んだりすることで、PC環境でもモバイル環境でも分かりやすく・使いやすく表示する方法をご紹介。 チェックボックスやラジオボタンに「ラベル」を加えて使いやすくする方法 それでは、チェックボックスやラジオボタンを使いやすくする記述方法をご紹介致します。まずは、特に使いやすくはない普通の例を掲載しておきます。 ■ラジオボタンの作成方法： ラジオボタンは、input要素のtype属性の値を「radio」にすると作れます。 <input type="radio" name="fruit" value="or
![2/3 押しやすいチェックボックスやラジオボタンを作るCSS [ホームページ作成] All About](https://cdn-ak-scissors.b.st-hatena.com/image/square/86d6a32492687fe8753aa3fdc74f095ce3fad352/height=288;version=1;width=512/https%3A%2F%2Fimgcp.aacdn.jp%2Fimg-a%2F1200%2F900%2Faa%2Fgm%2Farticle%2F2%2F3%2F9%2F5%2F6%2Ftopimg_original.png)
ウノウラボ Unoh Labs: ECサイトのユーザビリティ・ガイドライン
こんばんわ、Sashaです。 最近、ECサイトのリニューアルを計画するお手伝いをする、という仕事がありました。特にユーザビリティ的な観点から、どんなことを網羅したらこのリニューアルを成功させることができるだろうか、ということを考えながら、様々なブログを参考にしたり実際のECサイトを検証したりしていたら、以前私が紹介したユーザビリティ・ガイドラインのようなチェックリスト的なものが出来上がったので、もしかしてどこかのだれかのお役に立つこともあるかもしれない、と思い、ここに紹介させていただきます。 まず、ECサイトで実現したい基本的な目標をあげ、その目標に沿って細かく、網羅していきたい事を列挙していきました。 基本的な目標とは、次の5項目です。 見つけたい商品・情報を見つけやすくする ユーザーの労力を極力削減する 買いたい気にさせる 購入までのプロセスを簡単にする オンラインショッピング
netswitch! | Lightbox JS : Webとモーダルダイアログ
edit Lightbox JS : Webとモーダルダイアログ Posted by nanki Thu, 23 Feb 2006 00:25:00 GMT Lightbox JSを使ってみた。 <a href="large.png" rel="lightbox" title="..."> <img src="thumbnail.png"> </a> というコードを書き、画像をクリックすると、ページ遷移は起こらずに、画面が半透明の膜で覆われ、その上に大きい画像が表示される。(実物を見るのが早い) すぐに、これはモーダルダイアログの代わりになるなと思い、prototype.jsと組み合わせて、画像以外も表示できるか試してみた。 モーダルダイアログには使いにくいという印象しかないのでどうなることかと思いきや、思いのほか使いやすい。 思うに、WebにおけるUIというのはほとんどモーダルなのだ。設
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
