自社サイトを
見直すときのポイント
専門的な診断を行わなくても、自社で確認できることはあります。
いつも見ているサイトを、初めて訪れた人のつもりで使ってみるところから始めてみます。
見慣れたサイトを、
利用する側から見てみる
自社サイトを日常的に管理していると、どこに何があるのかを自然と覚えていきます。
メニューの名前を見れば内容がわかる。問い合わせフォームの場所も知っている。少しわかりにくい表現があっても、何を意味しているのか想像できる。
サイトをよく知っている人にとっては問題のないことでも、初めて訪れた人にはそうではない場合があります。
そこで、自社サイトを見直すときには、具体的な目的をひとつ決めて実際に操作してみます。
サービスの内容を調べる。会社の所在地を探す。採用情報を見る。問い合わせを送る。普段の利用者が行いそうなことを、自分でも最初からたどってみます。
そのときに見ておきたいのが、読みやすさ、見つけやすさ、操作しやすさ、情報の伝わり方です。
ここで紹介するのは、専門的なアクセシビリティ診断ではありません。自社サイトにどのような課題がありそうかを知るための、簡易的な確認方法として考えてください。
利用者と同じ目的で、最初からたどってみる。
サービスの内容を調べる、会社の所在地を探す、採用情報を見る、問い合わせを送る。
そのときに見ておきたいのが、読みやすさ、見つけやすさ、操作しやすさ、情報の伝え方です。
読みやすさを見てみる
ページを開いたら、まず文章を読んでみます。
文字の大きさは、無理なく読めるでしょうか。文章が詰まりすぎていたり、行間や段落の余白が狭かったりすると、内容を追いにくくなることがあります。
一文が長すぎないか、一つの段落にいくつもの話題を詰め込んでいないかも見てみます。文章の内容だけでなく、情報の区切り方によっても読みやすさは変わります。
文字と背景のコントラストも確認しておきたいところです。デザイン上はきれいに見える薄い文字でも、利用する人の視覚や画面の状態、周囲の明るさによっては読みづらくなることがあります。
普段は気にしていなかった場所で「少し読みにくい」と感じたなら、それも見直すきっかけになります。
読みやすさ
- 文字を無理なく読める大きさか
- 行間や余白が詰まりすぎていないか
- 一文や一段落が長くなりすぎていないか
- 文字と背景を十分に見分けられるか
見つけやすさを確かめる
次は、目的の情報を探してみます。
ページ内の見出しだけを追ったときに、どのような内容が書かれているか想像できるでしょうか。見出しが内容を適切に表していれば、長いページでも必要な場所を探しやすくなります。
サイト全体のメニューについても、名前を見れば行き先を予想できるか確認します。運営側には意味が通じる名称でも、初めて見る人には何があるのかわからないことがあります。
また、重要な情報が複数の場所に分散していたり、何ページも進まなければ見つからなかったりすると、利用者は途中で迷ってしまいます。
ここでは、クリック数を機械的に数えることよりも、次にどこへ進めばいいかを自然に判断できるかを見るほうが重要です。
見つけやすさ
- 問い合わせフォームを迷わず見つけられるか
- 採用情報がどこにあるかわかるか
- サービスについて調べるとき、次に見る場所がわかるか
- 見出しを追うだけでもページの内容を把握できるか
操作しやすさを試してみる
リンクやボタンは、見たときに操作できるものだとわかるでしょうか。
「こちら」「詳しくはこちら」のようなリンクは、周囲の文章を読まなければ行き先がわからないことがあります。できる範囲で、リンクそのものから移動先や内容を判断できる表現になっているか確認します。
問い合わせフォームは、入力から送信まで通して使ってみると状態を把握しやすくなります。入力する内容がわかるか、必須項目を判断できるか、入力に誤りがあったときにどこをどう直せばいいか理解できるかを見ていきます。
PCでは、マウスを使わずにTabキーでページ内を移動してみる方法もあります。リンクやボタンなどへフォーカスが移動し、現在どこを操作しているのか画面上で確認できるかを見ます。
順番が不自然だったり、フォーカスの位置が見えなかったり、途中から先へ進めなかったりする場合には、キーボード操作に問題がある可能性があります。
ただし、Tabキーによる操作はあくまで簡易的な確認です。スクリーンリーダーやその他の支援技術を利用した状態まで含めて判断するには、別途専門的な検証が必要になります。
操作しやすさ
- リンク先の内容を押す前に想像できるか
- フォームの入力方法やエラーの内容がわかるか
- Tabキーで移動したときに、フォーカスの位置と順序を確認できるか
情報の伝え方を見てみる
重要な情報が、画像の中の文字だけで伝えられていないかも確認します。
画像が表示されない場合や、画面を音声で読み上げて利用している場合には、画像内の文字をそのまま受け取れないことがあります。必要な情報が、画像だけに依存しない方法でも提供されているかを見てみます。
画像の代替テキストについては、すべての画像に説明を書けばよいわけではありません。その画像が情報を伝えているのか、リンクなどの機能を持っているのか、装飾として置かれているのかによって扱いは変わります。必要な画像には、その内容や役割に合った代替テキストを設定します。
リンクについても、「PDFをダウンロード」だけでは何の資料かわかりにくい場合があります。対象となる資料名まで含めるなど、操作する前に内容を判断できるようにします。
情報は、掲載されているだけでは十分ではありません。利用する人が、その内容を受け取れる形になっているかまで見ていきます。
情報の伝え方
- 重要な情報が、画像の中の文字だけになっていないか
- 必要な画像に、内容や役割に合った代替テキストが設定されているか
- リンクの文言だけで、何の資料や情報かわかるか
スマートフォンでも
実際に使ってみる
PCでは問題なく利用できるページでも、画面の小さいスマートフォンでは別の問題が見つかることがあります。
文字が小さくなりすぎていないか、画面から内容がはみ出していないか、不要な横スクロールが発生していないか。リンクやボタンを指で操作し、フォームにも実際に入力してみます。
特定の端末だけを見て判断するのではなく、PCとスマートフォンの両方で利用してみることで、それぞれの環境で起きる問題に気づきやすくなります。
スマートフォン
- 文字を無理なく読めるか
- 画面の一部が切れていないか
- 不要な横スクロールが発生していないか
- リンクやボタンを指で操作しやすいか
- フォームを入力から送信まで使えるか
気づいたことを整理する
確認していると、すぐに修正できそうなものから、どう直せばよいのか判断しにくいものまで、さまざまな課題が見つかることがあります。
文章やリンク文の修正など、比較的対応しやすいものもあります。
ページ構成、ナビゲーション、フォームの構造、UIの問題などは、設計や実装から見直したほうがよい場合があります。
また、自社では問題かどうか判断できないものや、支援技術を使った確認が必要なものは、専門的な診断や相談の対象になります。
今回紹介した確認だけで、サイトのアクセシビリティをすべて評価することはできません。それでも、「何となく使いにくい」という状態から、どこに問題がありそうなのかを具体的にしていくことはできます。
その整理ができれば、その後に自社で直すのか、改修として計画するのか、専門家へ相談するのかも判断しやすくなります。
気づいたことを3つに分ける。
文章やリンク文など、比較的対応しやすいものもあります。ページ構成やナビゲーション、フォームの構造やUIに関わるものは、設計や実装から見直します。自社では判断が難しいものや、支援技術を使った検証が必要なものは、専門的な確認の対象になります。
いつものサイトを、
違う立場から見てみる
自社サイトを見直すときには、利用者が実際に行うように、文章を読み、情報を探し、リンクやフォームを操作してみます。
運営する側には当たり前になっていることでも、初めて訪れる人や、異なる方法でWebサイトを利用している人には、わかりにくい場合があります。
専門的な診断の前でも、自分たちで使ってみることで気づけることはあります。そこで見つかった課題を整理し、必要な改善や詳しい確認へつなげていくことが、自社サイトを見直す最初の作業になります。
見慣れたサイトを、初めての人の目で使ってみる。
日々見ている画面をたどり直すだけでも、気づけることはあります。そこで見えてきたものが、次の改善の出発点になります。
まずは、今の状況から
ご相談ください。
アクセシビリティ対応が必要になった。
サイトを見直したい。
何から始めればよいかわからないなど、
どんな段階でもお気軽にご相談いただけます。
現状の確認から、必要な対応の整理まで、
一緒に考え、最適な進め方をご提案します。