Smart Communication Design Company
ホーム > ナレッジ > Blog > アクセシビリティBlog > 2009年3月 > 「辻ちゃん・ウエちゃんのアクセシビリティPodcast」第26回

アクセシビリティBlog

Webサイトのアクセシビリティを高めるための方法や国内外の関連情報など、さまざまな角度からWebアクセシビリティに関する話題をご提供していきたいと思います。

当Blogの更新情報は、Twitter経由でも配信しています。興味のある方はぜひ、@mlca11yをフォローしてください。当Blogへのご意見・ご質問は、Twitter経由でも受け付けております。

2009年3月31日

「辻ちゃん・ウエちゃんのアクセシビリティPodcast」第26回

アクセシビリティ・エンジニア 中村

アクセシビリティPodcast 第26回をお届けいたします。今回のPodcastは辻ちゃん・ウエちゃんがリスナーからいただいた質問にお答えする、「Listener's Voice」をお送りします。どうぞお楽しみください。

概要

第26回では以下の内容についてお送りいたします。

フレームの使用について
音声読み上げ環境でのフレーム、インラインフレームの読み上げられ方

なお、話題にあがっているサイトなどのリンク先につきましては、「全文を読む」のリンクよりテキスト化された内容でご確認ください。

聴取方法のご案内

ブラウザ上で再生される方は、下記のFlash Playerをご利用ください。

ダウンロードしてその他のプレイヤーで再生される方は、ダウンロードボタンよりmp3ファイルをダウンロードの上、ご利用ください。

音声がご利用いただけない環境の方には、本エントリーの最後にテキスト化された内容を提供いたしております。

また、iTunesなどRSS対応のソフトウェアをご利用の方には、辻ちゃん・ウエちゃんのアクセシビリティPodcast用RSSも提供いたしております。

なお、ご意見、ご感想などございましたら、当エントリーのコメント入力フォームよりお寄せください。たくさんのご意見をお待ちいたしております。

それでは、どうぞお楽しみください!


「辻ちゃん・ウエちゃんのアクセシビリティPodcast」第26回MP3ファイルのダウンロード

「辻ちゃん・ウエちゃんのアクセシビリティPodcast」第26回 テキスト

