シニア層でなくとも、入力フォームや申込書に記入というのは面倒くさいものだ。

私自身、色々なウェブサービスに登録しているが、色々入力しなくてはいけないサービスの時には登録が面倒くさくなり、必要度合いに応じて操作をやめることがある。
どうしても利用が必要であれば入力するし、必要度が高くなければ「いつ登録しよう」と思ってブックマークする。
そして、そのまま忘れてしまったりもする。そういうブックマークが溜まり、年に1回処分する。

紙の申込書も同様だ。
見た瞬間、面倒くさそうかつ、重要度が低そうな申込用紙は、明日書こう、明日書こうとそのまま〆切を迎える。（そして出さない←反省）
相手にとっても必要だったら、きっと提出を促される。それまで出すのをやめてしまおう。
もちろん、必要なものは提出する。もし、まちがっていたらきっと不備で返ってくる。
記入があまり考えなくていいものについては、早く処理したいので、素早く書いて直ぐに返送する。

そういう大雑把なのは私だけかと思いきや、先日、記入式申込書のユーザーテストを行ったところ同じようなご意見がシニアから発せられた。（私もシニアの仲間入りかもしれないが）

「紙の申込書を書くときは基本対面じゃなくちゃやらない。間違ったら面倒だから」
「ダメだったら向こうから言ってくるから別にいいよ」
「ウェブで申し込み中に解らなくなったら電話が一番だよね！」
「面倒くさくなったら申し込まない」

そういうものなのだ。
もちろん、丁寧な人も多い。〆切をきちんと守る人もたくさんいる。

しかし、年齢を重ねるにしたがって、入力フォームや申込用紙の文字を見るのも面倒になり
どんどん先延ばしにしていく、または、頑張って入力しても間違えが増える傾向があるように見える。

今回は、先日のユーザーテストから得られた
入力フォーム・記入フォームかくあるべし、という原則についてメモをしておく。

購買者の情熱を失わせない・先延ばしにさせないことを意識

これは弊社有するパソコン教室内での会話だが、
スタッフとお客様がとある商品について盛り上がっており、それはどこで買えるのか？という話になった。

「ネットで買えます」と案内したところ「amazonでも買える？」と。
「多分、、私は違うところで買いましたが」とスタッフ。
すると、ご年配のお客様は「新しいところで買うと、色々入力しなくちゃいけないし、面倒くさいのよね」と一言。

入力すること、記入することは、面倒くさい。
老眼鏡を取り出さなくてはいけないし、字は小さいし。
しかし、それ以上にその商品を欲しいのである。それは、情熱である。

つまり、入力フォームや申込用紙が目の前に存在している状態とは、そこまで情熱が保たれているということなのである。

だが、万が一、それが「面倒くさそうな」入力フォームだったり、申込用紙だったりした場合、そして、その情熱が「面倒くささ」によって溶けてしまった場合、「ま、今はちょっとバタバタしてるし、明日でもいいか」になり、「明後日でもいいか」「そしていつか」になってしまうのである。

だからこそ、申込用紙・入力フォームの見た目はとても重要だ。
面倒くさいと思ったらすぐに後回しにされる。

入力が「面倒くさそう」と思われたら、そのページでの「買いたい」情熱は目減りする。
もし、かご落ちが多いならば、見た目の面倒くささが無いか見直した方がいい。

申込用紙も、入力フォームもシンプルに、考えなくても＝自分の知っている知識の範囲内で無理なくすぐに記入できそうかどうか、そこがまず第一の関門である。

自分の知識で入力・記入ができる

申込用紙のユーザーテストをやっていて、驚いたのはこの部分である。
周りにある説明は一切読まない。
「文字の大きさが問題か」ということもあったが、そうではない。

人は、読まない。

「こういうのね、大体大丈夫」と、書き進める。
内容があっている（つまり制作者の意図に沿っている）かどうかは別問題である。

迷ったら、その周辺を見る。
たとえ、申込用紙のトップの部分にたくさん注意事項が書いてあっても、「それは自分の問題ではない」と認識する。だから、読まない。

そして、「こういうのはね、読まなくていいって思う。保険の約款みたいに、読んでも仕方ないことが書いてあるイメージ。」
それが記入上の注意であってもだ。文字が並んであるだけで「約款」扱いになる。
何度繰り返し注意書きがあっても、見なくていいと判断されたものは、目に入らない。
（本当は約款は読むべきものですが。）

以下はその時の私が自分の手帳に書いたメモ。

「大切なことは何度も言いたくなるが、何度も言われていると聞き流したり、読み流したりして伝わらないということ。いずれにせよ、相手にとって大切じゃなければ、自分にとって大切なことはまったく伝わらない。」

なので、注意書きが無くとも、なるべくユーザーが持っている今までの知見（つまり、できるだけ一般的に使われている項目で）で目的が達成できることが重要なのである。特に紙の申込用紙。

ウェブであれば、共通の知見があまりない。
そういう時はとにかく記入例は該当フォームの近くに置く。
困った時はその近くしか見ない。ましてや、ページトップには戻らない。

ページトップを読んでから入力しないの？と思われるかもしれないが、
まあ、読まれない。目を通しているかもしれないが、読んでいないし、覚えていない。

不備はどこが不備なのかをしっかり連絡！そしてフォローも

「困ったら　助けてもらおう　ホトトギス」

たいてい、困った時には誰かが助けてくれる。
それは、夫だったり、子どもだったり、サポートセンターだったり、私だったり。

しかし、自力でやりたくなるほど「今欲しい！」があり、かつ、入力・記入に不備があった場合。

・ウェブであれば、まずはエラーがどこなのか解りやすくすることが必要だ。
トップにまとめて書くなど論外、次のページで表示されてその場で直せないのもダメ。
間違っているところがありますと表示もされず、元の画面に戻らせて
「なんかおかしい、前に進まない」とユーザーから台詞が出てくるのもダメ。
と、色々改善できるポイントがある。

・申込記入用紙の場合は、不備がその場では見つからない。
そのため、最大のフォローが「解らないときに電話してもらうこと」になる。
電話番号、営業時間は大きく書くことが必要。

「前に進まないせいで情熱を削がれた」ということだけは避けたい。

制作者は覚悟する。人は間違える、間違えることを責めてはいけない。

教えていて思うのが、「人は間違える」。
いや、間違えるという言葉すら間違っているのかもしれない。

人は、制作者の思惑通りには動かない。というのが正しい。
制作者にとっては間違いだが、ユーザーは「私は正しい」と思っていることが多い。
だから、そこに溝が生じる。

制作者はユーザーがもっと考えてくれることを期待するし、
ユーザーは、使った後に得られるものが欲しいだけであり、手続きや申込に情熱を感じない。
（反対に、「商品が手に入れられるかなんか興味ないっ！このカートを使いこなしたいっ！」という人がいたら微妙。）

だから、間違えてもしょうがないのだ。
そして、読まない限り、自分のルールでやろうとする人が多い限り、間違えられても仕方ないのだ。
制作者は、そこを覚悟しなくちゃいけない。

「なんでユーザーは間違えるんだ！」「何でよく読まないんだ！」なんてゆめゆめ思ってはいけない。

とにかく、間違いやすいポイントを探しだし、間違いを軽減させ、ストレスを溜めこまさない入力フォームや申込用紙への改善が必要なのだ。

