政治家のみなさま、あなたのウェブサイト、ちゃんとアクセスしてもらえてますか?

on 2015-04-20 (1 year ago) by 石橋秀仁

政治家・候補者およびそのスタッフのみなさま、私は情報建築家の石橋秀仁と申します。簡単に言うと「ウェブの専門家」です。

今回の選挙に際して、候補者のウェブサイトを見たところ、ウェブの専門家としていくつか「もったいない点」に気づきましたので、その背景・問題点・処方箋をお伝えします。

「もったいない…」と書かれたタスキをかけている候補者 写真素材ぱくたそ

背景

原則として、自治体のウェブサイトが公共的なつくりであるように、また政治家のウェブサイトも公共的なつくりでなければならないと考えます。「公共的なつくり」とは、「できるかぎり多くの人が、多くのデバイスで、自由にコンテンツにアクセスできる」ということです。 1

シンプルに言えば、せっかくウェブサイトを作るなら、ちゃんと作ったほうがいいということです。さもないと、多くの人にアクセスしてもらえず、もったいないのです。

これは今回の選挙にかぎらず、「政治家のウェブサイトはどうあるべきか」についての話です。後述の問題点について、仮に「今回の選挙中の修正は間に合わない」という状況だとしても、選挙とは関係なくいずれ修正されることを期待します。

政治家ウェブサイトの問題点

問題点1. 視覚障碍者がアクセスしづらい

ある候補者のウェブサイトでは、文字がすべて画像になっており、また「代替テキスト」も設定されていません。これは大変まずいことで、いわゆる「スクリーンリーダー」(画面読み上げ装置)によるアクセスができない状態になっています。

ある候補者のサイトに実際にスクリーンリーダーでアクセスしてみたところ、「これまでの実績」「政策」のような見出しはあるのに、その中身が空っぽでした。政策の中身が空っぽでした。大事なことなので二回言いました。

「空っぽ…」と書かれたタスキをかけている候補者

これは内容以前の問題です。「私は視覚障碍者に対しては情報を提供するつもりがありません」というメタメッセージになってしまいます。

それに、この候補者が視覚障碍者とのつながりがない、障害者福祉に関心が薄い候補者のようにも見えてしまいます。もし身近に視覚障碍者やその関係者・福祉団体などの人がいれば、この問題についてすぐに指摘を受けるはずであり、それによって修正されているであろうと類推できます。この状況が放置されているということは、そういう人たちとのつながりがないようにも見えてしまうのです。これは政治家として「誰を代表しているのか」という問題に関わってきます。

問題点2. 高齢者がアクセスしづらい

老眼や白内障など軽度の視覚障碍を患っている高齢者は、閲覧環境(ブラウザ、スマートフォン等)で「文字を拡大する設定」にしている可能性があります。2

ある候補者のウェブサイトでは、ほとんどすべての文字が画像(代替テキストなし)になってしまっており、そのような文字拡大機能が効きませんでした。また、スマートフォンのブラウザの画面ズーム機能(ピンチ・イン、ピンチ・アウト)も、あえて無効化されていました。制作者がとくに指定しないかぎり普通に利用できるズーム機能が、わざわざ無効化されていました。大事なことなので二回言いました。

「字ちっさ…」と書かれたタスキをかけている候補者

ここでも内容以前の問題で、「小さな文字を読めない人には情報を提供するつもりはありません」というメタメッセージになってしまっています。

問題点3. 聴覚障害者がアクセスしづらい

ある候補者のウェブサイトでは、動画コンテンツにキャプション(字幕)が提供されていませんでした。これでは聴覚障害者にはアクセスできません。耳が遠くなったお年寄りにも厳しいかもしれません。

耳に手を当て、号泣会見の野々村氏と同じポーズをとる男の写真に、「耳をすませば」というキャプション

同じことの繰り返しになりますので手短に述べますが、「聴覚障害者の存在を意識していない」「障害者福祉に関心が薄い」ように見えます。

処方箋

前述の問題は、ウェブページのつくりかた(とくにHTMLの書き方)によって解決することができます:

処方箋1. 画像に代替テキストをつける

すべての画像(img要素)に適切な代替テキスト(alt属性)をつけてください。

そもそも、すべてのテキストを画像にするのではなく、なるべくテキストのままマークアップしてください。

タイポグラフィにこだわるのであれば、「ウェブフォント」の採用も検討してください。

処方箋2. スクリーンリーダーで確認する

制作したウェブサイトが、「画面を見ずにスクリーンリーダーで操作でき、理解できるか」を確認してください。

最も手軽に利用できるスクリーンリーダーとして、iPhoneに搭載されているVoiceOverや、AndroidのTalkBackなどを上げておきます。

処方箋3. スマートフォンでのズーム操作を無効にしない

具体的には、 <meta name=viewport> において user-scalable=no のような指定をしないでください。

処方箋4. 動画にキャプションを付ける

YouTube動画を掲載している候補が多いようです。YouTubeには便利な字幕制作機能がありますので、それを利用してください。3

おわりに

各候補者におかれましては、以上の問題がある場合、なるべく早く修正されることを期待しております。

みんながアクセスしやすいウェブサイトを!

アクセス(歌手)

なお、ご質問があればできるかぎり対応しますので、お気軽にお問い合わせください。

情報建築家からは以上です。

  1. これを専門的には「アクセシビリティ水準」と言い、日本工業規格(JIS)でも標準化されています。詳しくはウェブアクセシビリティ基盤委員会(WAIC)のウェブサイトなどをご覧ください。

  2. 例えば、ソフトバンクモバイルはiPhoneの操作に関して「よくある質問」コーナーで「表示する画面の文字サイズを大きくすることはできますか?」というコンテンツを提供しています。

  3. 詳しくはYouTubeヘルプの「字幕を追加するには」をご参照ください。