植木、辻(以下、二人):
辻ちゃん、ウエちゃんのアクセシビリティPodcast 2009!いぇーい
辻勝利(以下、辻)
はい、ということで、第26回目となりましたアクセシビリティPodcast、本日もミツエーリンクスのスタジオからお届けしてまいります。わたしは、辻ちゃんこと、ミツエーリンクスの辻勝利です。そして!
植木真(以下、ウ)
えー、ウエちゃんこと、インフォアクシアの植木です。さらにそして!
辻:
はい、今回から、あの、アシスタントとして、
ウ:
うん、
辻:
もうひとりブースに入っていただいてます。自己紹介お願いできますか?
中村浩佳(以下、ヒ)
はい。はじめまして。同じくミツエーリンクスのアクセシビリティ・エンジニアの、中村浩佳です。よろしくお願いします。
辻:
はい、よろしくお願いします。
ウ:
女性が加わりましたね。
辻:
はい、えー、ということで、今回Listener's Voiceなんですけど、
ウ:
じゃ、まず、さしあたって、
辻:
そうですね、
ウ:
浩佳さんのニックネームを決めなきゃいけないと思うんですけど、
辻:
ああ、そうですね。なにがいいですかね。
ヒ:
ええ、じゃあそうですね、じゃあ、浩佳のヒロをとってヒロちゃんなんてどうでしょうか。
辻:
ああ、いいですね。じゃあヒロちゃんということで、
ウ:
はい、辻ちゃん、ウエちゃん、
二人:
ヒロちゃん、
辻:
はい、
ウ:
了解です。
辻:
ええ、リスナーの皆さんにも、ぜひ覚えていただいてですね。
ウ:
はい。
辻:
はい。で、まず、えーと、ヒロちゃんなんですが、さっき「はじめまして」ってこう自己紹介してくれたんですけど、
ウ:
うん。
辻:
実はこのアクセシビリティPodcastにはけっこう昔から、昔からってそんな長くやってないですけど、あの、かかわってくれてまして。
ウ:
そそ、いっつもね、収録前に打ち合わせするんだけど、辻ちゃんが、つまんないダジャレを言うたんびにね、一個一個丁寧にひろってくれるんだよね。
ヒ:
いつも楽しませていただいています(笑)
辻:
ああ、恐縮です。じゃなくてですね!
ウ:
最近でもね、
辻:
はい、
ウ:
ちょっと、僕以上にこう、辻ちゃんへの当たりが厳しくなりつつあるんですよね。
ヒ:
(笑)
辻:
そうなんですよね。
ヒ:
いやいや(笑)
ウ:
まあ、それは自然のなりゆきっていうことで、
辻:
ええ、
ウ:
はい、
辻:
じゃあなくてですね、
ウ:
うん、
辻:
あのー、ええと、字幕の作成ですとか、
ウ:
うん、
辻:
あのー、Blogエントリーの作成なんか、けっこうやっていただいているんですよ。
ウ:
うん、
ヒ:
そうですね、いまあの、字幕作成はほかの部署のかたに、あの、お願いしているんですけれど、たとえば字幕の…、できあがった字幕の確認とか、Podcastのエントリーなんかはわたしが書いてます。
ウ:
ありがとうございます。
辻:
で、実はですね、
ウ:
うん、
辻:
うちのチームには、昨年この Podcastにも出てくれた、キー坊、あの、中村精親さんと、
ウ:
うん、
辻:
まあ、今回出てくれてるヒロちゃん、あの、中村浩佳さんの、ふたりの中村さんがいるんですね。
ウ:
うん、
辻:
なので、こう、Blogエントリーを見ただけでは、あの、もしかしたらリスナーのかたはどっちの中村さんが書いているのかわからないかもしれないんですが、ぜひ文脈などからひろっていただいてですね、「あ、これはヒロちゃんの文章だ」とかですね、「あ、これはキー坊だ」とか、読んでいただけたらなと思ってます。で、えー、今回は、あの、Listener's Voiceをお届けしていこうと思うんですが、
ウ:
はい、じゃあさっそく、今回の質問を、
辻:
あ、そうですね、ヒロちゃんに、
ウ:
読んでいただきましょうかね。
二人:
はい。
Listener's Voice!
辻:
はい、では、ヒロちゃん、えー、今日いただいた質問を紹介していただけますか?
ヒ:
はい、ええと、今日は、あの、ミツエーリンクスの社内から出た質問なんですが、
辻:
ああ、なるほど、
ヒ:
はい、では、紹介させていただきます。
二人:
はい。
ヒ:
えー、ときどき、アクセシビリティ対応としてフレームを使わないことが望ましいという話を聞きますが、
辻:
うん。
ヒ:
実際のところ、フレームは音声読み上げ環境で、どう読まれるのでしょうか。
ウ:
うん。
ヒ:
本当にフレームは使わないほうがいいのでしょうか。という質問なんですが、
ウ:
うん。
辻:
なるほど。まあ、けっこう、こう、そんなふうに書いてある、こう、Webサイトとか見たことありますね、確かに。
ウ:
まあ、そういうガイドラインもあるしね。
辻:
はい。
ウ:
JISなんかでも、使わないことが望ましい、
辻:
うん。
ウ:
とは言ってますけど、まあ、使う場合はこういうふうにしましょうね、という、
辻:
はいはいはい。
ウ:
感じなんですけどね。
辻:
けっこうそれが、あの、ひとり歩きしちゃってるようなケースってあったりしますよね。
ウ:
フレームは禁止、みたいな。
辻:
うん、
ウ:
とらえ方されてる部分がありますよね。
辻:
はい。
ウ:
うん。
辻:
で、実際は、
ウ:
うん、
辻:
あの、今日は音声を聞いてもらおうと思って、いくつか持ってきてみたんですが、
ウ:
ほう、今回はどのスクリーンリーダーを、
辻:
はい、今回試したのはですね、
ウ:
うん、
辻:
PC-Talkerと、
ウ:
うん、
辻:
FocusTalkと、
ウ:
うん、
辻:
えー、JAWSと、NVDAなんですけど、まあ、全部さすがに紹介すると時間がなくなってしまうので、
ウ:
うん、
辻:
じゃあ、まず、PC-Talkerの音声をちょっと聞いていただきましょうか。
ウ:
そうだね。一番シェアも高いみたいだしね。
辻:
はい。
ウ:
はい。
PC-Talker:
ウェブアクセシビリティ インク サービス ニュース 会社案内 わたしたちについて ウェブアクセシビリティ インク は アクセシブルなウェブサイトの構築を行う ウェブソリューションカンパニーです
ヒ:
えー、ちゃんと、読んでますよね。
辻:
そうですね。あの、まあ、ちゃんと読めるんですけど、ええと、スクリーンリーダーを使っている場合に問題になるのは、フレームとフレームの間を移動するコマンドを覚えなきゃいけないというような問題は確かにありますね。
ウ:
うん。あと、フレームがこう、更新されたりすると、
辻:
はい、
ウ:
それに気づけなかったりもするんじゃない?
辻:
あー、確かにそうかもしれないですね。
ウ:
うん。
辻:
で、今度はですね、
ウ:
うん。
辻:
ええと、JAWS 9を使って、
ウ:
ほう、
辻:
実際にフレームを読んでみようと思うんですが、
二人:
はい、
辻:
インターネットエクスプローラーを立ち上げます。
JAWS:
ウィンドウズインターネットエクスプローラー ページに4フレーム てん 3個の見出し てん 6個のリンクがあります
辻:
まあ、このJAWSのおなじみの音声、あの、ええと、ページを読み込んだ直後に、どんなページなのかという情報を読んでくれてますが、
ウ:
うん、
辻:
4つフレームがあるということをまず、
ウ:
ほうほう、
辻:
読んでくれてますね。
ウ:
これはJAWSだけ?
辻:
そうですね。
ウ:
ふんふん。
辻:
はい。これ、少し、まあ、読んでいきますと、
ウ:
はい。
JAWS:
ウェブアクセシビリティ インク ピリオド トップフレーム フレーム 見出しレベル1 画像 ウェブアクセシビリティ インク ピリオド トップフレーム フレーム 終了 レフトフレーム フレーム レフトフレーム
辻:
こんな感じでですね、
ウ:
うん。
辻:
あの、フレームのあるページでも問題なく読んでいくことができます。
ウ:
ほう。
辻:
で、さらにこのJAWSのおもしろい機能はですね、
ウ:
うん。
辻:
たとえば、
JAWS:
サービス リンク
辻:
この「サービス」というリンクをですね、
ウ:
うん。
辻:
開きますと、
JAWS:
フレーム3 メインフレーム 変更
辻:
こんな感じで、
ウ:
ほうー、
辻:
フレーム3 メインフレーム 変更 というふうに、こう、通知があるんですね。
ウ:
ふんふんふん。
辻:
だから、どこのフレームが変わったか、というのがわかるようになってます。
ウ:
あ、なるほどね。
辻:
で、実際に、このフレーム3に行くには、あの、Mキーを押して、こうフレームを1個ずつ移動していくことができるんですけど、
ウ:
うん。
JAWS:
メインフレーム フレーム 見出しレベル2 サービス紹介
辻:
こんな感じで、あの、さっき開いたサービスのページが読み上げられるというようになってます。
ウ:
ほほう。
ヒ:
あの、JAWSにはこの機能って前からあったんですか?
辻:
ええと、この機能がついたのは、JAWS 9からなんですよね。
ウ:
あ、そうなんだ。
辻:
はい。で、あの、けっこうGmailとか、
ウ:
うん、
辻:
あと、Windows Updateのページにも、このフレームが多用されてたりするんですけども、
ウ:
ふんふん。
辻:
そういったページでも使いやすくなりましたね。
ウ:
うーん。じゃあ、別にフレームを使っているからといって、必ずしも、読み上げで聞いててわからないとか、というわけでもない?
辻:
と、思います。はい。
ウ:
うん。
辻:
むしろ、その情報がうまく整理されてれば、そのフレーム…、それぞれのフレームで、ですね、
ウ:
うん。
情報がうまく整理されてれば、あの、僕なんかは、使いやすいんじゃないかな、と思うこともあるんですけども。
ウ:
まあ確かにね、あの、ちゃんとこのフレームには何が表示されてるって一貫性があれば、逆にむしろ使いやすいっていう人もいるよね。
辻:
はい、
ウ:
はい、で、このフレームなんですけど、音声読み上げだけが、こう、注目されがちなんだけど、
辻:
はい。
ウ:
もっとほかにも問題があるじゃないですか。
辻:
ああ、たとえば?
ウ:
たとえば、検索エンジンから、こう、入ってきたユーザーが、そのフレームの一部のページだけにアクセスしてしまって、
辻:
はいはいはいはい、
ウ:
こう、メニューのフレームがでてこないとかね。
辻:
あ、戻れなくなっちゃったり?
ウ:
うん、もう、その1個のフレームしか表示されないんで、
辻:
はい、
ウ:
本当はメニューのフレームとセットになって出てくるべきなんだけども、
辻:
はい。
ウ:
検索エンジンから、その1個のフレームにダイレクトに入ってきちゃうんで、
辻:
なるほどー。
ウ:
ナビゲーションが使えなかったりとかですね、
辻:
はい、
ウ:
そんなのがありますよね。
辻:
はい、
ウ:
うん。
ヒ:
あと、フレームのページで、別のページを開いても、あの、基本的にページのアドレスは変わらないので、
ウ:
うん、
辻:
はい、
ヒ:
あの、ブックマークしたときに、次にブックマークを開いても、同じ情報がすぐに見つからない、なんて問題もありますよね。
ウ:
そうだね。
辻:
確かにそうですね。
ウ:
うん、まあ、だから、アクセシビリティというよりは、そういういろんなトータルで考えてフレーム使わない、という傾向が、もう最近では定着してきてるかな、とは思うんですけど、
辻:
うん、
ウ:
まあ、一応フレームに関しては、きちんと、
辻:
まあ、そうですね
ウ:
ね。
辻:
まあ、スクリーンリーダーではフレームは読めないんじゃないかっていう誤解だけは解いておきたいですよね。
ウ:
うん。
辻:
はい。ええ、ではヒロちゃん、ええと、次の質問をご紹介いただけますか。
ヒ:
はい。さきほどの、フレームに関連した質問なんですが、インラインフレームはどのように読まれますか?という質問です。
ウ:
うん
辻:
なるほど。うーん。これはですね、基本的には、ほかのフレームと同じように読み上げられます。
ウ:
あの、いわゆるフレームと、インラインフレームの違いっていうのは、わかるものなの?
辻:
いや、違いはおそらくわからないのではないかなと思うんですが、
ウ:
うん、じゃああれ?どのスクリーンリーダーでも同じような感じで読んではくれるの?
辻:
あ、そうですね。
ウ:
うん。
辻:
あの、ただ、JAWSにはですね、
ウ:
うん、
辻:
あの、インラインフレームを読まなくするという設定が実はあるんですよ。
ウ:
ほう。
辻:
その設定をしてると、あの、インラインフレームで表示されている情報が読めないユーザーも出てくる可能性があるので、注意が必要ですね。
ヒ:
あの、そもそもなぜ、インラインフレームの内容を読まなくなる、こう、設定があるんでしょうか?
辻:
ええと、おそらくインラインフレームで広告を出したりとかするページってありますよね。で、そういったものへの対応だと思うんですけども。
ウ:
うーん、なるほど。まあ、よくね、インラインフレームっていうと、広告もそうだけど、あと、更新情報とか、お知らせみたいな情報をインラインフレームで表示しているサイトをたまに見かけるけど、
辻:
はい
ウ:
そういう意味では、ね、インラインフレームを使うと、一部のユーザーには実は届いてなかったり、ってことがあり得るってことだね。
辻:
そうですね、まあ、
ウ:
うん。
辻:
ええと、あり得るかもしれない、っていうことで、
ウ:
うん
辻:
利用する際は注意していただきたいな、と思いますが。
ウ:
なるほど。まあ、じゃあ、フレーム、インラインフレーム、共に使うときには、まずtitle属性でちゃんとフレームの役割というのを書いて、
辻:
はい。
ウ:
で、フレームの中に表示するHTMLのページタイトルをちゃんと書いておくと。
辻:
そうですね。
ウ:
ガイドラインに書いてあることは、最低限、きちっとやりましょうと。
辻:
はい、
ウ:
そうすれば、スクリーンリーダーでもちゃんと読み上げてくれますよ、と。
辻:
はい、
ウ:
いうことですね。
辻:
はい。
ウ:
はい。
辻:
ということでですね、えー、フレームに関して、えー、今日はお伝えしてきたわけなんですが、今日のフレームに関する質問への答えとなりますでしょうか。
ヒ:
はい、大丈夫です。
辻:
はい。
ヒ:
ありがとうございます。
辻:
はい。
ヒ:
ということで、アクセシビリティPodcast、本日も、ミツエーリンクスのスタジオからお届けしてきました。
二人:
はい。
辻:
ええ、いかがでしたかヒロちゃん、あの、本日出演いただいて。
ヒ:
はい(笑)。すごい緊張しました。やっぱりいつも聞いていたり字幕を書いたりするだけだったので、こうやってしゃべるとなると、とても緊張するものですね。
ウ:
やっぱりね、ヒロちゃんが入ってくれたことでね、普段は辻ちゃんとこう、男二人でスタジオにこもってますけど、ちょっとこう、気持ちも軽やかになりますね。
辻:
そうですね(笑)
ウ:
ええ。
辻:
はい、ということで、ヒロちゃん引き続き、よろしくお願いします。
ウ:
よろしくお願いします!
ヒ:
はい、ありがとうございます。がんばります!
ウ:
じゃあ、今日はせっかくなんで、最後ヒロちゃんに、締めてもらいましょうか。
ヒ:
はい、アクセシビリティPodcastでは、引き続き、皆さまからのご意見、ご感想、Listener's Voiceへの質問などをお待ちしております。
辻:
はい、ええ、このBlogエントリーへのコメントか、次のメールアドレスまでお送りください。エーイチイチワイ、アットマーク、ミツエードット、シーオードット、ジェイピー、エーイチイチワイ、アットマーク、エムアイティーエスユーイー、ドット、シーオードット、ジェイピーです。(編注:a11y@mitsue.co.jp)
ウ:
はい。あ、そうだ、辻ちゃん、次は、次回のPodcastは何をやりますか?
辻:
あ、そうですね、
ウ:
うん、
辻:
えー、次回はまた、「教えて!辻ちゃん!!」ということで、
ウ:
ほう、
辻:
NVDAについて基本的な操作をお伝えしていきたいと思ってます。
ウ:
前回寸止めに終わった、
辻:
そうですね(笑)
ウ:
NVDA、
辻:
はい、
ウ:
次回は読み上げさせてくれるんですね。
辻:
はい、いよいよ、読ませてみたいと思います。
ウ:
よろしくお願いします。
辻:
はい。
ウ:
じゃあ最後に、ヒロちゃんの音頭で、締めくくりますかね。
辻:
あ、そうですね。
ウ:
はい、
ヒ:
はい、そうですね、それでは、
三人:
アディオス、アミーゴス!

