第1回:ウェブサイトのユーザーに出会う | わたしたちの“ウェブアクセシビリティ”を考える

BACK

2025.03.26

執筆者 : 萩原俊矢

イラスト。もやもやとしたオレンジ色の背景の上に、ノートパソコンが描かれている。ディスプレイにはZOOM通話画面があり8人の人物が映っている。話す人、腕を組む人、考えごとをする人、カメラをオフにする人などが描かれている。

このレポートでは、複雑で多様化する現代のユーザー環境と、ウェブサイト制作のプロセスを見つめ直しながら、ウェブアクセシビリティの“いま”を捉え直します。

全5回を通じて、ウェブサイトづくりのこれからや、わたしたち一人ひとりができることを探ります。

  1. (この記事)第1回:ウェブサイトのユーザーに出会う
  2. 第2回:ウェブアクセシビリティの現状を整理する
  3. 第3回:ウェブアクセシビリティ向上に取り組む
  4. 第4回:ユーザーが多様であるという気づき
  5. 第5回:わたしたちの“ウェブアクセシビリティ”は広がり続ける

はじめに

イラスト。やさしいオレンジ色のふわふわした背景の上に、VRゴーグルを着けた人、液晶タブレットで作業する人、イヤフォンで音楽を聴く人、翻訳されたウェブサイトを閲覧するノートパソコンのユーザー、大型のワイドモニター、AI搭載のスマートスピーカーなど、さまざまなデバイスとそれを使う人々が描かれている。

日本のインターネット普及率は85%を超え、情報を得る手段やデバイスの使い方は多様化しています。現代は、さまざまな感覚や特性をもつ人々が、さまざまな環境からインターネットに接続し、「ユーザー」という言葉が指す範囲も広がっている時代です。

このプロジェクトでは、「ウェブアクセシビリティ」を改めて考え直すことを目的としています。ウェブアクセシビリティと聞くと、障害のある人に絞ってウェブサイトを利用しやすくする取り組みだと捉える方もいるかもしれません。かつて、わたしはそう考えていました。しかし、実際にウェブアクセシビリティの向上に取り組むうちに、「そもそも障害とは何だろう」「アクセスできるとはどういうことだろう」「規格やチェックリストは何に基づいているのだろう」と、もやもやすることが増えていきました。

今回のプロジェクトは、「そもそもウェブアクセシビリティとは何か?」という疑問から再出発し、障害の有無にかかわらず多様な環境からアクセスするユーザーと対面して伺ったお話を振り返りながら、これからのウェブサイトのあり方を探る試みです。

とはいえ、わたしはウェブアクセシビリティの専門家ではなく、研究者でもありません。ウェブサイト制作の経験は豊富にありますが、アクセシビリティについてはまだ学びの途中で、日々悩みながら実践している技術者の一人です。ウェブディレクターとして活動するなかで感じた、アクセシビリティの向上をチームで持続的に行うことの難しさや、ユーザーの情報体験を設計する立場だからこそ生じる葛藤をふまえ、「よいウェブデザイン」とは何かを、自分の経験やユーザーから見聞きしたことをもとに考えてみたいと思います。

わたしについて

わたしは萩原俊矢(はぎわら・しゅんや)といいます。ウェブデザイナー・エンジニア・ディレクターとして、ウェブサイトやアプリの開発をしています。2000年代初頭からウェブサイト制作をはじめ、当時流行していたFlashを使い、インタラクティブな作品やウェブサイトを数多くつくってきました(いま思えば、それは非常にアクセスしづらいものだったと思います……)。ここ15年ほどは、企業や大学、美術館、アートプロジェクト、デジタルアーカイブのウェブサイトに携わり、企画・設計・構築・運用を行っています。このTARLのウェブサイトの制作や運用も担当しています。

本業のかたわら、友人たちとメディアアート関連のプロジェクトも手がけてきました。もともと「メディアと人の関係性」や「新しいメディアを用いた表現」に関心があり、その延長で、多様なユーザーとメディアの関わりをなめらかにする取り組みであるウェブアクセシビリティに興味を持つようになりました。

最近は、ウェブサイトをつくる際にさまざまな障害のある方にデザインやプログラムの「レビュアー」として参加していただき、感じたことを共有してもらいながらウェブサイトへのアクセスのしやすさを向上させる取り組みに力を入れています。このような方法にいたるきっかけは、10年ほど前に、自分がつくったウェブサイトがどのように使われているのかを目の当たりにしたことでした。

わたしとは異なる方法でウェブサイトをみるユーザー