一般的にシニアの方ほど入力に時間がかかり、また不適切な入力によるエラー発生頻度も高くなることは、ユーザビリティ業界の権威であるニールセンノーマングループのレポートも統計データを用いて指摘しています。

シニアをターゲットとしたウェブサイトの多くはこうした状況を考慮して、入力フォームのシニア対応に力を入れているところが多いのですが、その中でも私個人から見て特に完成度が高いと感じているのが、健康食品の『皇潤』で有名なエバーライフです。

今回、そのエバーライフの入力フォームで実装されている様々なシニア対応施策について、実装方法まで含めて詳しくご紹介していこうと思います。

1. 各フォームがそこそこ大きく見やすい
2. 必須項目表示がわかりやすい
3. ふりがなが自動的に入力される
4. 住所が自動的に入力される
5. 電話番号欄には数字以外入力できない
6. 生年月日の初期値が50歳に指定されている
7. メールアドレスの補完機能がある
8. エラー入力へのフィードバック内容が具体的
9. 「次へ」ボタンを押すと、間違った項目だけを表示してくれる

補足ポイント
・姓名、郵便番号のフォームを統合する
・全角/半角の自動修正を行う
・誤って「戻る」を押した際の確認メッセージを出す

1.各フォームがそこそこ大きく見やすい

こちらは一般的に見かける入力フォームより、フォームの枠、フォント共に大きめにとられています。

どれほど大きくしているかと言うと、具体的には、フォントサイズが140%（17px）、フォームの縦幅が28pxに指定されていました。入力フォームでは、入力した文字の目視確認作業を行う必要があるため、通常よりも大きなフォントを用いるとよいでしょう。

2.必須項目表示がわかりやすい

必須項目の表記は、しっかりと目立つ白抜きテキストで「必須」と書かれおり、わかりやすくなっています。

よくある※印等では必須入力項目ということがほとんど伝わらないため、それぞれの項目ごとにテキストで「必須」と表示することは入力フォームの基本ですね。

3.ふりがなが自動的に入力される

名前欄に漢字で入力を行おうとすると、すぐ下のふりがな欄にも同時に文字が入力されていきます。

この後に続く住所自動入力機能とともに、キーボード入力の苦手なシニアにとっては、こうした配慮はとても嬉しいものです。

こちらのサイトでは、以下のJavaScriptで実装しているようです。

[JavaScript] フリガナを自動挿入する（Development Reference）

またふりがなの自動入力に関するJavaScriptは、jQueryも含めて様々公開されています。

JavaScript - jquery.autoKana.jsで自動カナ入力する（Qiita）

4.住所が自動的に入力される

郵便番号に数値を入力していくと、3ケタを入力した時点でこちらの画像のように右側に候補地のリストが表示されます。

ここでマウスを使って選択することも可能ですし、さらに続けて7ケタ全てを打ち込めば、下の住所フォームに該当の住所が自動的に入力されます。

住所自動入力の　こちらのサイトでは、ajaxzip3を用いて実装しているようです。

ajaxzip3（Google Project Hosting）

また住所の自動入力に関するJavaScriptについても、様々公開されています。

郵便番号から住所を自動入力する操作性が世界一簡単なZipAddr（ピエールソフト）
郵便番号を入力すると住所を自動補完してくれるjQueryプラグイン・jquery.jpostal.js（かちびと.net）

5.電話番号欄には数字以外入力できない

電話番号欄には、エラー防止のためにアルファベットやハイフンが入力できないようになっています。

本来ハイフンの必要有無については入力例を見れば判別できるはずですが、特にシニアはキーを打つ際に手元に集中してしまい、完全に入力し終わるまで指示に気付かないことが多々あります。そんなとき、この機能が威力を発揮しそうです。

実装はやはりJavaScriptで以下の要領で行っているようです。

フォームの入力値を数値のみに制限するjavascript（GitHub）

6.生年月日の初期値が50歳に指定されている

プルダウンの選択肢を開いた際の小さなスクロールは、シニアにとって操作が難しいものの一つです。生年月日なので選択肢が多いのは仕方がありませんが、他のサイトの極端な例では、初期値が「明治元年」になっているものもありました…。

こちらのサイトでは、商品のターゲットに近い50歳の生年月日を初期値として指定しているおかげで、スクロールを行わなくても自分の生年月日を選択しやすくなっています。

これは選択肢のoptionタグ内に「selected="selected"」と指定することですぐ実装が可能です。ターゲット層に合わせてプルダウンの初期値を調整してあげる施策は費用対効果が高いため、過去にも様々なサイトで言及されていますね。

プルダウンメニューの初期値（ユーザビリティ実践メモ）

7.メールアドレスの補完機能がある

メールアドレスを入力する際、@以降に「y」と打つだけで、yahoo.co.jpが候補として出現します。他にgmail.com、hotomail.com、docomo.ne.jpなども補完候補となっており、タイプミスの多いシニアにとっては効果がありそうです。

ここでは入力補完ライブラリsuggest.jsをカスタマイズして実装しているようです。
Javascriptによるオートコンプリート(入力補完)suggest.js（WEBデザイン Tips）

メールアドレスの補完機能については、他にもいくつか方法が紹介されていますので参考まで。

メールアドレス入力フォームにドメインのサジェスト機能をつける（2）（Hack）
メールアドレスのドメイン部分を入力補完 - Email Autocomplete（jQueryプラグインまとめ）

8.エラー入力へのフィードバック内容が具体的

入力内容に不備があった際、フォーカスが外れたタイミングでエラーに対する指摘が表示されます。

このサイトで特徴的なのが、その条件分岐の多さ。例えばメールアドレスの場合は、@マークの有無はもちろん、ピリオドとカンマの違いまでチェックする構造になっていました。

ただ「正しくありません」「無効です」と知らせるだけでは、ほとんどのシニアは修正することはできないと思ってよいでしょう。何が違うのか、どうすれば修正できるのか、できるだけ詳しく伝えようとする姿勢がよく見えます。

エラーのチェックは、基本的にJavaScriptをonblurのタイミングで動かして行っており、特別なEFOのパッケージは使っていないように見えます。

9.「次へ」ボタンを押すと、間違った項目だけを表示してくれる

シニアの場合、フォームのどこでエラーが発生しているのか、見つけるのは一苦労です。

こちらのサイトでは、入力を完了して「次へ」ボタンを押すと、エラーのあった項目のみ残して表示し、修正をうながしてくれます。これなら迷わずにすみますね。

ちなみに上記画像の例では、「グアム」とカタカナで入力してあったものを、すでにひらがなに修正してくれています。

さらに改善するための3つのポイント

ここまでご紹介してきたように、エバーライフの入力フォームは「執拗」とも言えるほど、細かいシニア対応施策を丁寧に揃えてきているのがわかります。正直、ここまで多くをしっかりと盛り込んでいるサイトは、私が知る限りでは他にありません。

いま現在の状態でもかなりレベルは高いのですが、さらにこのフォームをよくするために、残されている改善の余地を考えてみたいと思います。

姓名、郵便番号のフォームを統合する

特にシニアの方々は文字入力の際に下を向いてしまうため、例えばフォームが苗字と名前で分かれていると、前者の方にフルネームを入れてしまい後からそのことに気づくのです。これは郵便番号や電話番号でも同じ傾向が見られます。

この対策として、HOME'S介護のサイトでは、フォームを統合して1つにしています。

