TRANS - alt=""を越えて。
集中的にアクセシビリティやユーザビリティを最近になってやっと学び始めました。JIS X 8341やWCAG1.0を読み進める中で、もっと自分自身勉強したいと思うようになってきました。そこで、JISやWCAGを学ぶ中で、自分がシニアや障害を持つ人との現場で、またそういった現場で働いている人たちの意見を踏まえた上で、疑問に思うことを列挙しておこうと思います。いずれは、こういうことをちゃんと実装レベルで解決できるようになりたいなと思いを込めて。 alt=""は空文字なのか、半角スペースなのか、それとも全角スペースなのか？ 少し前に「ブロガーのためのアクセシビリティガイドライン」を書きました。この際に、はじめはalt=""と空文字を打つと書いていたのですが、よくよく調べてみると、空文字だと音声ブラウザによっては「画像」と読み上げてしまうことがあるようです。また、全角スペースの場合は、日本語環境以外
誰のためのWebデザイン変更ですか？
サイトやブログなどのWebデザインを変更したくなるときがあります。 では、一体誰のためにWebデザインを変更したいのでしょうか？ 多くの人は、Webデザイン変更を以下の目的のために実行するものだと思い込んでいます。 1.自分のためにWebデザインを変更する 2.他人のためにWebデザインを変更する この思い込みによって、Webデザイン変更が裏目に出ているケースが多々あります。 大別すれば上記2通りだけなのかもしれませんが、実際はもう少し細かく分けた方が失敗が少なくなります。 1.誰のためにWebデザインを変更するのか？ では、一体誰のためにWebデザインを変更するのか、以下の4通りに分けて考えてみましょう。 1.自分のためにWebデザインを変更する 2.コンピュータ（検索エンジン、ケータイ、読み上げブラウザなど）のためにWebデザインを変更する 3.他人（既存ユーザー）のためにWebデザイ
自由記述欄の入力率を上げるには 2 (ユーザビリティ実践メモ)
2007年3月5日のユーザビリティ実践メモにて、お問い合わせや資料請求ページにおける自由記述欄の入力率を高めるコツをご紹介しました。 ユーザが入力欄に何を入れていいかわからずに戸惑う可能性があることを考慮し、適切な入力例を添えて入力を促す、という内容です。 詳細はこちら 自由記述欄の入力率を上げるには 入力フォームがあるページを閲覧したユーザにいきなり自由記述欄への回答を促してしまうと、ユーザはたとえ何を記述すればよいかがわかっていても、最初の印象として入力が面倒だと感じて問い合わせや資料請求そのものを諦めてしまう可能性があります。 そこで、まずは入力しやすい個人情報や選択式の項目を配置し、次に自由記述欄を設けることをおすすめします。 このようにすることで、最初にユーザが感じる心理的な負担が少なくなり、ある程度簡単な入力を進めたあとに自由記述欄を見るため、入力作業の敷居が低くなります。
自由記述欄の入力率を上げるには (ユーザビリティ実践メモ)
問い合わせや会員登録フォームなどで、ユーザが自由に入力できるテキストボックス（自由記述欄）を用意しているサイトは少なくありません。 問い合わせの内容 商品見積り依頼の内容 転職サイトの職務内容 テキストボックスはユーザにとって自由度の高いインタフェースですが、ユーザビリティテストを観察すると、選択式の項目に比べ入力率が大きく落ちる傾向にあります。 ユーザが入力をスキップするのは、（必ずしも項目に無関心だからではなく）何を入れていいかわからず迷ってしまうことが大きな要因です。 そこで、テキストボックス周辺に、「入力例を見る」といったリンクを配置し、記入例やサンプルの文面を提示するのが良い対策の一つとなります。 なお、記入例やサンプルの文面は、具体的なケースに分けて記載すると良いでしょう。 例えば、中古車サイトの「カーセンサー.net」では、在庫確認・見積り依頼のフォームで、様々な想
英語表記のタイトルは要注意 (ユーザビリティ実践メモ)
検索エンジンを使って目的のサイトを探すユーザが多い今日、サイトのタイトルの付け方は重要な要素となっています。 そんなサイトのタイトルが英語で表記されているケースが見受けられることがあります。サイト設計者やデザイナは見た目の良さから英語表記を使用しがちですが、ユーザは正しく理解しているでしょうか？ 弊社によるユーザビリティテストでは、ほとんどのユーザが検索結果一覧の中から英語表記のリンクを避けて、違うサイトのリンクをクリックをしていました。検索結果上位に表示されていて、ユーザの視界に入っていても、クリックされなかったのです。 英語表記のサイトタイトルがクリックされなかった理由として以下が考えられます。 ユーザ自身が探しているサイトではないと勘違いしてしまう リンク先ページ内容が瞬間的に理解しづらい リンク先ページは英語サイトであると勘違いしてしまう ユーザは、検索結果ページにてサイト
商品の並べ替え機能はユーザニーズに合わせよう (ユーザビリティ実践メモ)
商品点数が豊富なECサイトは、ラインナップの多さ自体をサイトの強みにすることができます。しかし、ユーザが目的の商品を探しづらい場合には逆に、商品点数の多さがマイナスのイメージを与えてしまうことにもなります。 トップページ→商品一覧(商品カテゴリトップページ） →個別商品ページ この流れの中で、商品一覧の中から目的の個別商品にたどり着くまでの絞込みプロセスがスムーズに進むかどうかが、ストレスの少ないECサイトを実現できるか否かの分かれ道の1つになります。 例えば、ソファーを買いたいと思って訪れたECサイトで、トップページから「ソファー」カテゴリーのトップページ（ソファー一覧）に辿りついたとします。 このとき、単にそのECサイトで扱っているソファを羅列するだけ、または価格で絞り込めるだけでは、おそらくユーザは目的のソファをどのようにして選べばよいのか迷ってしまうでしょう。 そこで、ユーザがそ
NBPC 全国大学サイト・ユーザビリティ調査2006/2007
「大学全入時代」到来。大学経営の厳しい現実が表面化するなか、大学の価値を上げるために、サイトを活用できていますか？ 日経BPコンサルティングでは、全国200（国公私立）大学のウエブサイトを対象に、サイトのユーザビリティ（サイトの使い勝手）に関する調査を実施しました。 文部科学省の試算によると、2007年度に「大学全入」時代がいよいよ到来します。 大学を取り巻く環境が急変する一方、IT・情報化社会の浸透により、大学のWebサイトの役割はますます重要となり、大学サイトが受験生の志望校選択の大きな要素にもなりました。 これに対し、大学としての評価を上げ、志願者を確保するため、Webサイトの大幅なリニューアルを実施する大学が相次いでいます。 しかし、せっかく情報をサイトに掲載しても、サイトが情報を探しやすい構造になっていなければ意味がありません 。 本調査では、全国200大学のWebを対
Alertbox: 改善すれば利益があがる〜見直すべき10のポイント（2007年3月12日）
ユーザビリティの知見をいくつか取り入れることで、売り上げを伸ばし、カスタマーロイヤリティを向上させることができる。Webサイトを更新するときに最優先で検討すべきポイントを紹介しよう。 10 High-Profit Redesign Priorities by Jakob Nielsen on March 12, 2007 ウェブサイトのデザインに共通して見られる間違いについてはよく書いてきたが、もっと稼ぐためにできることにはどんなことがあるだろう？ 特に高い投資対効果（ROI）を見込める10のポイントを紹介する。 1. ニュースレターのメール配信 ニュースレターのメール配信を使えば顧客との関係を維持できる。顧客がウェブサイトにアクセスしているときに限らず、顧客とつながっていられるのだ。多様なユーザ・ニーズに応えられるニュースレターは、ウェブサイトにとって貴重な相棒である。顧客に継続して情報
第18回 検索結果のページ・ナビゲーションで考えた：ITpro
今回は，「検索結果」のインタフェースについて考えてみたいと思います。「検索結果」とはその名のとおり，検索エンジンやそのほか様々なサービスで利用されている検索機能において，ユーザーが指定した検索条件に引っかかる結果を一覧したページのことです。 自分が知りたい情報になかなかアクセスできなくて，いらいらさせられることってありますよね。検索結果のページ・ナビゲーションは，そうしたストレスを軽減させるだけでなく，逆にそれを増加させてしまう力も持っていると思います。 図1：Googleの検索結果ページ 図1はいわずと知れたGoogleの検索結果ページです。検索エンジンは，筆者も含めて多くの人にとって極めて利用頻度の高いサービスになっています。こうした検索機能は普段なにげなく利用されていますが，サイト利用者が自分の必要な情報にアクセスするための重要な経路の一つです。したがって，検索エンジンのような「検索
地方議会サイトのユーザビリティ，もう少し何とかならないのか？
「日経BPガバメントテクノロジー」という雑誌の性格上，地方自治体の議会ページを参照することが時々ある。そこで常々気になっていたのは，議会サイトの使いにくさだ。トップページと各ページのナビゲーションメニューが統一されていないなど，どうにも使いにくいサイトが多いのだ。 そこで，都道府県の議会サイトについて，簡単に調べてみることにした。本来であれば，かつて日経BPコンサルティングが実施した「自治体サイトユーザビリティ調査」のように，きちんと網羅的に項目をチェックすべきなのだが，まずは取り急ぎ，都道府県議会の会議録検索のページについて「フレーム使用の有無」「議会ページから別ウィンドウにジャンプするかどうか」「議会の他のページと，メニューのデザインの統一が取れているか」の3点に限って，チェックしてみることにした。 会議録検索のページを選んだのは，私がこれまでいくつかの議会サイトを訪れた経験から，特に
ユーザビリティ 実践メモ : 初心者ユーザの視線の動き アーカイブ
アイトラッキングシステムを利用したユーザビリティ調査から、パソコンスキルによってページ内の視線の動きが異なることが判明しています。 今回は、パソコン利用歴2年未満で、1日のインターネット利用時間が1〜3時間程度の初心者ユーザへの調査結果をご紹介します。 初心者がページ上部を中心に閲覧していく理由として、以下の初心者ユーザの心理・行動特性が挙げられます。 ページ上部ほど自分にとって必要な情報があると考えている サイト上の情報把握力・選別力が高くないため、どこまで見たかわからなくなってしまうことを避けようと、全体よりも一部を把握しようとする パソコン画面を閲覧することに疲れを覚えやすいため、1ページに費やす時間が短く、ページ下部まで目を通さない（スクロールをしようとしない） このような行動特性から、初心者ユーザの場合、ページ上部に必要な情報がないとサイトからの離脱に繋がる可能性があり
ウノウラボ Unoh Labs: 紙プロトタイプを使ったユーザビリティテストのススメ。
デジタルな世界で生きている同業者の皆さん、ペーパーレスの世界に過信しすぎてはいませんか？ 今日は、紙を使ってプロトタイプを作ることの意義と、方法を紹介します。 紙プロトタイプは、ユーザビリティ・テストのれっきとしたメソッドであることをご存知でしたか？筆者は、前職ではよく紙と、ペンと、はさみとのりを使ったプロトタイプを作成していました。ウノウに入ってからは大体wikiやPhotoshopだけを使ってモックを作るようになり、フォト蔵チームでも大きなUIの変更の際は大体、 (1) WikiやBTSで仕様を簡単にまとめる (2) PhotoshopやPowerPointでモック（四角がいっぱい並んでいる） (3) HTMLでモック(大体の動作を体感) というステップを踏んでいます。 でも、最近になって作業効率とかユーザビリティテストとか考えるようになったら、なんだかものすごく紙が懐かしくな
第10回 文字のサイズとブラウザの違い 〜「はてなダイアリー」で起こった問題点：ITpro
今回は，先日筆者の勤務するはてなのサービスの一つである「はてなダイアリー」で起こった，使いやすさに関する問題を取り上げてみたいと思います。使いやすさの向上のためにデザインを変更したところ問題が発生し，それをプログラミング言語であるところのJavaScriptを使って解決した，というお話です。 その問題とは，「文字の大きさ」に関するものです。 ブラウザには，文字のサイズを変更する機能が用意されています（図1）。例えばInternet Explorer（IE）なら「表示」メニューの「文字サイズ」から「最大」「大」「中」「小」「最小」の五つの段階を選ぶことができます。Firefoxも「表示」メニューの「文字サイズ」から選ぶことができますが，「大きく」「小さく」というメニューになっており，より自由に表示サイズを変更することができます。 図1：ブラウザでは文字サイズを変更できる ちなみにOperaは
思わぬ記号の重複
ユーザに注意を促したり、補足を伝えるために、ウェブページ上で「※」や「＊」などの記号を使うことがあると思います。 これらは便利な表記ですが、使い方によっては誤解を招く原因となるので注意が必要です。 実際のエラー箇所は、背景がピンク色に変化している「郵便番号」の部分なのですが、何人かのユーザは「メールアドレスの再入力」部分にエラーがあると勘違いしました。 これは、エラー警告文にある「※ご記入内容に不備があります」の「※」のマークと、メールアドレス部分にある「※確認のため、もう一度入力してください」の「※」を対応させて認識してしまったからです。 この例では、実際のエラー箇所(郵便番号)が警告文やその入力エリアに明示されていないことも問題です。ただ、仮に「※確認のため、もう一度入力してください」の「※」がフォーム上になかったなら、このような誤解はもっと少なかったはずです。 このような“思わぬ記号
トップページの一般的な役割 (ユーザビリティ実践メモ)
最近、企業のウェブマスターの方から「サイトのトップページというのは一般的にはどういった役割を担うものなのか」という質問をいただきました。 ユーザをニーズに合致した適切なコンテンツや機能へスムーズに振り分ける 何らかの目的を持ってユーザはサイトを訪れると考えられますので、それらのユーザを適切に誘導することがトップページ最大の役割といえます。 会社のブランドイメージ訴求 トップページは多くのユーザが通りますので、ぱっと見の印象およびイメージ訴求も重要といえます。 ユーザへ企業側からのメッセージ(新商品、キャンペーン)を伝達する ユーザは当初の目的達成をした後、良い印象をサイトに抱いている場合は、他の情報を探す可能性があります。 その際の行動の基点がトップページであることも多いため、企業として優先順位の高い情報をトップページで提供していくことが考えられます。 サイト全体像の把握を助ける サイトの
ユーザー視点のウェブデザインガイド 第3回 「資料請求」「問い合わせ」「会員登録」を増やすコツ | Web担当者Forum
第3回 「資料請求」「問い合わせ」「会員登録」を増やすコツ 現実の店舗や窓口では、目の前にいるお客が困っていればすぐにわかるし、同じトラブルが重なれば問題が起きないように施策をとる。しかし、ウェブサイトを作っているときにはお客は目の前にいないし、公開後にお客の対応をするのはウェブサーバーやスクリプトという機械だ。そのため、現実の商売では当然のように行っている接客ができない、いや忘れてしまってはいないだろうか？ 今木 智隆（株式会社ビービット） サイト目的を踏まえた設計の重要性ウェブサイトは、「販売」「プロモーション」「ブランディング」など、さまざまな目的のために作られている。 そういった目的を達成するにあたって、サイトがユーザーに行き着いてもらいたい代表的なアクション（＝ビジネスゴール）には、以下のようなものが挙げられる。 製品の購入メルマガ登録 会員登録 資料請求お問い合わせこのゴール設
PDFファイルは同ウィンドウ表示？別ウィンドウ表示？ (ユーザビリティ実践メモ)
印刷用、カタログダウンロード用などの目的でPDFファイルを用意し、ウェブサイトからリンクを張るとき、同じウィンドウ内でPDFファイルに遷移する「同ウィンドウ表示」にしていますか？それとも新しくウィンドウが立ち上がる「別ウィンドウ表示」にしていますか？ ウェブサイトを利用しているユーザが最も多く使う機能の1つは、ブラウザの左上にある、既に閲覧したページに戻るボタン（以下「戻るボタン」）です。 ユーザは次々にページを閲覧しては、前に見ていたページに戻るために「戻るボタン」をクリックしていきます。 そこで弊社では、基本的に別ページ、別サイトへのリンクは、同ウィンドウ表示で設計をしています。別ウィンドウ表示では「戻るボタン」を使った操作で前のページに戻れず、ユーザが混乱する恐れがあるからです。 ところが、PDFファイルにおいては、閲覧し終えると、「戻るボタン」を利用せずに、右上の「×」マーク（以下
シニア向けウェブサイトの色 - シニア現場の隅っこ。was使いやすさを考えてみる。(アクティブシニア・シルバー層の現場から)
シニア層を対象にウェブサイトのユーザーテストをしていると、色使いによって見えない文字、見える文字が出てくる。 文字が小さすぎるともしくは行間が狭いと、それは壁の落書きのようなものであり、「最初から読む気がない」。 たとえば、その点について「○○とありましたが、そこについてはお気づきでしたか」と笑顔で言うと「あっらー、そんなこと書いてあったの?やっだー、こんな小さい文字、気づかないわよぉ」となる。 気難しい？男性の場合は「君は、こんな小さい文字、見せる気ないね」と逆切れされる。いやいや、私に怒られても。 しかし、文字の小ささをここで言うのではない。 読まれないのは文字の小ささもさることながら、全体的な配色もシニア層の「読みたい心」を誘うためにとても重要な項目である。 特に女性は。 ＜４６＞ 目の老化とともに青が黒にみえる？より引用 個人差はありますが、目の老化は４０歳ぐらいから始まるのが普通
ユーザビリティ実践メモ
スマートフォンとともにタブレット端末の普及率はますます上昇し、最近では街中や電車などでタブレット端末を利用している人を多く見かけるようになりました。 この記事の続きを読む
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://www.bebit.co.jp/memo/archives/2006/12/post_48.html