タグ

ユーザビリティに関するhikute_amataのブックマーク (101)

  • シニア層のためのWebサイトユーザビリティ

    2013年3月23日 ユーザビリティ 以前「笑っていいとも!」の山口智充さんのコーナーを見ていて、ちょっと驚いた事があります。20代~60代の女性の必需品をランキングしたもので、40, 50代女性では5位圏外だった「パソコン」が60代で3位にランクイン。シニア層のインターネット利用率は年々高まってきているのはニュース等で読んでいましたが、これを見てなんだか実感しました。という事で今回はシニア層のWebサイト設計について考えてみたいと思います! ↑私が10年以上利用している会計ソフト! 上記「笑っていいとも!」の件で興味を持った私は、シニア層のインターネット利用方法なんぞを調べていたところ、丁度私の母親が「インターネットで買い物がしたい」と言ってきました。彼女は海外に住む私と連絡をとるためにメールやSkype等を使う事ができるので、ある程度インターネットについて理解しているのだと思っていまし

    シニア層のためのWebサイトユーザビリティ
  • http://e0166nt.com/blog-entry-889.html

    http://e0166nt.com/blog-entry-889.html
  • フォームのリセットボタンを考える-独学!未経験からWebデザイナーになる!!

    ※当サイトは、アフィリエイト広告を掲載し、収益を得て運営しています。 Webページの送信フォーム。きっとあなたも、ネットショッピングや問い合わせなどで使ったことがあるのではないでしょうか。 今回焦点をあてたいのは、そのフォームの中でも脇役とも言えるリセットボタン。つまり、フォームの入力内容を初期化するボタンです。 リセットボタンは大抵のHTMLを見ると、送信ボタンと併せて説明されています。それはなぜか……と言えば基中の基だからだと思うのですが、このリセットボタン、時にユーザーをいやな気持ちにさせてしまうこともあるのです。 今までは何も考えずに送信ボタンのとなりにリセットボタンを置いていた……という方もいると思いますが、このページではデメリットについても考えてみたいと思います。 リセットボタンは何のためにある!? そもそも、リセットボタンは何のためにあるのでしょうか。いったいどういっ

  • 別ウィンドウ問題はタブブラウザが解決する!? - 「 Firefox ×?=!」を考えてみる、ブログ。

    使いやすさを考えてみる。(アクティブシニア・シルバー層の現場から): 別ウィンドウは何故いけないのかより、シニアにおいて別ウィンドウは何故いけないのかについて。 シニア層や初心者層をユーザーとして捉えているウェブサイトならば、やってはいけないことの一つに「別ウィンドウ」がある。 その理由 1)別ウィンドウが開いたことに気づかない 前のページに戻るボタンで戻れないことに驚愕しがち。 2)マルチウィンドウの概念がない。 ウィンドウの切り替えが出来ない。 3)×がどのウィンドウに所属しているかの概念が薄い (以下略) 詳細はリンク先の記事を読んでもらうとして、このような場面はシニアに教える際によく遭遇する。ウインドウを複数開いたまま何かをするということが思いつかないようで、別のウインドウを開いたままほかの事をする、というのも自発的に行うことは少ない。そこまでひどくない場合でも、ウインドウを複数開

    別ウィンドウ問題はタブブラウザが解決する!? - 「 Firefox ×?=!」を考えてみる、ブログ。
  • 安心感を与えるフォームページ (ユーザビリティ実践メモ)

    個人情報の取り扱いに厳しい目が向けられる昨今、入力フォームはセキュアなサーバに置くなどの配慮をしているウェブサイトも多いかと思います。 安心感を与えるフォームページを実現するために弊社が考えるのは、「ユーザが不安に思うタイミングに、明示的に安心要素を配置する」ということです。 ユーザは、個人情報などを入力するページにアクセスした途端にセキュリティに関して気にする傾向があります。そこで、ページ上部にセキュアであることを証明するマークを配置することが検討できます。 また、一通り入力をし終えたユーザは、次に画面に移動する際に「次へ」ボタンなどのリンクをクリックする際にも、「当にこのウェブサイトはセキュリティがしっかりしているのだろうか」という不安に駆られます。 次のページに遷移するアクションボタンの近くにも「セキュリティ保護のためSSL(暗号化通信)を使用しています」などの文言や、セキュリティ

  • 「関連リンク」の幻? 意図した誘導を行うための導線設計 (ユーザビリティ実践メモ)

    あるコンテンツを見たユーザに対して「次にここを見て欲しい」という制作側の意図に反して、中々思い通りに見てもらえないといった話をお伺いすることがよくあります。 例えば、記事系のコンテンツで、記事を閲覧したユーザに対して関連記事や関連する製品ページへと誘導する場合、記事の下部に「関連リンク」のエリアを設け、その中に意図した誘導先のリンクを配置しているケースがよく見受けられます。 上記のような方法で、果たして意図通りにユーザを誘導することができるでしょうか?今回は「ユーザがこのページ以上の情報を積極的には求めていない」ケースについて考えてみました。 弊社の実施したユーザ行動観察調査においては、多くのユーザが価格まで閲覧した後にページの上部に戻り、そのまま見るのをやめてしまうという行動が見られました。 ここで、このような行動に至った原因を考えてみましょう。 アイトラッキングによる分析やユーザへのヒ

  • iPhoneサイトで気をつける3つのポイント (ユーザビリティ実践メモ)

    スマートフォン利用者の増加に伴い、スマートフォン、特にiPhone対応サイトを用意する企業が増えてきましたが、必ずしもデバイスの特徴を考慮したサイトとなっていないケースが見られます。今回は弊社の調査で見られたユーザ行動を元に、iPhoneサイトで気をつけるべきポイントをご紹介します。 従来の携帯では下ボタンで画面をスクロールさせる際リンクに順番にフォーカスがあたるため、テキストリンクでもユーザの視線が止まりやすい傾向があります。一方iPhoneでは指で画面をスクロールさせるため、リンクにフォーカスはあたりません。テキストリンクがアイキャッチとなりにくく、携帯と比較して文字情報がまとめて読み飛ばされるケースがみられます。ユーザの目線を止めるには、アイキャッチ用の画像を配置するなどの工夫が必要です。 【ポイント2】細かな操作はさせない iPhoneはタッチパネルを指で操作するため、画面上の1点

  • http://oalp.org/doc/nilesen/

    For full functionality of this site it is necessary to enable JavaScript. Here are the instructions how to enable JavaScript in your web browser.

  • フォームとアクセシビリティ -- ごく簡単なHTMLの説明

    フォームはテーブルと同様、視覚的な表現を伴わないと理解しにくいところがあります。HTML4.0では、フォームの各要素とラベル(説明的な名前)を結びつける手段や、要素をグループ化する手段が提供されました。これらを使うとフォームの内容を論理的に構造化でき、スタイルシートとの組合せで自在なデザインも可能になってきます。まだ未対応のブラウザが多い要素ですが、アクセシビリティに配慮したページづくりのためにも、このような機能があることをぜひ理解しておいてください。 目次: コントロールにラベルを付ける コントロールをグループ化する メニュー項目のグループ化 キーボードによる項目移動 取り上げる要素: label fieldset legend optgroup コントロールにラベルを付ける フォームの入力コントロール(テキストフィールドやメニューなど)は、name属性を持ちますが、それは送信データに名

  • 40分でできるホームページ診断 ~最低限クリアしたい40項目のチェックシート | Web担当者Forum

    40分でできるホームページ診断 最低限クリアしたい40項目のチェックシート[訪問者目線編 2008年版] SEO? ユーザビリティの向上? それ以前にしなきゃいけない「サイト作りの基のキ」を、あなたのサイトではちゃんとできているだろうか? 高度な施策に目を向ける前に、最低限クリアしておきたいチェックポイントをまとめてみた。あなたのサイトは何点とれるだろうか? TEXT:編集部 協力:株式会社 環 ウェブサイト作りの基のキSEOやユーザビリティに限らず、キーワード広告、アクセス解析、LPO、リッチインターフェイスなど、サイトの効果をアップさせる手法はさまざまあり、Web担でも詳しく解説してきている。 しかし、そういった施策にコストを割く前に、現状の自社サイトが、訪問者が「あれれ?」とマウスをうろうろさせてしまうような状態になっていないか確認したことがあるだろうか。 そんなあなたのために、

    40分でできるホームページ診断 ~最低限クリアしたい40項目のチェックシート | Web担当者Forum
  • ウェブサイトをより単純にして、分かりやすくする -Design Simplicity

    ユーザーがより簡単にインフォメーションにアクセスできるように、ウェブサイトをより単純にして分かりやすくする「Design Simplicity」を取り入れる方法をWeb Designer Wallから紹介します。 What to Expect in 2010: UX/UI Design Simplicity 下記は各ポイントを意訳したものです。 はじめに 今年も多くのデザイントレンドがあります。しかしながら、私はデザインの単純さ(Design Simplicity)にフォーカスをあわせることが重要であると感じます。 デザインの単純さとは、より少ないページ、より少ないクリック、より少ない取り散らかし、そして多くのホワイトスペースを意味します。そして、我々のユーザーはそれを求めています。 増加するインフォメーションへのアクセスは、ユーザーの集中力低下の原因となります。デザイナーは今まで以上にユ

  • コンバージョン直前のユーザがつまずきやすいポイント (ユーザビリティ実践メモ)

    コンバージョン率向上を考えた場合、エントリーフォーム最適化(EFO)など、フォーム内の改善に意識が向きがちですが、実はフォームに入る前の段階にも改善すべき点が残されている場合があります。 今回はフォームに入る前のページでよくみられる、ユーザのつまずきやすいポイントをご説明します。 ウェブサイトを訪問しているユーザにとって、個人情報の入力などの手続き行為は主目的ではありません。商品を購入したり、申し込み後にサービスを利用することが当の目的です。その目的に早く到達するため、手続き行為にはできるだけ手間をかけず、手早く終わらせようとする傾向が見られます。 ここで、注意が必要なのが手続きの途中に会員登録のステップがあるケースです。 ECサイトでは「購入」の手続きの途中で「既存/新規ユーザ」の振り分けが行われる場合がありますが、ユーザは手続きのステップとして「会員登録」が必要あることを必ずしも事前

  • ユーザを混乱させない表組みのコツ (ユーザビリティ実践メモ)

    ウェブサイト制作において、多くの情報をいかに整理してユーザに伝えるかは重要なポイントの1つです。よく使われる方法として表組みがありますが、今回は実際の事例をもとにしたケーススタディを通じて、ユーザを混乱させない表組みのコツをご紹介します。 表1はよく見かける表組みの例ですが、実際にユーザの立場に立ってこの表を使用してみると、いくつかの問題点があります。 同種の情報をユーザは区別できない 表1の問題点として、 日付という同種の情報を多く掲載しているため、ユーザには各情報が何の日付を意味しているのか区別できず、分かりにくい列数が多いために、セル内に折り返しが発生し、読みにくい ことが挙げられます。 特に、1つ目の問題点は、表が縦に長い場合にユーザを混乱させる要因の一つになります。なぜなら、画面サイズに収まりきらないほど表が縦に長い場合、下にスクロールしていくと「開催日」などの項目名が画面から消

    hikute_amata
    hikute_amata 2010/01/27
    言える言える
  • わかりにくい1クリックよりも、わかりやすい2クリック (ユーザビリティ実践メモ)

    トップページに多くの要素を盛り込まねばならず、情報の整理に悩んでいる方も多いのではないでしょうか。そんな時、ユーザの文脈を考慮することで情報整理方法が見えてきます。 上の画面例はBtoB向け製品を主に扱っているメーカーサイトのトップページです。各製品カテゴリへのテキストリンクがトップページに配置されており、弊社のユーザ行動観察調査では、はじめてこのサイトを訪れるユーザが「何かごちゃごちゃしている」と言いながら、どこをクリックすべきか迷う傾向が見られました。 そこで、 トップページでは大まかに振り分け、次の階層で各製品カテゴリを選ばせるという図2のような画面に変更したところ、ユーザは目的の製品ページへスムーズに到達できるようになりました。 改善後の画面 目的のページに達するまでのクリック数は少ないほうがよいと言われますが、クリックを減らすことが目的になってユーザを迷わせてしまっては末転倒で

  • コラム一覧|ビービット(beBit)- エクスペリエンス・デザイン・パートナー

    コラムの前編では、昨今eNPS℠が重要になってきていること、また、eNPS℠には「正当な報酬」・「正当な評価」・「顧客への貢献実感」が影響していることを述べました。 コラムでは、仕事の役割が見える「部署」を切り口に、eNPS℠の比較を行い、そこからeNPS℠を高めていくための方法について考察・ご紹介します。 「中国のデジタルサービスが進んでいる」「中国のCX/UX※1が優れている」そんな評判や記事を最近多く耳にするようになりました。また、Alibaba傘下のAnt Financialが、Harvard大学から「先進的かつ再現可能」なビジネスとして評価され、Harvardビジネススクールの企業事例集に取り上げられたことは記憶に新しいニュースです。 コピー商品や、「安かろう悪かろう」の製品のイメージが根強くあった中国。しかし、そのような「偏見」はもう昔のことです。中国は今、デジタルを活用し

    コラム一覧|ビービット(beBit)- エクスペリエンス・デザイン・パートナー
  • 「写真が勝負」のサイトは、どんな写真を載せるべき? (ユーザビリティ実践メモ)

  • テキストと画像、どのように使い分けていますか? (ユーザビリティ実践メモ)

    ウェブサイトは、テキスト、画像、動画など様々な要素で構成されています。皆さんはそれらをどのように使い分けているでしょうか?今回は、ユーザがサイトを訪問する際の目的意識の強弱による使い分けのヒントをご紹介します。 弊社ではユーザ行動観察調査にアイトラッキングを用い、サイト利用時の視線の動きを調査していますが、そこで頻繁に見られる興味深い現象をご紹介しましょう。 あるメーカーサイトを題材として行った調査では、特定の情報を求めて訪問するケース(以下、探索モード)と、サイトのファンなど定期的にサイトを訪問しており、特に強い目的がないケース(以下、回遊モード)でユーザの目線の動きに明確な違いが見られました。(下図参照) 探索モード(図の左側)では、主にテキストリンクを中心に目的のコンテンツへのリンクを探す傾向があるのに対して、回遊モード(図の右側)では、バナーなどの画像を中心に見ていく傾向が強いこと

  • http://www.designwalker.com/2009/08/user-interface.html

    http://www.designwalker.com/2009/08/user-interface.html
  • 「写真が勝負」のサイトは、どんな写真を載せるべき? (ユーザビリティ実践メモ)

    ホテルのサイトや結婚式場のサイトなどでは、ユーザにどれだけ写真で施設の魅力を伝えられるかどうかが、資料請求や宿泊予約といったサイトの成果に大きく影響します。 今回はそのような「写真が勝負」のサイトで、どんな写真を載せるのがよいか悩んだ際の解決方法をご紹介します。 ホテルや結婚式場では、ウェブサイトに限らず、雑誌などの紙媒体でも写真が非常に重要です。どの写真を載せるか次第で、読者の反応が大きく異なると思われます。 ウェブサイトでも同様に、数ある写真の中からどれをサイトに載せるべきか、必死に悩んでいるという担当者の方は多いのではないでしょうか。� しかし、ウェブサイトでは「勝負写真」選びに悩むのは、非常にもったいないと言えます。�ウェブサイトは紙媒体と違い、スペースに限りがありません。あれかこれかで悩んだときは、両方載せてしまってもコストはほとんど変わりません。よい写真が30枚あるなら、30枚

    hikute_amata
    hikute_amata 2009/08/16
    写真点数は○点まで!って指示だしてるなあ。作り手の都合ってことやね。
  • 謝ったら負け!? アイコンも使い方次第 (ユーザビリティ実践メモ)

    Webサイト上で、ユーザが目的の情報にたどり着きやすくするために、複数の条件での検索機能を提供することがあります。 たとえば、不動産業やCATVなど地域に関連したサービスで、ひとつのフォームから、郵便番号でも町名でも検索ができるような機能を実装しているような場合です。 この検索機能に関して、ユーザ行動観察調査を実施したところ、以下のような行動が見られました。 まず、ユーザは郵便番号を入れて、検索を行いました。 しかし、このユーザが入れた郵便番号が間違っていたため、次のようなエラーが表示されました。 すると、このユーザは即座に「あ、ダメなんだ」とこのサイトを離脱してしまいました。 実際には、正しい郵便番号を入れ直すか、町名を入れることで再度検索が可能なのですが、このユーザに再検索をしてもらうことはできませんでした。 この行動の裏には、以下のような心理の動きがあると考えられます。 アイコンを見