データベースの構成上難しいところも多いかもしれませんが、HOME'S介護では間にスペースを空けるよう指示することで、苗字と名前の区別ができるよう工夫もしていますね。

全角/半角の自動修正を行う

エバーライフの入力フォームで一番残念なことは、半角指定の項目に全角入力した際に、それが自動的に修正されることなくエラーと判定されてしまうことです。

多くのシニアにとって、英数文字の全角と半角は区別がつきづらいもの。最近は、この全半角の処理を自動的に行ってくれるところが増えてきました。またジャパネットたかたのフォームでは、全角モードのままでも強制的に半角で出力させるワザを使って対応しています。

誤って「戻る」を押した際の確認メッセージを出す

シニアのフォーム入力操作を観察していると、誤ってページから離脱してしまい、再びフォームのページに戻ったら最初から全部やりなおし…という悲しいシーンによく遭遇します。フォームからフォーカスが外れた状態なのに気付かず、文字を修正しようとしてbackspaceキーを押してしまうのです。

こうした悲劇を防ぐためには、上記のHOME'S介護のように確認メッセージを出す方法がよいでしょう。実装方法も簡単なので、費用対効果が高い対策ですね。

[jQuery] ページを離れる際に確認メッセージを出す方法（18th Tech Note）

入力フォームのシニア対応は、ユーザー全員に効果あり！

ここまで、エバーライフの入力フォームで実装されている様々なシニア対応施策（+α）を見てきました。

1. 各フォームがそこそこ大きく見やすい
2. 必須項目表示がわかりやすい
3. ふりがなが自動的に入力される
4. 住所が自動的に入力される
5. 電話番号欄には数字以外入力できない
6. 生年月日の初期値が50歳に指定されている
7. メールアドレスの補完機能がある
8. エラー入力へのフィードバック内容が具体的
9. 「次へ」ボタンを押すと、間違った項目だけを表示してくれる

追加ポイント
・姓名、郵便番号のフォームを統合する
・全角/半角の自動修正を行う
・誤って「戻る」を押した際の確認メッセージを出す

入力フォームの改善は結果がダイレクトに出やすいため、サイトのシニア対応の取っ掛かりとしておすすめです。

また既にお気づきの方もいらっしゃると思いますが、今回ご紹介したポイントは、シニアに限らず、どの年代のユーザーにも一定の効果が期待できます。

今回、ポイントのいくつかは実装方法まで含めて紹介していますので、「シニア対応、どこからやればよいのやら…」という方は、まずは費用対効果の高そうなものから優先的に取り組んでみてはいかがでしょうか。

こうしたユーザーは、代わりに次のような"地味"な機能を好んで使っているのです。

・サイトマップ
・サイト内検索
・よくある質問

これは、ITリテラシが少し高めの"そこそこ使える"シニアユーザーで特に顕著に見られる行動です。普段からウェブサイトを利用しているうちに、「何かわからないことがあるときには、ここを見ればいいんだ」と学習してきたようです。

しかしウェブ制作側としては、こうした地味な機能には、あまり制作リソースをかけていないのではないでしょうか？

今回はこれら3つの機能を『地味ナビ三兄弟』と命名し、ウェブが"そこそこ使える"シニア向けに最低限対応しておきたい施策についてまとめてみます。

「サイトマップ」への導線はヘッダー内に設置する

シニアユーザーに「サイトマップ」が好まれる理由として、以下の点が考えられます。

・余計な装飾がないので見やすい
・すべてのコンテンツが一覧できる

グローバルメニューは、ラベルに相当気を遣わないと、その下層にどんなコンテンツが含まれているのかパッとわかりにくいという欠点があります。多くのシニアユーザーは、ラベルから内容を類推する精度が高くありませんし、コンテンツを探して何度もページを行き来することを非常に嫌います。

そのため、下層コンテンツまで一覧で確認できるサイトマップは「わかりやすい」とされ、そこで探している情報をうまく見つけた経験を積むほど利用率が高くなるのです。

こうして頼りにされるサイトマップですが、サイトによってはリンクをヘッダーに置いていなかったり、最近ではフッターがサイトマップ代わりになっているサイトも増えてきています。

しかし「シニアはスクロールしない」の格言通り、なにか情報を探す際にページ下部まできっちりチェックするというシニアは少ないので、サイトマップへの導線はできる限りヘッダー内のすぐ見つかる位置に確保することをおすすめします。

「サイト内検索結果」を読みやすくする

いろいろなページを行ったり来たりしながら情報を探す行動は、物理的な操作の負荷に加え、認知的な負荷もかかります。こうした作業にうんざりしているシニアは、ナビゲーション代わりとして「サイト内検索」を積極的に利用する傾向があります。

しかし検索結果の見せ方に配慮が足りないと、自分の探しているページを見つけるのに非常に苦労してしまいます。

サイト内検索結果を見やすくするためには、以下の点に気をつけたいところです。

・内容が想像しやすいページタイトルをつける
・タイトル、説明文ともに読みやすい文字の大きさと行間を確保する
・キーワードをハイライトする

キヤノンのサイトは全体としてタブレット対応が進んでいるせいもあり、サイト内検索結果はかなりの余裕を持ってレイアウトされています。これだけ文字が大きく、行間や余白も確保されていると、シニアでもストレスなく"ナビゲーション代わりに"利用することができます。

「サイト内検索フォーム」にはサジェスト機能をつける

サイト内に該当する情報があるのにも関わらず、検索キーワードの打ち間違いに気づかない、余分なワードを続けて入れてしまう等の問題により、検索結果がゼロ件になってしまうシーンをよく見かけます。

しかも、ユーザー自身はなぜそうなったのかを理解できないため、情報はそこには載っていないのだと感じて離脱してしまいます。

こうした表記揺れやキーワードの想起を助けるために、サイト内検索においても「サジェスト機能」「もしかして機能」は非常に有効です。

ちなみにシニアのユーザーテストを実施していると、途中でサジェスト機能に気が付いて、喜んでキーワードをクリックする様子を本当によく目にします。サジェスト機能の利用は、シニアの間でも一般的な行動になってきているように感じます。

ナビゲーションとしての「よくある質問」

サイトマップの代わりに、「よくある質問」を頼りにするシニアも多くいます。

「よくある質問」は、通常はサービスの内容についての質問が掲載されるページですが、サイトの利用方法に関する疑問があるときにも、こちらが参照されてしまうことがあります。

こうしたサイト内コンテンツへのナビゲーションとしての役割を考えると、以下のような点に配慮したいところです。

・サイト内主要コンテンツへ誘導する回答を増やす
・サイトマップと同じように一覧性の高いレイアウトにする
・回答数が多い場合、検索機能を用意しておく

また当然ですが、「よくある質問」を「FAQ」と書くのは避けましょう。シニアユーザーの多いサイトでは、アルファベット用語を使わないのは鉄則です。

『地味ナビ』の改修は、費用対効果を見込みやすい

今回注目した『地味ナビ三兄弟』の面々ですが、普段のアクセス解析においても、各種の数値を追うようにしてみてはいかがでしょうか。

もしこうしたページへのアクセスが増加傾向にあったら、新規のユーザーにはサイト構成やグローバルメニューがわかりづらいのかもしれません。またそこでの滞在時間が長ければ、情報を探すのに苦労しているのかもしれません。

『地味ナビ』の改修は、サイト全体の構成やグローバルメニュー等の改修に比べて手が付けやすく、費用対効果を見込みやすい部分です。