コメント

植木さん

お久しぶりです。
11月にワークショップでお会いした20歳前後の者です。
コメントする!と言っておきながら数ヶ月経っておりました。申し訳ありません。

オープンソースのNVDAとても期待しており、
アクセシビリティblogの内容を参考に勉強してみます。

1年前と比べると、アクセシビリティ対応のサイトに出会う機会が多くなっていて、身近になってきているなと実感しています。
また機会がありましたら、今後のアクセシビリティ事情などお伺いできればと思います。

Posted by: わかぞう : 2009年4月16日 07:42

わかぞう様

ウエちゃんといっしょにアクセシビリティPodcastでお話させていただいている、辻ちゃんです。
コメントをいただきまして、ありがとうございました。

現在ウエちゃんにもいただいたコメントを転送しておりますので、ウエちゃんからのお返事はもう少しお待ちいただけたらと思います。

さて、NVDAに興味を持っていただけたとのこと、どうもありがとうございます。
次回のアクセシビリティPodcastでは、NVDAでWebコンテンツを閲覧する方法について、読み上げ音声とともにご紹介する予定ですので、どうぞご期待ください。

引き続き、アクセシビリティPodcastをどうぞよろしくお願いいたします。

Posted by: アクセシビリティエンジニア 辻 : 2009年4月16日 10:02

わかぞう様

ウエちゃんです。

コメントお待ちしていました。ありがとうございます。

たしかに、アクセシビリティを意識するサイトは増えてきていますよね。それが当たり前になるように、このポッドキャストでも辻ちゃんと一緒に、皆さんに役立つ情報をこれからもお届けしていく予定です。

何か質問したいことなど出てきたら、いつでも遠慮なくコメントをお寄せください。辻ちゃんと二人で首を長くしてお待ちしています(笑)

では、またどこかでお会いできる日まで。
アディオス、アミーゴ!

Posted by: ウエちゃん : 2009年4月23日 05:19

ミツエーリンクスでは、WCAG準拠JIS X 8341-3対応をはじめ、さまざまなWebアクセシビリティ関連サービスをご提供しています。是非アクセシビリティのページをご覧いただき、お気軽にお問い合わせください。

Pick Up