前回の記事（すべての人に届くWebサイトへ。Vol.2｜「見えにくい」「わかりにくい」を、設計で解決する）では、色やフォントの工夫で「見えにくさ」「わかりにくさ」を設計で解消するアプローチをお伝えしました。今回はその続きです。
前回は「見えにくさ」「わかりにくさ」を設計で解決するアプローチを取り上げました。今回は、視点を「操作」に移します。マウスが使えない、画面をタッチしにくい——そうした状況にある方にとって、Webサイトが「操作できるかどうか」は、情報にたどり着けるかどうかと同じことを意味します。
パソコンではマウスを動かしてクリック。スマートフォンでは指先でタップ。私たちが何気なく行っている操作は、実はとても限られた方法に依存しています。しかし、手を怪我していてマウスが握れない方、指先の細かな操作が難しくなった高齢の方、満員電車の中で片手しか使えない方——「いつもの操作」ができない場面は、意外なほど身近にあります。そうした状況にいる方がWebサイトを問題なく使えるかどうか。私たちは、この問いにこそUXデザインの大切な本質があると感じています。
マウスに依存しない設計という発想
パソコンでWebサイトを操作するとき、ほとんどの方はマウスやトラックパッドを使っていらっしゃるのではないでしょうか。指先ひとつでカーソルを動かし、クリックする。あまりにも自然な操作なので、それ以外の方法を意識する機会は少ないかもしれません。しかし、さまざまな理由からマウスを使えない方、あるいは使わないことを選ぶ方は少なくありません。手や腕の怪我はもちろん、身体的な特性でマウス操作が難しい方もいらっしゃいます。こうした方が頼りにしているのが、キーボード操作です。Tabキーでリンクやボタンを順番に移動し、Enterキーで決定する——この操作がスムーズにできるかどうかが、アクセシビリティの重要なチェックポイントのひとつです。試しに、自社サイトをマウスなしでキーボードだけで操作してみてください。意外なほど使いにくさを感じるサイトが多いことに、気づかれるかもしれません。
スマートフォンの「タップしにくさ」に向き合う
スマートフォンでの操作でよく見られる問題が、ボタンや リンクが小さすぎて押しにくいというものです。指先でタップするためには、ある程度の面積が必要です。特に、高齢の方や指先に力が入りにくい方にとっては、小さなタップ領域は大きな障壁になります。「タップターゲット」と呼ばれるこの操作可能な領域は、少なくとも44px×44px程度を確保することが推奨されています。また、リンクとリンクの間の間隔が狭すぎると、隣のリンクを誤タップしやすくなります。こうした細かな配慮が、「使いやすいスマートフォンサイト」の土台になります。
「操作できる」が、届くための前提
どんなに情報が充実していても、操作できなければ届きません。「操作のしやすさ」はアクセシビリティの中でも特に見落とされがちな部分です。なぜなら、見た目には問題がなく、多くのユーザーは困らないからです。でも、困っている方は確かにいます。その方たちのことを設計の段階で想像できるかどうかが、本当の意味での「すべての人に届くWebサイト」を目指す姿勢につながります。
まとめ
「いつもの操作」ができない方にとって、操作性はサイトにたどり着けるかどうかを左右する重大な問題です。キーボードだけで操作できるか、タップ領域は十分か——こうした視点を設計に取り入れることが、より多くの方に届くWebサイトをつくります。「困っている方を想像して設計する」姿勢が、アクセシビリティ改善の第一歩になります。
記事監修
中谷 浩和
株式会社サンアンドムーン｜代表取締役
1976年創業のデザイン事務所を前身に、Webコンサルティング・UI/UXデザインを専門とする。
国際標準のUX設計プロセスを学ぶ Google UX Design Professional Certificate を取得し、 上級ウェブ解析士 としてデータ主導のサイト改善にも精通。デザイン思考を軸に、ユーザー認知・行動・文脈からWebサイトの課題を捉え直し、成果につながる設計へ落とし込むことを使命としている。システム設計、フロントエンド技術、SEO・パフォーマンス改善まで技術知識を横断し、サイト全体を見通したディレクションを得意とする。自動車メーカー、銀行・クレジットカード、保険などの大手から中小企業まで、数値で検証しながら改善を積み重ねる実践的なコンサルティングを提供している。