"そこそこ使える"シニアユーザーを逃したくなければ、ぜひ今回ご紹介したポイントを確認してみてください。

先日、うまくお花を送れないと相談され
お届け先などを入力している操作シーンを見ていた。

以下は入力画面で間違えたところである。（クリックで拡大できます）

シニア層が、なぜ操作を間違えるのか、時折わからなくなる。
今回もこのブログを書くために、そのサイトにもう一度アクセスしたが
どこで間違えるのか、なぜ間違えたのか
記録メモを見なければ解らないほどであった。

彼女は日々ネットを楽しみ、お買い物も慣れている。
だから、ネットに不慣れである、とはいえない。

では、なぜ間違えるのか？私を呼ぶのか？
その間違いは、「シニア行動」によって起きるのではないだろうか、と考えた。

シニア行動とは何か

その理由が知りたくて、参考になればとこの本を読んだ。

（この本についてはまたいつか機会があれば改めて書きたいと思う。）

シニア行動とユーザビリティの関係を引用する。

-第2章　なぜ能力が衰えても自信があるのか　P56--（）内は補足
一定の時間で区切った場合には、（老人は）処理できる情報量が少なくなります。若いころは限られたリソースを効率的に使って、同時に複数の情報を処理ていたのが、老人になるとそれが困難になるのです。
そのため、さまざまな情報を同時に処理しなければならない運転においては、自分が運転するというそのことだけにリソースを使ってしまい、周囲の車や歩行者に注意を払うだけの余裕が残っていないのです。

64歳シニア女性は、見た目も言動も若々しい。そして、ネットに慣れている。
しかし、シニア行動によって間違いを起こしてしまったということが解る。

情報処理能力が少なくなるというシニア行動

これは上記間違え一覧から「シニア行動」によるものをピックアップしたものである。

(クリックで拡大)

贈り主という文字を読んでいるにもかかわらず
「贈り先」と思い込んで、贈り先の住所の名前・住所を入力している。
→過去の経験を利用

「ご注文者様と同じ」というところを何気なく・意図なく押して
入力した文字が変わった時に、現状を把握するための
処理しなくてはいけない情報量が一気に流入するため、パニックになってしまう。
→情報処理能力の低下

若い人だと、「ああ、そういうことか」とすぐに想像し、理解できるが
一瞬にして情報が流入したため、状況を判断できない。
そのため「できない」という失敗体験につながってしまい、
以後近寄ることを避けられてしまう。

イレギュラーは「情報過多」になる

「いつものやり方と違うこと」は、年を取ればとるほど苦手になる。
いつも通りであれば、情報の量も少なく処理はストレスではない。

しかし、「いつもと違うこと」というのは
若いころには「新鮮」「驚き」「ワクワク」だったことが
「少し面倒なこと」に代わる。

「前と同じがいい」
「以前の方が使いやすかった」という声が
リニューアル後に出やすいのも
新しいことという「情報」が過多で
ユーザーにストレスを与えているのだ。

こちらも「過多な情報」で状況判断ができなくなり、ストップしている状態である。

（クリックで拡大）

今まで、いろいろなものに入力してきたのが
自分の経験してきたものと異なり、尚且つ対応の仕方が経験則になく
情報過多のような状況になり、判断不能に陥った。

彼女としては、クリックして消えるのは理解できる。
だが、ほかのところをクリックするとその文字がまた入力されてしまう。
その入力された状態で送られたらどうしよう、と思ったわけだ。

操作に慣れてても加齢の影響が華麗に…

先日、若い人とご高齢者はどう違うんだろう、
どのように違ってくるんだろうと、考えていた。

小さいころ、石ころが宝石に見えていたのに
大人になると、石ころは石ころにしか見えなくなる。

新しいことに出会えてワクワクしやすい子どもと
新しいことに出会うと、ちょっと腰が引けてしまう大人。
「若い人にはついていけない」というセリフが出てくる。

「前の方がよかった」という「使えていた時」への固執。
「あの頃使えてたんだよ」という自己肯定感。
（これも老化現象の一種らしい）

経験則にないもの、考えなくてはいけないことは、
判断不能になりやすい。

もし、シニア層にウェブサイトを使ってほしいと思うなら
「シニア行動対策」は避けては通れないことを認識しなくちゃいけない。

（加齢に華麗は、言いたかっただけである。）

マミオンでシニア層のユーザーテストを行っている際によく目撃するのが、「探している情報がなかなか見つからず困っている」という場面です。

人によりその時の対応は様々ですが、今回は、シニア層がサイトで探している情報が見つからなかったときにどういった行動をとることが多いのか、そしてその対策としてどういう手を打っておけばよいのかについてご紹介したいと思います。

シニアユーザーの3割が、Yahooに戻って探している

マミオンでは2013年10月中旬に、60歳以上のネットユーザー（N=100）を対象とした「インターネットの利用に関する簡易調査」を行い、以下の質問をしてみました。

【調査概要】
　・調査方法：ネットアンケート
　・調査期間：2013年10月23日（1日間）
　・調査対象：60歳以上の男女
　・有効回答：100人（男性74人、女性26人）

Q. 探しているもの（商品、情報、手続き方法など）がすぐに見つからないとき、探すのをあきらめてしまう前にあなたが試してみる行動をすべて教えてください

こちらが結果のグラフです。回答の選択肢は、普段のユーザーテストでよく見られる行動を基に作成しています。

以下、ここで挙げられた行動を3つのパターンに分けて見ていきたいと思います。

パターンⅠ．サイト"外"で再検索する

回答の1位は、意外にも「Yahoo等に戻って検索しなおす」で、およそ3割の人が行っているようでした。

特にネット初心者の方に多いのが、ブラウザの戻るボタンを連打または一度ブラウザを閉じて立ち上げ直したあと、Yahooなどの検索サイトでキーワードを変更したり追加したりして再検索する行動です。

サイト内の問題なのにも関わらず、一度外に出て、自分が慣れ親しんだYahooに頼るというこの行動。実はシニアのネット利用行動の特徴の一つに、【「サイト」という単位を意識していない】ことが挙げられます。そのため、サイト内に限定して検索するという意味がよくわかっていない人が多いのです。

この対策としては、Yahooで「〇〇〇（サイト名）　△△△（探しているもの）」とキーワードを追加して検索した際に、それに適したページがちゃんと検索結果の1位に出るかどうか確認しておくことです。このときに、前と変わらずサイトのトップページが1位に出てきてしまうと、ユーザーの期待を大きく裏切り、さらに迷わせることになります。

パターンⅡ．サイト内で自分で何とかしてしまう

アンケート結果の2位から4位までは、「サイト内で自分で何とかする」行動が占めています。

このうちシニア層の行動として特徴的だと感じるのは、「よくある質問」や「サイトマップ」の支持が高いことです。「わからないことがあった時には、ここを見ればいいんだ」という認識をいくぶんか持っているようです。この両ページが支持される理由としては、どちらも非常にシンプルなデザインであることが多く、書いてある項目を上から順番に見ていけばよいという点が考えられます。

一方で「ヘルプ」の支持はあまり高くなく、「よくある質問」や「サイトマップ」の方が頼りにされていることがわかります。通常の「よくある質問」ページはサービス内容についての記述がメインですが、こうしてヘルプ代わりに利用されることもあるので注意しましょう。そして「サイトマップ」からの遷移先は見つけにくいページである可能性が高いので、こちらも定期的にチェックしておくことをおすすめします。