伊敷さんがウェブサイトをブラウジングする様子。総務省(2012年)、視覚障害者(弱視)のホームページ利用方法 [動画]、 YouTube

2015年ごろ、とあるウェブサイトの勉強会で、視覚に障害のあるユーザーがどのようにウェブサイトを操作するのかを実際に見る機会がありました。そこで、ウェブアクセシビリティの専門家である伊敷政英(いしき・まさひで)さんと出会います。

伊敷さんは弱視(当時)で、Windowsのアクセシビリティ機能を活用し、画面の色を白黒反転させたり、一部を大きく拡大したりしながら、ディスプレイにぐーっと顔を近づけて情報を得ていました。

また、別の参加者には全盲の方もいました。その方はスクリーンリーダー(画面の情報を合成音声で読み上げるソフト)を使用し、キーボード操作のみでウェブサイトにアクセスしていました。コンテンツを読み上げる速度は驚くほど速く、最初はそれが日本語であることもわからないほどでした。

つまり、制作者がデザインや表現を慎重に考えてつくったウェブサイトが、実際にはその想定とは大きく異なる形で利用されていたのです。お二人が自分の使いやすいように環境をつくっている様子を目の当たりにし、わたしは強い衝撃を受けました。

当時わたしの制作したウェブサイトは、お二人のような閲覧環境を考慮した検証をまったく行っていなかったために、情報が取得しづらい場面が多くありました。それにもかかわらず、伊敷さんは「ここを調節すればもっと良くなりますよ」と前向きに改修方法を指摘してくださり、その姿勢には頭が下がる思いでした。

“ユーザー”不在のままつくることへの違和感

視覚に障害のある方によるウェブサイトのレビューを体験してから、わたしはウェブサイト制作に向き合うときに何かもやもやとした違和感を覚えるようになりました。

これまでデザイナーとしてユーザーの情報体験を設計するとき、「ナビゲーションではユーザーが迷わないように」「ページを開いたときにちょっと驚きがあるように」といった工夫を重ねてきました。でも、そこで想定していた「ユーザー」とは、わたしがこれまで出会ってきた人々の印象から生まれたもので、出会う機会の少なかった視覚障害のある方のことは、想像すらできていなかったのです。

わたしたちが「かっこいい」「便利に違いない」と思ってデザインしたものが、実際にはまったく違う方法でアクセスされている。あるいは、そもそもアクセスすらできないのかもしれない。そしてそういった多様なユーザーのことをわたしは想像すらできていないと知り、ウェブデザインの前提が大きく揺らぐような感覚を覚えました。

それは当時のわたしにとってショッキングな出来事であると同時に、メディアと人の関わり方は自分が思うよりも多様であることを実感し、新たな可能性を感じる体験でもありました。それ以来、ウェブサイトをつくるときには、できる限りさまざまなユーザーにレビューをお願いするよう制作体制を見直すようになっていきました。もちろん、予算やスケジュールによってはそういった状況をつくれないこともあるのですが……。

ユーザーそれぞれの環境

その後、伊敷さんから「サニーバンク」という障害者専門のクラウドソーシングサービスを紹介してもらいました。サニーバンクでは、多様な障害特性のある方が実際にウェブサイトを利用し、その体験をレポートとして提供する「ウェブサイトアクセシビリティ診断サービス」を行っています。

わたしもこのサービスを何度も利用し、普段なかなか出会えない多様なユーザーにウェブサイトを見てもらっています。そこでは、つくり手が想像もしていなかった「アクセスしづらさ」があることに気がつくことができます。たとえば、次のような状況です。

  • スクリーンリーダーでメニューが正しく読み上げられず、先に進めない
  • マウスでの細かい操作が難しく、小さなボタンが押しづらい
  • 文字を拡大するとデザインが崩れ、操作ができなくなる
  • 音を出せない環境では、字幕やキャプションがないと動画の内容がわからない
  • 明るい配色や眩しい画面が苦手な方にとっては、派手な色づかいがつらい
  • 自動再生される動画に驚き、止めようとしても停止ボタンが見つからない
  • ロボットか人間かを判定するシステム(CAPTCHA)で歪んだ文字が読めず、AI文字認識アプリを使って突破する(突破できていいのかはさておき……)

これらはほんの一例にすぎません。実際には、ここで挙げきれないほど数多くの「アクセスしづらさ」がみつかります。そして、その多くは、ウェブサイトをつくる側が想定するユーザー像のなかに、かれらが置かれた多様な環境を含めていないことが原因ではないかと気づきました。

わたしたちつくり手の権限が大きくないか?

イラスト。ユーザーとデザイナーがぶら下がる天秤。デザイナーのほうが重く、傾いている。

