▶ を押すと文が増えます
まなキキのwebページ制作裏話
今の形のまなキキを作り上げるまでには、主に3つの点で「大変だー！」と思ったことがありました。まず、今回はそのうちの1つをお話します。
ルビ（ふりがな）とスクリーンリーダーの仲の悪さ
まなキキには、ルビ（ふりがな）のある・なしを切り替えられるボタンがついています。みなさんがよく見るサイトには、ついていないことが多いかもしれませんね。ひらがなのみで書かれているページだったり、漢字の後ろに（）をつけて、その中にふりがなが書いてあったりしている場合が多いのではないかな？と思います。もしくは、ふりがなが全くなくて、「もっと知りたい！」と思っても、漢字が難しくて読めなかった……と悲しい想いをしたみんなもいたかもしれませんね。
まなキキを作っている私たちは、まず、こういう悲しい想いをみんなにして欲しくない！と考えました。
そして、どうやってふりがなを振ればみんなが読みやすいサイトになるかを考えました。
そこで考えたのが、「ふりがなボタン」だったんですよね。
今、ITの知識なしで、Webサイトにふりがなをつけようとすると
(1)すべてひらがなのみで書く（ふりがなをつけないで解決する）
(2)漢字の後ろに（）をつけてその中にふりがなを振る
という方法がよく使われています。これらの方法を使えば、ちょっと頑張ってふりがなボタンをつける必要はありませんでした。
でも、「全部ひらがなで書かれるとかえって読みにくい！」「漢字の読み方を（）で表現すると、画面が文字ばかりになって見にくくなってしまう。」「ふりがながあったほうが良いと思う人もいれば、いらないと思う人もいるよ。」という意見もあります。
そこで、まなキキでは、漢字の読み方を知りたいと思ったときに、漢字の上にふりがなを出せるように、「ふりがなボタン」という機能をつけることにしたのでした。
このボタンをつくって、ホッとしていた私たちでしたが、実はこれが長い闘いの始まりだったのです……。
いやー。よかったよかった。これで、みんながサイトを読みやすくなるねえ。
あの……。実はなんですが、VoiceOverで読み上げると、読み方がおかしくなってしまうんですよね。まなキキのページに入ったときに、漢字と送り仮名を別々に読んじゃってるみたいなんです。例えば、『楽しい学び』って言葉なんですけどね……。おーい！VoiceOverさーん。ちょっと読み上げてみてー。
「らく、しい、がく、び」
で、ふりがなボタンをオンにしたら治るのかな？と思ってオンにしてみたんですけどね…。おーい、VoiceOverさん、また読み上げてみてー。
「たの、らく、しい、まな、がく、び」
ここで我々、衝撃のあまり沈黙する…。しばらく経ったのちに、H松が重い口を開く。
なんじゃこりゃあああ！！え、なんでだろう？ふりがなボタンができる前は、ちゃんと読み上げてたのに。もうさ、うちのサイト読むときには、VoiceOver使うなってするか。
えー困ります！だって、VoiceOverは、iPhone使っている子どもたちが使えるものだし、使ってる人も多いと思うんですよ！
うーーん、そしたら！よし、ふりがなを（）で表記じゃ！
いや、そしたらふりがなボタンつけた意味なくなりますよね？
そうだった。てか、なんでそもそも、ふりがなボタンつけたらおかしくなったんだろ？調べてみるかー。
調べてみたんだけど、相性が悪いっていってるサイトしか見つからないですね。
えー！そんな。だったらなんで、今まで誰も騒がなかったんだろう。
ふりがなついてるサイトがそもそも少ないからかもしれないですね。それに、私たち、視覚障害者の方はこちらって、専用のページを設けてもらうことも多いですから。
そっかあ。みんなが同じページを読む、っていう考えのサイトが実はそんなになかったんだねえ。でも、別のページに誘導されたら、「同じページを読みたいんだけどなあ……」って思うこともありそうだよね。ふりがなをふると、これだけ読み方がぎこちなくなるから、別のページを用意して、それを読んでもらうというのは、解決方法としては速いと思うんだけど…。
でも、それをどうにか実現しないと。事情があってもなくても学びやすい学びを考えているまなキキが、それやらなくてどうするんですか？
そうですよ！でも、私、PCトーカーとVoiceOverがなんでこんなにも読み上げ方違うのかも気になってきちゃった。iPhoneって、アクセシビリティについてはちゃんと考えているイメージだったし……。
ですなあ……。謎は深まるばかり……が、それを調べて、こうじゃない？と社会に対して提案をしていくのが学者の仕事……
あれ？H松さん、修士号もってないですよね？
（N川さん、それを言っちゃあ、おしまいよお……。）ごほん。学者を目指す私の仕事！ってことで。ちょっと調べてみますわ……
そういえば、アクセシビリティの規格（つかいやすいサイトを作るルール）ってどうなってるんですかね。
おーー！カチカチカチカチ……。（キーボードを叩く音）あ！アクセシビリティの世界基準に、ルビについての細かい約束がない！それに、どんなふうにその文字を読み上げるかっていうことで、発音のルールの中にルビについての注意が書いてあるんだけど…。ここで言われている発音と、私たちが「ふりがな」って思っている発音がなんだかちょっと違っていそう…。それに、「スクリーンリーダーでルビを読み込んだときには、間違った読み方をしたあとに正しい読み方で読み上げられます」って書いてあるなあ。
む？ちょっと待って下さいね。つまり、VoiceOverが漢字の読みとふりがなの両方を読んでしまうっていう今の状況は、アクセシビリティの基準としては問題ないってことになりますか？
うーん、それが耳心地としていいかどうか？って大問題に思うけど、事実としては、今はそういう対応でも「ルールを守ってます。ちゃんと対応してます。」と言えてしまうということになるねえ。
でも、不思議ですよね。アクセシビリティのルールを考えた人の中に、私みたいにスクリーンリーダーでサイトを読む人ってたくさんいらっしゃったんじゃないかなって思うと。今のまなキキみたいに、漢字が出てくるたびに、VoiceOverが自動的に読んだ読み方と、記事を書いた人がふったふりがなが読まれてしまうって、相当、耳心地悪かったと思うんですよ。
そうだよね…。これは完全に私の妄想かもしれないんだけどさ、やっぱり、英語の発音を訂正することと、漢字の読み方を指定することは実は違うことなのに、「同じなのかな？」と思ってルールを考えてしまったんじゃないか？と思うんだよね。英語には、全部の単語にふりがなをつける必要性があるっていう考えがないだろうし。
漢字って、英語にはないですもんね。
もしかして、PCトーカーは日本の会社がつくったソフトだから漢字の読みが元々スムーズ。でも、VoiceOverは日本語に対応したのが最近だし、ベースになっているのが英語だから、ちょっと読みが拙いってのはあるのかもしれないですね。
ああ！英語は音を表す表音文字ですけど。漢字って、考えてみると、意味を表す表意文字ですもんね。それぞれ、読み方がたくさんありますよね。言語の違いも、読み上げのなめらかさに関わってきそう。
とはいえ、この状況でなんとか改善しないといけないんですよね？どうしようかな。
例えばですが、スクリーンリーダーにルビの情報だけを読ませるってことはできたりします？
漢字を無視して、ひらがなを読んでね！ってやれたら解決かも。やってる人いないのかな？
う～ん、調べた限りでは、「こんな風に読ませたいんだ！」ってひらがなで書き換えたページを別につくって、それを読ませるって 方法しかないなあ。
え、それってつまり、スクリーンリーダーは専用のページにってことか。
う～ん、それは……。記事を書くたびに、専用のページも増やすって大変ですよ……。
もしかして私たち、けっこう新しいことをしようとしている？？
なんか、ドキドキしてきました。
よし！この、ルビとスクリーンリーダーの仲が悪いって問題、私がなんとか考えよう！！
神様仏様、えすとれ先輩様……
次回に続く！！お楽しみに
あらま。ここにマニアックなコーナーがあるって、見つかってしまいましたね。えすとれ先輩は、津田塾大学で情報科学を学ばれて、インターネットの仕組みとか、ウェブサイトのつくり方に詳しい、「その道のプロ」ですから、今回の記事は実は、もっともっと詳しいことを語りたいなとウズウズされてたんじゃないですか？？
ですねー。実はこの連載記事、ちょっとマニアックにWebの技術についてもみんなに語りたいなって思ってたりします。
ということで、ちょっと難しい話かもしれないけれど、Webについて詳しく知って、「Webマスター」を目指すコーナーをつくってみました！
それって、H松さんがポケモンの要素を無理やりいれたいからじゃないんですか？
ごほん！！はい。ということで、今回は記事の中でお話をした、「Webサイトのアクセシビリティの基準」についてちょっとマニアックなご紹介をしたいと思います。紹介するサイトは、漢字がちょっと多いので、読み方が分からない部分は周りの人に読み方を聞いてみてくださいね。
ところで、みなさん、情報アクセシビリティってどういう意味か知っていますか？記事の中でも、少し語りましたが、「だれでも、同じ情報を受け取ることができること」のことです。では、どんなことをすれば、アクセシビリティのよいサイトを作ることができるのでしょうか？こういうことをするといいよ、というルールがあると便利ですよね？と、いうことで。アクセシビリティには、世界中の国でWebサイトを作る仕事をしている人たちが参考にしている「WCAG」というアクセシビリティの世界基準があります。（ワールド・ワイド・ウェブ・コンソーシアムという団体が基準を作っています）
そして、そのルールを参考にして日本の決まりとしたものが、JIS規格（高齢者・障害者等配慮設計指針－情報通信における機器，ソフトウェア及びサービス－第3部：ウェブコンテンツ）なんですよね。
どんなことが書いてあるのかは、漢字がたくさんあるページでちょっとチャレンジングかもしれませんが、下のリンクからのぞけますよ！
高齢者・障害者等配慮設計指針－情報通信における機器，ソフトウェア及びサービス－第3部：ウェブコンテンツ（ウェブアクセシビリティ基盤委員会）
なにげなく使っている、インターネットのページにも、使いやすさを考えるルールがあるんですねえ…。ふりがなとスクリーンリーダーの仲をもっとよくするようなルールが、もっと考えられるといいなあ。
（実は、この記事を作っている間の6月9日に、アクセシビリティの世界基準を作っている団体さんが「日本語のルビのアクセシビリティを考えよう！」とルールの案を発表しました！ふりがなとスクリーンリーダーの仲を良くしたいという私たちの願い、これからドンドンかなっていくかもしれません。）