またこうした「ファンクションナビゲーション」の類ですが、できればファーストビュー右上の「定位置」に置くのがベストです。

パターンⅢ．身の周りの人に聞く

5位以下は間が少し空き、「他人に聞く」行動がやっと出てきます。

近くに詳しい人がいれば直接対面で聞けるのですが、そうした環境がない人は、メールや電話での問い合わせをすることになります。

最近では、サイトのヘッダーに電話番号を大きく記載しているところも増えてきましたが、アンケート結果を見ると、実はその倍の人数がメールでの問い合わせを望んでいるのです。せっかく電話番号を掲載しているのに、メールやフォームでの問い合わせ口がわかりにくいサイトは結構多いように思います。こちらも気を抜かずに対応しておきたいですね。

女性は人に聞く、男性は自分で何とかする

余談ですが、先ほどのアンケート結果を、男女別に集計してみた結果が以下のグラフです。今回は男性と女性の回答者数が違うため、各性別ごとに割合を再計算しています。

特徴的なのは、「検索する」行動は男性によく見られ、「直接人に聞く」行動は女性によく見られるという傾向です。一般的に、女性は男性よりもコミュニケーションを重要視していると言われますが、それがサイトの利用方法にも表れているように思います。

サイト制作者は、どうがんばっても初心者目線になれないから…

今回の調査結果は、回答の1位が「Yahooに戻って検索する」というサイト制作者にとってはショッキングなものでしたが、一方で自分で何とか解決しようと奮闘するシニアユーザーの姿も垣間見ることができました。

サイトを知り尽くした制作者自身には、なかなかこうした初心者目線から課題を見つけることが難しいので、制作の際には「ユーザーテスト」をうまく活用することをオススメします。

マミオンではネット初心者によるテストを得意としていますので、ぜひご相談ください。

たまたま近くにいた60歳代前半女性のIさん。
ネットでしょっちゅう購入している方だ。
Yahoo!ショッピングも2，3回使ったことがあるとのこと。
普段はamazonを利用している。

Iさんにお時間をいただき、今話題のYahoo!ショッピングを使って
アイトラッキングで視線を録画することをご了解いただいた上で
ほしいものを探していただいた。

「アンティークのランプがほしいと思っていたの」とのことである。

※実施したのは10月7日の為、Yahoo!ショッピングの画面が
多少変わってしまったことを先にご了承願いたい。

画像しか見てない

カテゴリから家具、インテリアを選択し、
その後、検索ボックスに「アンティーク」と入力したIさん。
検索候補に「アンティーク　照明」と表示されたので、そこをクリック。
シニア層は検索のサジェスト機能は大好きだ。

検索画面が現れると、画面を思い切りスクロールした。
文字も値段も全く見ていない。
見ているのは画像だけ。
もう、画像しか見えない。　という状態である。

当時は検索結果とページ送りの間に広告があったため
（現在は広告の上にページ送りがある）
多少の戸惑いは見せたものの、
以前、何度かYahoo!ショッピングを利用したことがあるということで
ページ送りをすぐに見つけることができた。

それを何度か繰り返す。
「まずはどんなものがあるのか全体的に知りたい」
「写真が小さい」
「安っぽいのはやだ」
「掘り出し物があるのよねー。こういうの見てると」
と仰りながら商品を探していたため、じっくり見るというより
完全なウィンドウショッピングである。

そして、6ページ目にしてようやく一つの商品が目に留まった。

その時の目線の動きは以下の画像の通り。
青い部分が目線の動きである。
（数字はサイトを見た順番になっている）

※クリックして拡大
（商品サイトを見てから戻ってきたので、番号が一部飛んでいるところがあり）

サムネイル写真、超重要

ほしい商品の型番が決まっているわけではない場合、
検索一覧の中から目をとめてもらうためには
とにかく、写真が重要だ。

情報を補完するためにサムネイルに文字を入れることは
ユーザーがクリックする判断材料になり、とても有効だが、
Yahoo!ショッピングや楽天のようにサムネイルのサイズが小さい場合には
写真に文字を入れると、サムネイル時点では小さすぎて読めずに
ただのノイズになってしまうことがあるから気を付けたい。

そう思うと、amazonがシニアに「買いやすい」評価される所以の一つに
デフォルトサムネイル画像の大きさもあるのかなあと思う。

文章を読まない。読もうとすらしない。

商品詳細ページの閲覧を確認してみよう。
「いいのがあったらほしいと思って、ざっと見てるの」
と、商品詳細を「眺める」姿を見ると
文章をほとんど読んでいないことが解る

※クリックして拡大
（こちらも戻ってきているので番号が一部飛んでいます）

目線の動きを矢印にした。まずは赤矢印。
１）まず、画像をチェック。
２）次に値段をチェック。
３）タイトルをチェックし、「買い物かご」に目を移してレビューをクリック
４）レビューをしっかり読む。
戻ってからの目線は青矢印の動き。
５）レビューにサイズについて言及してあったために元のページに戻って
サイズをチェック。

６）思ったものと違ったようで、元に戻ろうとするが
途中のバナーが光っていたので目に留まるものの、
現在はアンティーク調の照明を探しているために
興味を持たずに戻るボタンへ。

「前、アンティーク調の時計を買った時もかなりたくさんチェックして、
いいの見つけるまですごい探したのよね。」

と、ほかの商品を探し始めた。
ちなみに、気に入ったものがあるとブラウザのお気に入りに入れておくらしい。

人はあんまり見ていない

サイト制作者としては、文章を
すべて読んでもらえるのではないかと思っていないだろうか。

しかし、実際は、「気に入ったものを探す段階」では
ユーザーはなーんにも読んでない。
色々細かく書いてあっても、まず気づかない。

私ごとだが、先日、洋服を裏表で着てしまった。
出勤時に、なんか変だなと、首の後ろを触ったら
タグが外に出ていた。驚いた。

恥ずかしくて、誰にも見られないようにと首を縮めるように出勤したが
出勤後に、あまりにもおかしくて「今日裏表来てるの！」とスタッフに言ったら
言われなくちゃ気づかなかったと言われた。

そう、人は、思っているより、色々なことを見ていない。
誰も私など見てない。
（目についたらとても気になると思うが、目につかない。）

このように、「見られてる」「読まれてる」期待は持たない方がいい。

だから、見られたければ、見られるようにしなくてはいけない。

ユーザーがどこに目をとめて、
どこに目を留めていないのか。
ユーザーは、サイトをどのように見ているのか。

それを知ることも、サイト改善につながっていくのだと思う。

［PR］ユーザー視線動画絶賛販売中。ユーザーはあなたのサイトをどう見てるか／見ていないかチェックできます。

先日、とあるサイトを見ていた
60歳代後半のＫさんが言った。

「なんでみんなamazonにしないの？
みんながamazonだったら買いやすいのに。」

Ｋさんは、amazonのヘビーユーザー。
しょっちゅう購入しているようだ。

しかし、その時見ていたのは別のECサイト。
ファーストビューからKさんはスクロールせずに
「自分のほしい情報はどこにあるのか」と戸惑い、固まっていた。

Ｋさんのように、インターネットを毎日使っているが
新しいサイトを見て、一瞬で理解できないと使えなくなってしまう人を
私たちは永遠の初級者（別ウィンドウで開きます）と呼んでいる。

シニアはスクロールしない、の真実