アメリカの法学者のローレンス・レッシグは、著書『CODE VERSION 2.0』の中で「コードは法である」と述べています。ここでいう「コード」とは、コンピュータープログラムやソフトウェア、ハードウェアを含むシステム全体のことです。つまり、ユーザーはシステム上ではあらかじめ決められたルールに従うしかなく、コードは「法」のようにわたしたちの行動を左右する力を持っているのです。

たとえば、ウェブアンケートの入力項目に「男・女」の選択肢しか用意されていなかったとします。しかもそれが必須項目だった場合、ユーザーは「どちらかを選ばなければ送信できない」という状況に陥ります。対面であれば「答えたくない」「他の選択肢がほしい」と伝えることもできますが、システムではそうしたやりとりの余地がありません。情報発信側が意図していようといまいと、デザイナーやエンジニアがつくる「コード」は、ユーザーができること・できないことを決めてしまう強い力を持つのです。そしてそれが、ときに大きな負担を強いることもあります。

ユーザーの姿は見えにくい

これは、階段やエレベーターがないビルのようなものです。物理的な環境では、こうした構造的な問題が目に見えやすく、また実際に危険も伴うため建築基準法などを運用することによって共通のルールが定められています。しかし、ウェブの世界ではどうでしょうか。コードによってユーザーの行動が制限されていることに、制作者もユーザーも気づきにくいのではないかと思います(注1)。

ウェブサイト全体のマップとなる「グローバルメニュー」がマウスで使うことしか想定されていなければ、キーボードで操作する人はページ移動ができなくなります。動画プレーヤーやスライドショーが自動再生されるエリアに停止ボタンがなければ、ユーザーは自分の意思でそれらを止めることができません。感覚過敏のある人のなかには、激しい動きが苦手で、画面の照度を極端に下げて閲覧せざるを得ない方もいます。こうした状況下では、ユーザーが自分自身でなんとか対処するか、あきらめるしかありません。

ウェブサイトをつくる側からはユーザーの姿が見えにくいものですが、コードが影響を及ぼすのは無機質なマウスカーソルではなく、それを操作している多様な知覚や身体をもち、異なる人生を歩む人たちなのです。

つくり手が固定しすぎないデザイン

もちろん、あらゆる環境のすべての困りごとを完璧に把握することはできません。しかし、つくり手として「自分たちのコードがどのようにユーザーの行動を左右しているのか?」を意識することは、とても大切でしょう。

ウェブデザイナーの多くは、パソコンやスマートフォンの画面サイズを基準にデザインを行いますが、実際の閲覧環境はそれに留まりません。フォントサイズを大きくしたり、色をモノトーンにしたり、スクリーンリーダーを使ったり、外国語に翻訳していたり——ウェブサイトは本来、こうした多様な変化を受け入れられる懐の深いメディアです。プログラミングを用いたデザインの強みは、その柔軟性にあるのです。

わたしは、デザイナーがデザインを100%コントロールするのではなく、ユーザーに40%くらい、ゆだねてみるのもいいのかなと考えています。文字を大きくしたってかまわない、モノトーンだって理解しやすい、キーボードでも操作しやすい。そういう余白をユーザーに渡せないでしょうか。ただ、それはデザイナーが100%思いのままにつくるよりも、デザイン面でも実装面でも、ずっと実現することが難しい高度な表現技術ではあるのですが……。

ウェブサイトの可能性をさらに考えるために、次回はまず、ウェブアクセシビリティの現状についてあらためて確認していきます。そして、ウェブデザインの特性や可能性を軸に、ウェブアクセシビリティの向上について引き続き考えていきたいと思います。

文: 萩原俊矢, イラストレーション: Maya Numata

訳注

注1

情報へのアクセスしやすさを高めるための法律として、「情報アクセシビリティ法」があります。ただ、わたし自身の不勉強もありますが、こうした法律の存在を意識して情報設計をすることはほぼなく、今回のリサーチを通じてその存在を知りました。情報アクセシビリティの重要性を認識することはあっても、それを法律という枠組みで考える機会は少なく、実際の制作現場ではあまり意識されていないのが実情です。

続きを読む

このレポートは全5回でお届けします。

  1. (この記事)第1回:ウェブサイトのユーザーに出会う
  2. 第2回:ウェブアクセシビリティの現状を整理する
  3. 第3回:ウェブアクセシビリティ向上に取り組む
  4. 第4回:ユーザーが多様であるという気づき
  5. 第5回:わたしたちの“ウェブアクセシビリティ”は広がり続ける
このページを共有:

関連レポート