はじめに：チャコウェブラジオと今回のテーマ
こんにちは。チャコウェブラジオは、株式会社Cyber Catsが運営するチャコウェブのスタッフが、ウェブアクセシビリティを実践したい制作者やウェブ担当者に向けて、ゆっくりじっくり解説していくポッドキャストです。
進行を担当するゆみこです。よろしくお願いします。
みやです。よろしくお願いします。
今回は、アクセシビリティに関する雑談会です。
テーマを一つ取り上げて、アクセシビリティについて考えたことや感じたことなどを自由にお話ししていきます。
はい、お願いします。
今回のテーマは、キャプチャーとウェブアクセシビリティです。
キャプチャーというのは、フォームとかの送信を行おうとしているのが人間なのか、スパム送信をするプログラムなのかといった判断をしてくれるものです。
これはとても便利なツールなんですが、キャプチャーのアクセシビリティにはさまざまな課題もあるので、今回はそれについてお話ししていきたいと思います。
CAPTCHAの現状とアクセシビリティの課題
はい、キャプチャーでいうと、やっぱり今一番有名なのがGoogleのリキャプチャーかなと思うんですが。
そうですね。いくつか今有名なのがありますよね。
そうですね。
例えば、フォームを送信しようとしたら、自転車を選んでくださいみたいな。
そうですね。画像が出てきて選ぶっていうものと。
あともう一つは、特に何もしなくていいんですが、ページの隅っこですね、右端に水色と青の回転しているようなマークがついている。
これがGoogleリキャプチャーが入ってますよという表示のものですね。
最新のものとかだと、マウスの動きとかを見て自動的に判断してくれて、これはプログラムじゃなくて人間だなと思ったらそのままフォーム送信とかができて、これはプログラムだなと思ったらブロックしてくれるみたいな形だと思うんですが、
特に何か入力とかを求められるものっていうのは、プログラムではなくて人間でもなぜかうまくいかなくてブロックされちゃうみたいなのがやっぱりあるんですよね。
ありますね、いっぱい。
例えばですけど、写真が9枚ぐらい出てきて、この中で自転車を選んでくださいって言われて、自転車が写ってるものをポチポチポチって選んでやっていけば通れるはずなんですけど、何かしら例えば1枚自転車を見逃しちゃったとか、
あとは自転車が何枚かの画像にまたがって写ってて、1枚選び忘れちゃったみたいなのがありますよね。
これ自転車だけじゃなくて、消火栓だったりとか信号機だったりいろんなバージョンあると思うんですけど、これで失敗しちゃって送ろうと思ったのに送れなくて、あれ、送れなかったみたいなことって、
多分そういうお問い合わせフォームとかを送ったことある方で、1回ぐらいは経験したことあるんじゃないかなって思うんですね。
すごくあると思いますね。画像の認証と、あとは文字を入れてくださいというタイプもありますよね。
ありますね。歪んでる、ちょっと読みにくい文字があって、みたいなやつですね。それを見て写って、正しければそこを越えてお問い合わせができるみたいな。
あれはツールとしては、やっぱりとっても便利なんですよね。
そうですね。
あれがあるとないで、迷惑メールと言いますか、スパムのお問い合わせ、なんかよくわからないけど英語の文字が送られてきたみたいなのって、私たちもお客様からいっぱいご相談いただくと思うんですよ。
いただいてます。
なんかわかんないけど、昨日から100件ぐらい来てて、どうしたらいいですか?みたいな。それをキャプチャー、特にそういったGoogleのリキャプチャーだとかを導入すると、もう全然大丈夫になりましたってなるじゃないですか。
ツールとしてはとても優秀で、もうぜひ入れた方がいいんじゃないかなっていうような便利なもの。
なんですけど、アクセシビリティって観点で見ると、やっぱりちょっとそうやって、色がちょっと見えにくかったりとか、細かい操作が苦手でとか、あと例えばなんですけど、外国の方が日本に来てとか、日本語勉強中でっていう方は、ゆがんだひらがなが読みにくかったりとか。
そうですね。
逆にアルファベットでも、Pなのか、Qなのか、何なのかとかあるじゃないですか。
すごくあります。数字なのか、アルファベットなのかもわからないとき。
あと、大文字なのか小文字なのかとかもありますよね。
ありますね。
大文字のIなのか、小文字のLなのかみたいな。
そういうちょっと判断に迷うっていうのが、やっぱり判断に迷うからこそ、そういったプログラムをブロックできるとは思うんですけど、そういう判断が必要になるからこそ、なかなか通り抜けられないっていう場面もあったりとか、そこを超えられないっていう方もいらっしゃったりするっていうのがアクセシビリティとしての問題なんですよね。
そうなんですよね。もう、プログラムを通さないようにするっていう目的があるんですが、人間も失敗しやすいという問題もありますよね。
WCAGの考え方と音声CAPTCHAの課題
そうですね。で、やっぱり、何回やってもできないとかってなると、お問い合わせやめちゃったりとかで、ちょっとコンバージョンが下がるというか、お問い合わせがきづらくなるみたいなデータもあったりしますよね。
ありますね。
そういうところで、やっぱりこれはWCAGでも、ちゃんとキャプチャを使ってはいけないとは書かれてないんですけど、使うのであれば、例えばキャプチャでお問い合わせが難しいよっていう人のために電話番号を書いておいて、お問い合わせフォーム使うのが難しかったら電話でもお問い合わせできますよみたいな別の方法を用意しておくとか、そういうのが必要だよねっていうふうには書かれていて、
で、そもそもアクセシビリティに問題があるものなら、じゃあこのキャプチャ使っちゃダメですよってやった方が話が早いんじゃないかなって思われる方もいらっしゃると思うんですけど、その話WCAGに書いてあって、何かっていうと、キャプチャが要はすごく便利なもので世界中で使われていると。
なので、キャプチャはアクセシビリティ上良くないから使っちゃダメって禁止しちゃうと、人々はキャプチャを使わずにアクセシビリティを高める方法を考えてとかではなくて、アクセシビリティでは諦めてキャプチャを使う方に走ってしまうんじゃないかなっていうのがあるので、キャプチャは許容しますよみたいな話が書かれてるんですね。やっぱりそれぐらい便利なツールではあるんですよね。
そういうことですよね。キャプチャは使った上でアクセシビリティのことも考えてねっていうことですね。
例えばそういった歪んだ文字とか、ちょっと読みにくい文字があったりとか、あとは信号機選んでくださいみたいなのは視覚的なキャプチャだと思うんですけど、例えば視覚的に何か障害があったりとかで、そういったキャプチャを使うのが難しい場合、音声のキャプチャとかもあったりして、そっちに切り替えると、なんかザザザってノイズの中、言葉が喋られるんですよね。
アルファベットとか数字とかが喋られたり。
はい、ありますね。
で、その聞こえたものを打つっていうのがあったりするんですけど、これもやっぱりフォーム送信したりとか、そういうのを何かしらしようとしてる方の状態によっては、すごい使いづらくなってしまう。聞こえなかったりとか。もしかしたら人が多いところでお問い合わせしようとしてる可能性とかもあるじゃないですか。
そうですね。
ただでさえザワザワしてるのに、キャプチャもザワザワしてて、何が言ってるのか聞こえないみたいな。
そういうのを考えると、なかなかアクセシビリティとの両立って難しいなっていうところではあるんですよね。
操作不要型CAPTCHAの登場と利便性向上
ただ最近、最新のリキャプチャとかだと、いわゆるあなた人間ですかっていうチェックボックスが出てきたりとか、そういう何か信号機を選んでくださいっていう操作とかをしなくてもいいってものも出てきたりしていて。
これはリキャプチャもですけど、クラウドフレアのターンスタイルっていうのも、もう完全にプログラム側と言いますか、なんて言うんでしょう。
そのサイトの奥、ユーザーから見えないところでユーザーの動きを見て、これは人間だな、人間じゃないなって判断して、人間じゃなければブロックっていうのをしてくれるっていうのもあるので。
そうですね。
それはやっぱりアクセシビリティの面でもいいですし、お問い合わせフォームとして使いやすくなりますよね。煩わしさがなくなるというか。
そうですね。この画像を選んでくださいとかはチャレンジって言いますが、チャレンジのひと手間があると、やっぱり失敗することもありますし、送信の確率が減ってしまうので、
できるだけそこの手間を取らずに送信を達成するかつ、セキュリティも守るという新しいキャプチャーが出てきてるっていうところですよね。
はい。それで言うと、今リキャプチャー、Googleのものの有料化とかもいろいろ決まったりとか、ちょっと移り変わってる時期じゃないですか。
そうですね。
チャコウェブも最近リキャプチャー、今まで使ってたのがターンスタイルに変わってる、そうやって変えてるサイトとかもいろいろあったりして、
アクセシビリティとかも考えるとこっちの方がいいのかなってなると、変えるっていうのもひとつの手だなっていうのは、なんか最近いろいろなサイト見てても思いますね。
チャコウェブのおすすめ：クラウドフレア ターンスタイル
そうなんですよね。特にチャコウェブでは最近Googleのリキャプチャーが挑戦の数によっては有料化というのが始まってしまったので、
今代わりにクラウドフレアのターンスタイルというキャプチャーのシステムをお勧めしているんですが、
こちらは先ほどミヤさんに実験もしていただいたんですが、スクリーンリーダーですね。
画面の読み上げソフトでクラウドフレアターンスタイルが入っているページを読み上げてもらった時に、特に操作上は全然問題なくフォームまで到達できるというのが実験でも結果が出ました。
はい。自動的にお問い合わせフォームとかのターンスタイルが入っているページに行くと、そこから判定が始まるじゃないですか、これ。
で、ぐるぐるぐるって回って、成功すると成功しましたとか出るんですけど、ちゃんとそれもターンスタイル成功しましたと教えてくれるので、
今成功したんだなっていうのがわかりますし、あと何かそこで別に邪魔になるっていうのもないですし、でちゃんとプライバシーポリシーとかも表示されてるんですけど、ターンスタイルのとこに。
それもちゃんと読み上げてくれるので、すごいわかりやすかったですね。
すごいいいですよね。なので、これからセキュリティ的にはキャプチャーという仕組みは入れた方がいいなと私は思っていて、とはいえアクセシビリティの面からも、あとは使い勝手の面からもですね、やっぱりどういったキャプチャーを使うかっていう選び方が問題かなと思います。
その通りだと思います。
そうですね。その中で今私たちがお勧めしているのが、特に何か売ってくれと言われてるわけではないんですが、クラウドフレアのターンスタイルは今のところ使いやすいかなと思っているので、何か迷われている方はそちらをちょっと一旦考えてみてもいいのかなと思います。
はい。
まとめと今後の展望
はい。では今日はこんなところですかね。
はい。ありがとうございます。
はい。お聞きいただきありがとうございました。感想をいただけるととっても嬉しいです。
ハッシュタグチャコウェブラジオをつけてぜひXで投稿してください。
また概要欄にメールフォームリンクをご用意しています。
ウェブアクセシビリティに対応したい方、チャコウェブにお仕事を依頼したい方やご相談がある方はお気軽にメッセージをお寄せください。
次回もお楽しみに。