先日アップした記事（実例で納得！シニアが使えないサイトの例(別ウィンドウで開きます)）はおかげさまで多くの方にご覧いただきました。ありがとうございました。

（本当にありがとうございます。ほんと、嬉しいです。
コメントもいくつかいただきました。ありがとうございます。大感謝です。）

ところが、「シニア、スクロールしないんだってよ。」
というコメントをたくさんいただき、私の文章力のなさで
「スキル不足のせいでスクロールができない」という
誤解を招いてしまったような気がして、
再度、「実例」をとりあげようと思う。

シニアはスクロールができないのではない。しないだけだ。

シニア／永遠の初級者は、
慣れていないページを見るとファーストビュー内で情報を探そうとする。
だから、ファーストビューから次の動き（つまり、スクロール）をするには
若者に比べて時間がかかる。

そして、ファーストビューに情報が見つからなかったとき、
下に情報があるような気がすれば、スクロールを行い、
ほしい情報がないと思った場合には
スクロールを行わない。
合理的である。

先日の、大学の公開講座の例では、
クリック・検索後もファーストビューが同じだったために
前と同じページを見てしまった／また同じ情報しかないと考え、
スクロールせずに、再度検索をしてしまったのだ。

ファーストビューで探す、ということ。

下記のアイトラッキング(アイカメラ)動画を見ていただきたい。
（48秒ほどの動画である。）

この動画はアイトラッキング（アイカメラ）という機械を使って録画している。
特殊なモニターから出る赤外線を利用して
ユーザーがサイト上のどこを見たかが解るようになっている。
赤い線は視線の動き、
よく見たところは赤い丸が大きくなる。
（アイトラッキング動画についての詳細はこちら）

今話題の「ECサイト出店無料」のYahoo!ショッピングのサイトを
60歳代女性に見ていただいた。

彼女は、ネットはかなり使っており、
Yahoo!ショッピングでも購入したことがある方である。
（ただし、以前は、購入したい商品が
Yahoo!ショッピングにしかなかったためにそこで買ったが
普段は、amazonをメインに利用している。）

この動画からわかること
・ファーストビューで探せそうな情報を探している。
・左のカテゴリはほとんど見られていない
・殆ど写真しか見ていない
・下に情報がありそうだと思えばスクロールする
・スクロールされた場所は適当にしか見られていない

ファーストビューがとても大事で
スクロールされるかされないか、
そして、スクロール以下の注意力の低下が伝わるだろうか。

次を見たくなる仕掛けづくりが必要

例えば、知らない街の知らない駅に降りたとする。
なにも見ずにぐんぐん歩ける方もいると思うが
たいていの人は、駅周辺の地図を見るなどして
どこに何があるかを把握しようとする。

もし、あなたが、知らない土地の知らない駅で降りたのに
先ほど降りた駅と、全く変わらない周辺地図を見たら
「あれ？電車に乗ったのに、同じ駅？」と思うかもしれない。
もしくは、「同じような駅だったら、もう一駅先の駅で降りてみよう」と
思うかもしれない。
景色が変わらないなら、別の場所に行く。

それが、スクロールをしない理由。

「新しさ」「発見できそうな感じ」「目的のなにかがありそうな感じ」がなければ
人は、駅から出ない。

だから、シニアはスクロールをできないのではなく
スクロールしても、自分の必要な情報は出てこなさそうだという判断をするので
スクロールをしない。

若い人なら、「もしかしたらこの先にあるかも」と
先に進む（＝スクロールする）ことを苦にもしないが
年を取ってくると
「めんどうくさいな」が先に立ってしまうため、
「スクロールする」より、「しない」という選択肢を取る。

それがそのサイトを熟知していない
フツーのユーザー。

一方、その街を良く知っている人であれば、
地図を見ずに歩くことができる。

どこに何があるかも知っているし
隣の駅との違いも分かっている。
ポストの場所も知っているし、
どんな人がどこに住んでいるかわかっている。

それが、制作者の視点。

だから、制作者は　自分と、ユーザーの間に
スクロールに対するドキドキ感と熱量に差があることを
知らなくてはいけない。

もし、ここ1か月以内にユーザーから問合せ電話があって
「それ、書いてありますよ」と思わず言ってしまいそうになったら
たぶん、ユーザーはドキドキして、スクロールできていないのだと思う。

後記

本当は、楽天、amazonとの探しやすさの比較と
ユーザーにとっての使いやすいショッピングサイトみたいなお題にする予定だったが
急きょ変更。次回にネタを取っておこうと思っている。
（この動画の続きを使う予定）

ちなみに、Ｙａｈｏｏ！は検索結果とページ送りの間に広告が入っているため
ページ送りに気付かれにくくなっている。
Ｙａｈｏｏ！ショッピングと親和性の高い、初級者の行動を考えると
どうにか検索結果の1ページ目にはいらないと、購入候補にならなさそうだ。

もしかして、1ページ目を広告枠にしちゃう？みたいな
勘ぐりをして、「ああ、心が汚れちまつた・・・」と思う
秋の日でございました。

「知りたい事」「申し込みたいもの」「買いたいもの」があって
ワクワクしているのに、多くの人が、若い人に取っては「些細な」ミスで
サイト上で目的を達成できずに諦めたり、
諦めきれないからとサポートセンターに電話して
「その情報はホームページに載ってます」と言われ落ち込んだりしている。

今日は大学の公開講座に申し込もうとしている70歳代後半女性の話。

ウキウキの申し込み

「大学の公開講座申し込みたいの。英語をやり直したいのよ」といらしたMさん。

「新聞の折り込みで講座を見たのだけど、ホームページから申し込んでって書いてあって。
ホームページを見たのだけどどうすればいいのかわからないけど
ホームページからしか申し込めないらしいから、やり方教えて」

とのこと。

チラシには所狭しと色々な講座があり、彼女の好奇心を満たす講座も沢山。

「私、この講座かこの講座を検討しているの。画面の出し方を教えてもらってもいい？」

それでは早速見てみましょう。
ちなみに、彼女が使用しているのはミニノート。
画面が小さく、
ファーストビューの範囲が狭いのが難点。

ポイント：シニアはスクロールをしない

Yahoo!の画面で、大学名を途中まで入力すると、大学名が表示されます。
それをクリックすると、検索結果に大学のページが現れクリックすると…

そこに「公開講座」の案内はない。

シニア層はあまりスクロールをしない。
最初の画面で「情報がありそうだ」と思うとスクロールをするが、
それまでは、あらわれた画面をじっと見る。

「どこにあるのかしら」

しかし、ざっと私が隣のPCでスクロールしたが
公開講座へのバナーなどはすぐには見つからなかったため
仕方がないので、検索結果画面に戻り、キーワードを追加することを促した。

ポイント：シニアはリストマークをクリックする

そして現れた公開講座のページ。
画面を見まわして左側にあるメニューを見つけた。

「講座案内」の文字を見つけると、彼女は、横の小さな▼、
いわゆるリストマークをクリックし続ける。

「文字の上はクリックできない気がする」そうだ。
しかし、リンクされていないため、何も起きない。

私が文字をクリックするように促して、ようやく「講座案内」の文字の上をクリックした。

そして、秋期講座をクリックした。

ポイント：慣れていない人はクリックする場所を推測しない

秋期講座のページが表示されると、動きが止まった。
よく見ると
←こちらからお入りください　と書いてあるものの
それはシニアにとって、「押す感じ」がないので目に入らない。

「押す場所」として認識されていないものは、見ようともしない。
慣れている人なら「ここかな」と推測するものの
慣れていない人は、そこではないだろうと、最初から無視をしてしまう。

せめて色を変える、フォントを大きくするなど
押す場所はここ！ということが一目でわからなくてはいけない。

ポイント：別ウィンドウはなるべく使わない

彼女にとっての最大の難関は、ここだった。
講座案内は別ウィンドウで開く。
そのウィンドウを大きくしようとして、外側のウィンドウをクリックしてしまう。
そして、小さく開いた別ウィンドウは消える。驚く。またクリックする。ループ。

ポイント：難しい言葉は見えなかったことになる

講座の一覧が出ると思ったが、出ているのは検索画面。
左のジャンル「語学講座」の下には（申込み時要ログイン）と書いてあり、
クリックするのに躊躇してしまう。

シニアは難しい言葉があるとクリックを避ける。

仕方がないので、講座検索のキーワードに「英語」と入れて検索した。

ポイント：ファーストビューはページの中身がすぐにわかるようにすべし

現れたページは、講座検索の画面のままだ。
彼女の画面が小さいがために、検索結果が見えないのだ。

「あれ？」と、つぶやき、もう一度「英語」と入力して検索する。
しかし、画面は変わらず。

そう、画面上部に検索ウィンドウが表示されているのだ。

大切なことだから、2度いうが、シニアはスクロールをしない。
そして、ファーストビューが変わらないと戸惑い、新しいページに来たことに気付かない。

その後

一部はPDFになっており、その表記もないため
初心者（というほど彼女は初心者ではないと自負していると思う）は戸惑うばかりである。

色々手伝ったが、その後も情報が足りないなどいろいろあり、
結局電話で予約した。

彼女は帰り際にこのように言った。
「何を勉強したら、こういうホームページを自由に使えるになるんでしょうか」
なかなか難しい質問である。

シニアを取りこぼさないサイトへ

もちろん、若者向けの講座であれば、この作りでもいいと思う。

ネットもサービス業であるのだから、
「万人が使えるべき」サイトは公共機関以外存在しない。

大人な感じのバーに、
明らかに子どもが入ってきたら既にいたお客様は違和感を感じるだろうし、

逆に、女子高生の中に私が「イェーィ」とか言って入ってきたら
女子高生は目にもとまらぬハヤザワで逃げるか、もろに嫌な顔をするだろう。
そして、私はその冷たい視線にいたたまれなくなり、場を離れるだろう。

大人、子どもだけじゃない。それぞれの嗜好もある。
そのキャラが好きじゃない人に喜ばれるサイトを作る必要はない。

ウェブは、そのサービスを提供したい人のためのものなのだから
万人受けする必要はないと思う。そのためのペルソナだ。

しかし、もし、公開講座がシニアも歓迎の姿勢で運営しており
シニアの彼女が利用に戸惑ったり、ストレスを感じていたり
目的を達成できないのであれば、これは、少し問題だと思う。

使いづらい、ということは、使いたい人が目的を達成できないということだ。
もし、シニア層もニーズを感じている商品や情報を扱っているのであり、
年齢層ではなく、ニーズ・ウォンツ別にカテゴリ化しているのであれば
是非、シニア層を含むほしい人が使えるサイトであってほしいと思う。

こんなチェックシート作りました。

シニア層を取りこぼしていないかチェックできる
簡易セルフチェック表を作成しました！

質問にはい、いいえで回答するだけで
自社サイトがシニアを取りこぼしていないかをチェックできます。

また、自社サイトがシニア層を取りこぼしまくっているなあと思う方は
シニア層も使えるウェブサイト制作のためのガイドラインがおススメです。

頑張りたいシニア層の頑張りが実る
ストレスがたまらないサイトが一つでも多くなることを祈っています！

マミオンでは、2013年8月中旬に、60歳以上のネットユーザー（N=100）を対象とした「インターネットショッピングに関する簡易調査」を行いました。

【調査概要】
　・調査方法：ネットアンケート
　・調査期間：2013年8月15日（1日間）
　・調査対象：60歳以上の男女
　・有効回答：100人（男性77人、女性23人）

今回はこちらの結果から、シニア層はネットショッピングのどこでつまづいているのか、意外な事実をご紹介したいと思います。

シニアの「6割」が途中であきらめた経験アリ

まずはネットショッピングにおいて、途中であきらめた経験の有無についてお伺いしました。

Q. あなたは、ご自身でネットを使ってお買い物をしようとした際に、途中であきらめてしまった経験はありますか？

このグラフのように、「途中であきらめたことがある」と回答した方は、なんと6割にも上ることがわかりました。今回のアンケート対象はネットリサーチのモニターなので、ITリテラシは比較的高めの方が多いはずなのですが、それでも半分以上の方が買い物を途中で断念せざるを得なかったようです。

シニアにとってのハードルは、「入力フォーム」のもっと前にある！

次に、ネットショッピングを「あきらめた理由」についてお伺いしました。

Q. あきらめた経験がある方は、以下のどの理由からですか？（複数回答）

このグラフからは、「探している商品が見つからない」「商品の情報が十分でない」「会員登録が嫌だった」というトップ3が、他の理由を大きく引き離しているのがわかります。

この結果、意外だと思いませんでしたか？

先日行ったECサイトオーナー向けのマーケティングセミナーでも、こちらの順位当てクイズをやっていただいたのですが、多くの方は「注文方法がわからない」「入力で失敗した」などが上位に入ってくるだろうと予想していたため、大変驚かれていました。

ちなみに「注文方法がわからない」「入力で失敗した」というカートや入力フォームまわりの回答は、どちらも7%と低い結果が出てきました。一見、「なんだ、入力フォームを改善しても大きな効果はないんだな」と考えてしまいがちですが、先ほどのトップ3の理由の高さを考慮すると、実はフォームまでたどり着けていない方も多いのかもしれません。

そのサイトは本当に信頼できるのか？

最後に、前問の理由について詳しい状況を説明してもらいました。

Q. 買うのをあきらめたとき、具体的にどういった状況でしたか？（自由記述）

商品が見つからない
・色々と探しているうちに迷ってしまった
・ボストンバッグに希望の色が無かった

商品の情報が不十分
・嘘っぽい記述ばかりで信じるに十分な商品説明がなかった
・ちゃんとした商品が届くか？不安です

会員登録が嫌だった
・1回しか利用しないであろうショップに会員登録をする気になれなかった
・登録するとメールが頻繁にくるようになるから

希望する支払方法がなかった
・カードは信用できないので現金支払いができないのは駄目
・支払方法が代引き、コンビニ決済しかなくて購入を断念した

こちらの中で特に気になったのが、「不安」と「迷惑メール」という言葉です。

商品の情報が十分与えられていなければ、この商品が本当に自分の欲しいものなのかどうか、購入時にとても大きな不安を感じます。他にも、「ちゃんと商品が送られてくるのか」「クレジットカードを使うとトラブルになるのではないか」といった不安を挙げている方も多く、そのサイトの信頼感や実績などを強くアピールする重要性が浮き彫りになりました。

また会員登録が敬遠される大きな理由の一つが、「登録すると迷惑メールがたくさん来てしまうのではないか」というマイナスのイメージです。これについては、なぜ会員登録するべきなのか、メリットを丁寧に訴求する必要がありそうです。ただし、せっかく登録したとしても、IDやパスワードを失くしたり忘れてしまったりする場合も多いので、囲い込みの効果に過度な期待はしない方がよいでしょう。

ボトルネックとその理由を正確に把握して、効果的な対策をとろう！

マミオンでは、「最近シニアのお客さんが増えてきているから、まず入力フォームを使いやすくしたいんだよね！」といったようなご相談を多くいただきます。もちろんそういった部分の改善も重要なのですが、実際のシニアユーザーは、もっと前の段階からつまづいたり困ったりしているのではないでしょうか？前の段階でつまづいているのに、後の方ばかりを改善していても、大きな費用対効果は期待できません。

また買い物をあきらめた理由については、アクセスログを眺めているだけではなかなかわかりません。これを詳しく知るためには、今回のようなアンケート調査や、直接行動を観察するユーザーテストが非常に有効です。

ボトルネックはどこか？それがなぜ発生しているのか？

これらを正確に把握することは、シニアも問題なく使えるサイトに近づいていく「第一歩」です。ぜひ皆さんのサイトも、ユーザーの行動全体を意識することで、より効果的な改善を進めてください。

前回までに「目」と「脳（記憶）」の老化対策についてご紹介しましたが、もう一つ顕著に衰えが出てくるのが、「手や指先」などを動かす能力です。

教室でシニア層の方々がパソコンを使う様子を観察していると、マウスカーソルを細かく移動させるのに苦労していたり、クリックするときに手が震えてズレてしまったり、キーボードで打つ文字を間違えてしまったりといった光景をよく目にします。

今回は、こうした「手や指先」の衰えに対するサイトの施策をまとめてみたいと思います。

ボタンやリンクの大きさを確保する

多くの高齢者の方にとって、マウスカーソルを数ピクセルだけ動かすという操作は非常に難しいことです。また、手が震えて意図しない場所をクリックしてしまうこともよくあります。

こうした失敗を防ぐため、ボタンやテキストリンクの大きさは必ず適切に確保しましょう。テキストは12pt以上、ボタンの幅は24px以上あると安心です。

また忘れずに対応したいのが、入力フォームページなどにある「チェックボックス」や「ラジオボタン」です。CSSでボックスを大きくできますし、ラベル部分をクリックしても反応するように設定しておくことが望ましいです。

そして最近では「iPad」などのタブレット端末でWebサイトを見るというシニア層の方も増えてきていますが、リンク領域を適切な大きさで確保することは、同時にタブレット端末対応にも繋がるので一石二鳥の対策とも言えます。

動きのあるUIを使わない

多くのサイトのトップページでよく見かけるのが、時間とともに画像が次々に切り替わっていく「ローテーションバナー」と呼ばれるギミックです。

しかし、手や指先の不自由な人が操作する場合、クリックしようと思ってから押されるまでにどうしても大きなタイムラグが発生します。その間に画像が切り替わってしまえば、当然操作ミスに繋がります。

またメニューなどでよく用いられる「ドロップダウン」や「アコーディオン」のギミックも、細かな操作が難しい方にとっては非常にやっかいです。特に第2階層メニューを選択しようとした際に、マウスカーソルを第1階層メニューに沿って動かさなくてはならないデザインは、操作の難易度が高いです。

ちなみにAmazonはこの問題に独自の方法で対応しています。同じ2階層のメニューでも、マウスカーソルの移動方向によって反応のタイミングを微妙に調整しているのです。

【参考記事】
・なぜAmazonのメガドロップダウンメニューはスムーズに操作できるのかという秘密 - GIGAZINE

ドラッグ操作を強要しない

高齢者がマウス操作の中で一番苦手にしているのが、「ドラッグ&ドロップ」です。

人差し指を抑えながらマウス全体を動かすという2つのことを同時に行うのは、慣れないうちは想像以上に大変です。途中で指が離れて変な場所にドロップしてしまったり、頑張りすぎて手がつりそうになってしまったり…。

通常のWebサイトではそれほど必要とされない操作ではありますが、例えば並び替えのUIや、つまみ式のコントロールなどを使う際は、代替の操作方法も一緒に提供するとよいでしょう。

「上部へ戻る」リンクを用意する

高齢者ユーザーの中には、マウスホイールで画面をスクロールできるということを知らず、常に右端のスクロールバーを使用している人も多く見かけます。

縦に長いページを製作する際には、こうしたユーザーの負担を少しでも減らすため、ページの最下部に「上部へ戻る」リンクを用意しておくのがよいでしょう。

ただし実装する際は「上部に移動してもURLは変わらない」ように注意してください。シニア層はブラウザの「戻る」ボタンを非常によく使用するため、アンカーリンクで移動させると「ページが戻らない！」と思われてしまいます。URLを変えずに上部へ移動させるには、jQueryが役立ちます。

【関連記事】
・jQueryで、ぬるっとスクロールしながらページのトップに戻る機能を実装する。 « なかがみや

テキスト入力項目はできるだけ少なく

これは一般のユーザー向けにもよく言われていることですが、ことさら高齢者はテキスト入力にかかる時間が大変長くなるため、より慎重に考慮する必要があります。

必須でない入力項目を見直すのはもちろん、郵便番号から住所を自動で入力してくれる機能や、検索等であれば履歴やサジェスト機能などを用いて、キーボードから入力する文字数を少しでも減らしてあげるとよいでしょう。

【関連記事】
・ECサイトのおもてなし力を上げる「超快適な」住所自動入力機能 | マミオン有限会社

入力フォームはできるだけ繋げて

キーボード操作とマウス操作の両方が必要な場合、その度に手を移動させる必要があります。これを専門用語で「ホーミングタイム」と呼びますが、高齢者ほどこの時間が長く、わずらわしさや操作ミスの原因のひとつになっています。

【関連記事】
・入力機器としてのマウス vs. 指 – U-Site

パソコンの操作に慣れた人は、郵便番号や電話番号のフォームが2つや3つに分かれていても、「Tabキー」を使ってキーボードから手を離さずに入力を続けられます。

しかしこの「Tabキー」の機能を知らない多くの高齢者の方々は、その小さなフォームからフォームへ移動するたびに、マウスを探して手を伸ばし、移動させ、クリックし、またキーボードに戻るという負担の大きい操作を繰り返す羽目になります。

こういったことを防ぐためにも、データベースが許す限り、フォームはなるべく繋げてあげるのがよいでしょう。

シニア顧客の取りこぼしを防ごう

今回、「手や指先」が衰えたユーザーにも優しいサイト作りのポイントとして、以下の6つについて簡単にご紹介しました。

・ボタンやリンクの大きさを確保する
・動きのあるUIを使わない
・ドラッグ操作を強要しない
・「上部へ戻る」リンクを用意する
・テキスト入力項目はできるだけ少なく
・入力フォームはできるだけ繋げて

これで「目」「脳（記憶）」「手や指先」と、3つの観点からサイトをシニア対応させていくポイントをご紹介しました。インターネットユーザーの平均年齢は毎年上がってきていますので、こうした対策が今後ますます必須になってきます。

シニア顧客の取りこぼしを防ぐため、ぜひご参考にしてください。

参考リンク

・これだけは確認しておきたいサイトの老眼対策5つのポイント | マミオン有限会社
・「記憶力」が衰えたユーザーにも優しいサイトにするための6つのポイント | マミオン有限会社