PyCon mini Hiroshima 2018 終了

PyCon mini Hiroshima 2018 が無事に終了しました。
有料イベントになったにも関わらず、60人以上の人にご参加いただくことができました。

私は実行委員長として、また企業・団体パトロンの株式会社シュアルタとして、そして「舞え!ひろしま Kaggler」講演者として、あわただしい一日でした。

まだまだ記録とか精算とか報告作成とかやっている途中です。

Togetter まとめ

いつものように最後にスタッフみんなでご挨拶した写真。

まだ広島で Python 流行ってないの?と言わせてるみたいなスローガンでしたが、今回は「広島で流行らせよう!」というテーマをすこしずつ実践できていけそうな、そんな一日でした。

今後ともよろしくお願いします。

アクセシビリティの祭典 2018 と NVDA チートシート

2018年5月17日(木曜)に神戸で開催される「アクセシビリティの祭典 2018」に、NVDA 日本語チームとして出展を行い、また「視覚障害を持つ方の最新事情」セッションに登壇します。

配布資料を準備していたのですが、もっと役に立つものを提供したいと思い、現在「NVDA Cheat Sheet」の制作をすすめています。

当日、会場でお披露目する予定で、それまで内容は公開しません。

基本的には視力のある人が NVDA の機能や操作体系をざっと把握できるような A4 サイズ1枚の資料です。
昨年のオープンソースカンファレンス広島で名刺サイズのカードを作って、ほんの少しだけ配布したのですが、どうやら A4 サイズなら、いろいろな説明が盛り込めそうです。

内容は、過去にまとめた 開発者のためのNVDA (2015) および 開発者のための NVDA (2017) の資料と、NVDA 日本語版ガイドブック で説明したことを踏まえて選びました。

目標は時代工房さんの JIS X 8341-3:2016, WCAG 2.0 早見表 なのですが、今回のイベントで配布しながら実演や説明に使ってみて、改良点を見つけて、すこしずつバージョンアップしていきたいと考えています。

セッションでは、18年前に「視覚障害者のためのキーボード練習ソフト」の開発を通じて知り合った 園 順一さんとひさしぶりにご一緒させていただきます。
お話をするのが今から楽しみです。どうぞよろしくお願いします。

NVDA 行く年くる年

この記事は Web Accessibility Advent Calender 2017 の10日目の記事です。

オープンソースの Windows 用スクリーンリーダー NVDA に関するこの1年の活動を振り返るポエムで乗り切ろうと思ったのですが、ゆうべ広島フロントエンド勉強会で喋ったら気が変わってしまいました。

11月11日 JAC Vol.1 の講演「アクセシビリティ検証ツールとしてのNVDA入門」での失敗をフォローします。

決済サイト試作の入力バリデーション画面例

アクセシブルな決済システムの試作

アクセシビリティで難しそう、めんどくさそう、スクリーンリーダーで実際に検証しないと不安なポイントはやっぱりセキュリティだろう。

試してみたくなったのがクレジット決済 API を使うサイトの開発だった。

11月11日に見せようとした試作サイトは、以下のような方針で開発した。

決済サービスの選択

  • テストモード、つまり、ダミーのカード情報を送信して実際にWebアプリのテストができること
  • カード情報を Web アプリが保存しなくてよい、できれば受け取る必要すらないこと(情報漏洩のリスクを回避)
  • Python から簡単に使えること(個人的な好みです)

実際に使った決済サービスの仕様

  • JavaScript ライブラリがあり、ブラウザが決済APIサーバと直接通信を行い、カードと紐付いたトークン情報だけが返ってくる
  • そのトークン情報を Web アプリが受け取って、実際の課金を行うことが(Python ライブラリから)できる

つまり、ブラウザの中で「ユーザーにカード情報を入力させて、決済サーバに送って、カードのトークンを受け取る」という処理を、画面遷移せずに完結させたい、ということになる。

これは、セキュリティのために「動的なコンテンツを作らざるを得ない」ということで、アクセシビリティの題材としてはよさそうだと思った。

11月11日の前に作っていたもの

コードの抜粋はこちら

環境は Google App Engine for Python + Flask

(1) ログインする前の画面

ログインしてください、という表示になり、ログインのリンクがある。
実際にログインで使っているのは Google アカウント認証。

これが使いたかったので GAE を選んだ。本人確認されたユーザーのメールアドレスを取得。Google のログイン画面はスクリーンリーダーでちゃんと使えるはず。

ログインする前とログインしたあとの画面は Jinja2 (Python のテンプレートエンジン)で分岐している。

(2) ログインした直後の画面

ログインすると最初の画面が入力フォームになっている。

上から順に、以下のものがある。

  • テキスト「カード情報を入力して「確認」を押してください」
  • 4個の入力フィールド:カード番号、有効期限(年)、有効期限(月)、CVC番号
  • 「確認」ボタン(有効状態)
  • 「購入」ボタン(無効状態)
  • 「キャンセル」ボタン(無効状態)

ただし、デモなので、入力フィールドには決済サービスのテスト用カード番号があらかじめ入れてある。

確認ボタンを押すと URL が遷移するのではなく、JavaScript の処理が実行されて、コンテンツが動的に変化する。

(3) カード情報が正しくない場合の「確認」結果

「カード番号が正しくありません」などが表示され、入力フィールドの修正と「確認」ボタンしか有効にならない。

何が正しくないかというメッセージはテキスト( aria-live=”assertive” 属性の div )として表示され、スクリーンリーダーで読み上げられる。

つまり動的コンテンツだがバリデーション結果をアクセシブルに提示できる。

(4) カード情報が受理された場合の「確認」結果

「カード情報が確認できました。「購入する」を押すと***円のお支払いが完了します。」

のように表示され、「購入」ボタンと「キャンセル」ボタンが有効になり、入力フィールドと「確認」ボタンが無効になる。

購入ボタンを押すとカードのトークンが submit されて URL が遷移する。Python アプリで決済 API をたたいて結果を取得、次のページに「購入完了」みたいな表示を出す。

「キャンセル」を押すと、入力フィールドの値がふたたび変更可能になる。

本番でやったドジなこと

確認ボタンを押して入力フィールドが無効になった状態で、「じゃあ今度は値をわざと変更して正しくない入力内容にしてみましょう」とか言いながら、無効になっている入力フィールドのテキストを書き換えようとしてうまくいかず、デモを中断してしまった。

そのあとで考えたこと

aria-live=”assertive” とか、フォーカスの制御とか、invalid とか、いろいろ盛り込んだのだが。。

そもそも「自分がうっかり間違えるような UI 設計がよくない」と考え直した。

最近作り直したもの

(1) ログインする前の画面

ログインしてください、という表示になり、ログインのリンクがある。

(2) ログインした直後の画面

ログインすると最初の画面が入力フォームになっている。

上から順に、以下のものがある。

  • テキストA「カード情報を入力して「確認」を押してください」
  • 4個の入力フィールド:カード番号、有効期限(年)、有効期限(月)、CVC番号
  • 「確認」ボタン(有効状態)

(3) カード情報が正しくない場合の「確認」結果

テキストA「カード番号が正しくありません」などが表示され、入力フィールドの修正と「確認」ボタンが使える状態のまま

(4) カード情報が受理された場合の「確認」結果

  • テキストB「カード情報が確認できました。「購入する」を押すと***円のお支払いが完了します。」
  • 「購入」ボタン
  • 「キャンセル」ボタン

その他のものは非表示になる。

「キャンセル」を押すと、テキストAと入力フィールドだけの表示に戻る。

振り返って思うこと

なんのことはない、これはひとつの HTML ファイルにダイアログAとダイアログBがあって、交互に表示・非表示になる、一種のモーダルである。

たぶん最初の「非表示・無効」だらけの画面を作っていたときには、「この操作を実際に行うと、次にどういう段階に進むのか」みたいな見通しを伝えたかった。
だから、あとから有効になるけどいま無効なものをたくさん作ってしまった。
その流れで「さっきは有効だったけどいまは無効になった」ものも、たくさん残してしまった。

だが、けっきょくのところ「ひとつひとつの段階で迷わせない」「無関係なものを見せない」ということのほうが大事だったと思われる。

カード情報が確認できたときに、もういちどカード番号を表示する、みたいなことは、本当はやった方がいいのか、やっぱり不要なのか。。

こまかいこと

今回のデモでは invalid の判定には2種類ある。

(1) HTML の required と pattern を使う処理
(2) 決済APIサーバーのエラーメッセージに基づく処理

後者の場合には、JavaScript のコールバックで

<div id="input_guide" class="alert alert-primary" role="status" aria-live="assertive"></div>
<div class="col-12">
  <label for="card_number">カード番号</label>
  <input type="text" id="card_number" class="form-control" aria-describedby="card_number_help" value="5555555555554444" required aria-required="true" pattern="[0-9]{13,16}" />
  <small id="card_number_help" class="form-text text-muted">半角数字 <span aria-hidden="true">省略できません</span></small>
</div>
if (response.error.code === 'invalid_number') {
  $('#card_number').attr('aria-invalid', true).focus();
  $('#input_guide').text('カード番号が正しくありません').addClass('alert-warning').removeClass('alert-success');
}

みたいなことをする(jQuery を使っている)。

JavaScript 2行目の最後の .focus() がなければライブリージョンの「カード番号が正しくありません」が読み上げられる。

一方で、この .focus() をつけてしまうと card_number 要素の読み上げしか聞くことができない。

NVDA 2018.1jp-beta-171206x + Firefox ESR 52.5.2 でスピーチビューアを使って確認すると:

ブラウズモード
カード番号が正しくありません 
カード番号  エディット  正しくない入力内容  必須  オートコンプリート  半角数字 省略できません
55555555555544 選択
フォーカスモード

つまり、ライブリージョンの読み上げの直後にフォーカス位置の読み上げイベントが発生して、直前の読み上げを止めてしまうのだ。

(「フォーカスモードとブラウズモードの切り替えを音で報告」はチェックなし。後述の追記2を参照のこと)

実は最初のバージョンはこれが気に入らなくて(だって live region のデモにならないから)フォーカスを移動しなかったのだが、考えてみるとライブリージョンを読むことよりもフォーカスをエラー箇所に移動してあげることのほうがずっと親切で、ユニバーサルな気がする。

さらに、フォーカスを読み上げるときに「正しくない入力内容」もちゃんと読み上げているのだ。

本当にスクリーンリーダーで検証するべき「アクセシビリティのディティール」というのはこういうことなんだろうな、と思っている。

ここから追記

追記:NVDA の live region の実装がおかしいのではないか、と言われそうな気もするので(そうかも知れないけど)ちゃんと制御できるケースも紹介しておく。

$('#card_number').attr('aria-invalid', true);
$('#get_token_btn').focus();
$('#input_guide').text('カード番号が正しくありません').addClass('alert-warning').removeClass('alert-success');

こんなふうにボタンにフォーカスを移動して、直後に live region の内容を更新すれば、「カード番号が正しくありません」をちゃんと聞くことができる。
(このテクニックは最初のバージョンで使っていた)

追記2:さらに調べたら、NVDA の「フォーカスの変化を追跡する自動フォーカスモード」をチェックなしにすると、エディットにフォーカスが移動したときに live region を最後まで読み上げて、それからフォーカスを読み上げるようになった。

ボタンとエディットで挙動が違うのだから、もしやと思ったら、やっぱりそういうことだったか。。

おことわり

勘のいい人は shop.nishimotz.net というサイトを見つけたかも知れませんが、このサイトは「本当に何かを販売して決済を行うサイト」に作り替える予定の場所です。

明日は tosssaurus さんの「社内じんわりアクセシビリティ普及活動報告」だそうです。お楽しみに。

JAC vol.1 & NVDAワールド 2017 & NVDA開発者会

もんどさんのブログを読んで、私も書くことにしました。

Japan Accessibility Conference

Japan Accessibility Conference vol.1
2017年11月11日(土曜)
会場:ヤフー株式会社 紀尾井タワー セミナールーム

にて「アクセシビリティ検証ツールとしてのNVDA入門」という講演をします。

2015年に「Web製作者のためのNVDA入門」というイベントの講師をしたのですが、今回はハンズオンでもなく、時間も限られているので、いちおう下記のような予定です。

視覚に障害があるユーザーがPCを使う上で不可欠なものがスクリーンリーダーです。
無料で利用できる Windows 用スクリーンリーダー NVDA をご紹介します。

  • スクリーンリーダーとはどのようなものなのか、
  • スクリーンリーダーで Web ブラウザをどう操作するのか、
  • アクセシビリティ検証ツールとして NVDA をどう使えばよいか

をご説明します。

この講演は5月ごろから打診をいただいていたので、このイベントにあわせて NVDA 2017.3jp に導入した新機能もありますし、お馴染みの FocusHighlight アドオンも(RubyKaigi 2017で実演に使いましたが)新しいバージョンをリリースしたいと思っています。

なので、11月11日に話を聞いてくださった人には、これまでよりもスムーズに「アクセシビリティ検証ツールとしてのNVDA」をお試しいただけると思います。

(おわかりのとおり WordPress を使っているので、私のセッションの裏番組も気になります。。)

NVDAワールド2017

一方で、前述のイベントがこの日程になることがわかっていたため、11月1日から3日まで開催されるサイトワールドの翌日ではなく前日に開催することにした

NVDAワールド2017
2017年10月31日(火曜)
会場:日本マイクロソフト
(東京都港区港南2-16-3 品川グランドセントラルタワー)

は参加申し込みの締め切り(10月23日)まであと2週間になりました。

こちらの私のセッションは「ビジネスツールとしてのNVDA」というテーマにしました。
前述のカンファレンスの発表と内容が重複しない、はずです。。

概要:2013年に NV Access が視覚障害者コミュニティの支援で PowerPoint 対応を実現して以来、NVDA は視覚に障害がある人の就労手段としてグローバルに支持されています。

本セッションではビジネスツールとしての NVDA の機能を紹介しつつ、最近の NV Access や開発コミュニティ、 NVDA 日本語チームの活動を報告します。

NVDA の Microsoft Office 対応や Windows 10 対応の最新情報を、この機会にまとめてお伝えしたいと思います。

NVDA開発者会

最後に、NVDAワールド2017開催日の午前に行う予定の「NVDA 開発者会」について補足します。

いま NVDA 本家の開発コミュニティではいろいろな新しい動きがあって、NVDA の開発に興味がある人に伝えるべきことはとても増えています。

2017.4 で Windows XP/Vista 対応を打ち切ることが決まり、新しい動きは本格化しました。

開発に使われている Visual Studio のバージョンを 2015 から 2017 に上げること、各種の依存パッケージを更新すること、そして NVDA を Python 2.7 から Python 3 に移行させる作業が、これから2019年ごろまでに行われます。

今回の開発者会では、まず Windows 環境で Python 2.7 と Python 3.6 を共存させる方法をご紹介します。
これから1年か2年くらいの間 NVDA に関わるために必要な知識だと思うからです。

それから、おそらく当日までに本家の移行が完了しているはずなので、Visual Studio 2017 Community を使う前提で NVDA (本家版および日本語版)のソースコードからの実行方法やビルド方法を紹介する予定です。

日本語に対応していないことが課題になっている eSpeak や libLouis など音声合成エンジンや点訳エンジンなどの現状、ソースコードからの実行やテストの方法、開発コミュニティの動向などの情報も、時間の制約はありますがお伝えしたいと思います。

点字ディスプレイなどふだん私が検証できない機材は、その場に持参いただければ、不具合の調査などができると思います。

開発者会には NVDAワールド 2017 の connpass 申し込みで「開発者枠」でお申し込みください。

#RubyKaigi 2017 終了

What visually impaired programmers are thinking about Ruby?

発表も終了し、オーガナイザーとしての3日間も終わりました。

参加したことさえなかった RubyKaigi のオーガナイザーを引き受けることになり、どうなることかと思いましたが、スピーカーもさせていただいて、素晴らしいチームの一員として働かせていただいたことに、満足そして感謝しています。

ウェブアクセシビリティの観点から Ruby のドキュメントツールについて指摘したので、具体的に何をどう直したらいいか、もうすこし考えてみます。それまでは私の中で RubyKaigi は終わらないような気がしています。

なぜ @24motz aka @nishimotz は #RubyKaigi で講演をするのか

いよいよ開催が迫ってきた RubyKaigi 2017 (開催地:広島)で、オーガナイザーのひとりとして活動している「にしもつ」 @24motz aka @nishimotz です。

What visually impaired programmers are thinking about Ruby? というトークもさせていただく予定です。

2015年から Python の活動を広島でやっていて、やっと Python がブレイクしてきた今年、そっちの活動を保留して RubyKaigi のお世話をすることになったのですが、私のもともとのモチベーションが NVDA 日本語版の紹介、そして「アクセシビリティ」だったので、じゃあ RubyKaigi で自分がアクセシビリティ関連の貢献をすればよいのでは、と気持ちを切り替えたのが、上記のトーク提案の背景です。

今年 PyCon JP 2017 ではスクリーンリーダー関係の発表や活動をしていません(聴講者として参加して楽しんできました)が、かわりに東京では NVDA ワールド 2017 を10月31日(火曜)に開催します。

私がアクセシビリティの委員会活動やスクリーンリーダーのコミュニティでつながっている人の何人かは、音声合成による画面読み上げや、点字ディスプレイというデバイスを PC に接続して、プログラミングやインフラ管理などをやっておられます。

その人たちに Ruby について質問してみたことをヒントに、私が Ruby のドキュメントやエディタなど主にツールのアクセシビリティを調べています。その結果を NVDAでの実演を交えて紹介します。

今年の RubyKaigi サイトにはアクセシビリティのポリシーのページがあります。
会場に託児所を用意していること、発表は録画して後日公開されること、など、いままで RubyKaigi が取り組んでいたことも「アクセシビリティ」の一環として位置づけられています。

現在まで視覚や聴覚の障害をお持ちの方から「参加するので配慮をしてほしい」というご要望はありませんでしたが、もし早い段階でなにかご要望があれば、可能なことの手配をお手伝いしようと思って構えていたのは事実です。

(すべての日本語セッションに英語同時通訳をつけるというレベルの予算と体制のイベントなので、やれば手話通訳も要約筆記もできるはず。今年なくても来年でも)

いや、いまからだと遅いといっているわけではありません。いまからできることをベストエフォートで提案するので、障害をお持ちのかたの RubyKaigi 参加を今からでも(少なくともオーガナイザーの一人である私は)歓迎します。

チケットの購入はこちらです。

本当に障害の当事者の人に参加してもらうためには「その人たちが聞きたいと思うコンテンツ」を用意することも必要だと、私は過去の学会活動やイベント運営の経験から感じています。

RubyKaigi は「Ruby プログラミングが気になる人のためのイベント」というよりも「Ruby 言語の開発者たちが集まって Ruby の未来を真剣に語り合う場」なので(たぶん)、敷居が高いのだと思いますが、そんな中で私が「Ruby の開発者にも障害の当事者にも興味がありそうな話」ということで提案したのが「視覚障害者は Ruby についてどう思ってるのか」という発表です。

なんせ私が当事者の声を代弁するだけなので、ぜひ「本当はこう思ってる」という人にフロアにいてほしい、あるいは後からでも議論のきっかけになってほしいと思っています。

実は最初は「プログラミング言語の文法の違いは、アクセシビリティに影響がある」「Ruby の文法はアクセシビリティ的に優れている」みたいな仮説を検証できるといいなあ、と思ったのですが、ちょっと考えたり調べたりして、やはり無謀な計画だと思いなおしました。

そういう話は10年くらい前に、視覚障害の学生にプログラミングを教えている先生からちらっと聞いていました。

いわく、メソッドチェーンでどんどん1行で書いていけるので、コーディングを教えやすいし、音声読み上げにも向いている、と。。

この仮説の検証はいまは無謀だと思えてきたわけですが、たとえば Python と比べて Ruby の文法が「視覚障害者に書きやすいか?」と自問自答すると、はっきり言えるのは「インデント」でしょうか。単純な問題ではなさそうです。

けっきょくは、何をやりたいのか、求められるアウトプットはどういう状態なのか、仕事なのか趣味なのか、どういう環境やツールなのか、本人のスキルはどうなのか、といった話になります。

最後に広島のグルメ情報でも書ければいいんですが、あいにく私はグルメでないし人生の半分くらい広島県外にいたので、「るびま」のリンク集にお任せします。

かわりに、視覚障害者のプログラミングについて雑談します。

彼ら(主に男性)は、スクリプト言語やドメイン固有言語(DSL)が好きな人たちだと私は見ています。

たとえば Hot Soup Processor (HSP)日本語プログラミング言語「プロデル」はスクリーンリーダー利用者にとても愛されています。

また世界的に有名なスクリーンリーダー JAWS には JAWS スクリプトという言語があって、アクセシビリティに問題のある Windows アプリの不具合を補うためにエンドユーザーがスクリプトを書いて共有しあっています。(同じようなことを汎用プログラミング言語 Python でやれるようにしたというのが NVDA の特長の一つです)

ニュースサイトをスクレイピングして簡単に音声読み上げできるようにする「視覚障害者専用アプリ」もいくつかあり、人気を博していますが、スクレイピングのためのマクロや正規表現をメーリングリストで共有する、という文化も根強く続いています。

そんな人たちが Ruby に向き合うとどうなるのか。。できるだけわかりやすく話せるように頑張りたいと思います。お楽しみに。

余談:もうすこし予習したい人には、ラックの外谷さんの記事「スクリーンリーダーの音声を聞いたことがありますか?」をご紹介しておきます。

こどもプログラミング教室(PCNひろしま)参加について

「PCNひろしま」という団体の立ち上げに参加し、こどもたちに「プログラミング専用パソコン IchigoJam」を体験していただくイベントを開催することになりました。

第1回は私が講師を担当する予定です。開催日は7月30日(日曜)午後1時開始、3時30分終了の予定です。

会場は「イノベーション・ハブ・ひろしま Camps」です。

募集開始が7月になっていますが、詳しくは connpass のイベントページをご参照ください。

経緯

ここでは、私の視点での IchigoJam の魅力、そしてこの活動に関わることになった経緯を書いておきたいと思います。

2015年の年末に「こどものプログラミング教室」について相談を受けたことがあり、ちょうど気になっていた教材候補の一つとして2016年1月に IchigoJam を購入してみました。
いわゆるビジュアルプログラミングの教材もいくつか試してみたのですが、私は IchigoJam がシンプルで扱いやすい、魅力的な教材だと感じました。

また、ある程度ハードウェアを拡張でき、しかもその扱いも簡単であることから、教育用としてだけでなく、大人のちょっとした電子回路の実験にも使えるように思いました。

とは言いつつ、最初はいろいろ不満もありました。なぜ PS/2 キーボードなのか、なぜ(アナログの)ビデオ出力なのか、などなど。。

私の作業場所にはアナログビデオ入力のディスプレイがなかったため、アナログから HDMI に変換するスキャンコンバーターを購入してみたのですが、微妙に信号の規格がずれているらしく、実用的なクオリティの画像を HDMI ディスプレイに出力できませんでした。
中国からの輸入品で購入した超小型の液晶モニタがちょうどよくて、作業環境はやっと落ち着きました。

けっきょく去年「こどものプログラミング教室」に私は関わることはなく、しばらく IchigoJam の応用例を参考にして MicroPython + ESP8266 の実験をやったりもしていました。

今年の2月の「オープンセミナー広島」に jig.jp の福野さん(IchigoJam の開発者)がいらっしゃって、それにあわせて開催された IchigoJam の体験会に立ち会わせてもらいました。

そして、この教材に対する見方がまた変わりました。
一言でいえば「こどもの教材としてよく考えて作られている」ということでした。
ご自身がちゃんとこどもたちと向き合ってプログラミングを教えながら、その経験を踏まえて仕様を改良して、現在に至っているということが理解できました。

その後、福野さんを広島に招いたり体験会を企画してくださった石崎さんを代表として「プログラミング・クラブ・ネットワーク (PCN)」の広島版を立ち上げることになり、やっといま、第1回イベントの告知にこぎ着けたところです。

広島に戻って以来、大学生にプログラミングを教えることからもしばらく遠ざかっていたのですが、私自身がこども時代に「黒い画面とキーボードだけのコンピューター」にワクワクしていた気持ちを思い出して、私が理解した IchigoJam の魅力を多くの人にお伝えしたいと思っています。

おまけ

西本はことし RubyKaigi 2017 オーガナイザーとして、全国・世界の Ruby 技術者が9月18日からの3日間広島に集まるお祭りの裏方をやっております。
現在は Super Early Bird 料金でのチケットを販売中です。
またスポンサー企業も募集しております。
そろそろカンファレンスの詳細がいろいろ発表されると思います。ご期待ください。

去年まで活動していた Python のイベントはどうなったのかというと、今年は「すごい広島 with Python」として、4月から毎月1回、定期的な勉強会として盛り上げていこうとしています。

スクリーンリーダー NVDA に関しては、VIC への参加、そして今年は秋以降に NVDA 日本語チームとして東京圏での活動を計画中です。

あわせて今後ともよろしくお願いします。

NVDA で Excel を使う

NVDA の Excel 罫線対応を実装するために使ったワークシート

この記事は Webじゃないアクセシビリティ Advent Calendar 2016 13日目の記事です。
前日はFCSアプリが公開されました。:友加の日々の記録:So-netブログでした。

オープンソースの Windows 用スクリーンリーダー NVDA の日本の開発者コミュニティ、NVDA日本語チームの西本です。

NVDA 2016.4jp

このアドベントカレンダーにエントリーした時には NVDA (本家版)の次のバージョン 2016.4 は string freeze (翻訳者向けに新機能の追加や英語のドキュメントの更新が停止された段階)に入っていました。
予想では11月29日にリリース候補版(RC)が出て、12月6日に正式リリース、ただし、なにかの事情でRCが2回出ることになったら1週間遅れるだろうと思い、この日を登録しました。
結果的に「なにかの事情でリリース候補が遅れる」に加えて「リリース候補が2回でる」ことになり、本日12月13日には 2016.4 RC2 が出ました。おそらく正式版は今週末か来週でしょう。
本家の正式版が完成したらすぐに日本語版 2016.4jp をリリースする見込みです。

NVDA日本語版 2016.4jp の新機能ですが、Microsoft Excel でセルの罫線の報告を実装しました。
この機能は(本家版にも提案はしていますが)いまのところ日本語版限定の機能なので、「日本語設定」に罫線報告を「なし」にしたり、色だけを省略できるオプションがあります。

NVDA の Excel 罫線対応を実装するために使ったワークシート

このほかには「NVDAキー」の表記を「NVDA制御キー」に揃えるなどの用語の変更、修正を行っています。

NVDA 日本語版の課題やご要望の報告には「新規チケット登録」をご利用ください。
ご報告いただいた件について詳細の調査や本家への提案などをお手伝いいただける NVDA 日本語チームの仲間も募集しております。

前置きが長くなりましたが、ここから本題です。

NVDAのExcel関連機能の紹介

NVDA ユーザーガイドには Excel 関連機能がまとめられています

VIC 広島市視覚障害者情報支援センター(ボランティアサークル)の12月4日の例会で、この NVDA の Excel 関連機能を講習会形式で紹介してみました。

教材として使ったファイルは docs.com に置きました
マクロを有効にした、いわゆる xlsm ファイルでお配りしています。
メッセージボックスを開く簡単な VBA マクロを使っています。

マクロが無効のままだと最後の「フォームフィールド」の実習がうまく動きません。
「セキュリティの警告 マクロが無効にされました。」
のようなペインが(F6キーで移動していくと)表示されるので、右側の「コンテンツの有効化」ボタンを押してください。

NVDAでExcel.xlsm ファイルのSheet1を開いた画面

ワークシートの切り替え

Excel のファイル(ブック)には複数のワークシートを含むことができます。

表示中のワークシートを切り替えるキーボードショートカットは Ctrl+PageUp および Ctrl+PageDown で、これは Excel の標準機能です。

しかし NVDA で Excel を操作しているときには、要素リストで切り替えることもできます。

NVDA+F7 :要素リストを開く

要素リストで Shift+Tab を押して種別を「シート」に切り替えて、ツリービューに戻って、移動したいシートの名前で Enter を押します。

なお NVDA 制御キーを押し損なうとただの F7 キーになってしまい、これは Excel のスペルチェックの呼び出しです。

では、教材ファイルの Sheet2 に切り替えてみましょう。

グラフの値を読む

NVDAでExcel.xlsm の Sheet2 の画像。日付と数値の右側に棒グラフがある

ワークシートの中を矢印キーで移動すると「グラフ」を選択することができませんが、要素リストを使うとフォーカスをグラフに移動できます。

  1. グラフが含まれているワークシートに移動します。
  2. NVDA をフォーカスモードにします。(ブラウズモードのままだとうまくフォーカスがグラフに移動しません)
  3. 要素リストで種別「グラフ」を選び、ツリービューでグラフを選択して Enter を押します。
  4. 要素リストのダイアログが閉じて、そのグラフにフォーカスが移動した状態になります。

NVDA+Tab を使うと、グラフがフォーカス位置であると確認できます。

この状態で、下矢印キーを押していくと、グラフを構成する各要素にフォーカスを移動できます。

グラフの種類やオプションによって変わりますが、以下のような要素が見つかります。

  • 系列 系列1 1の1
  • 目盛
  • データラベル
  • グラフの軸 種類 項目 グループ 主
  • グラフの軸 種類 値 グループ 主
  • プロットエリア
  • グラフエリア

「系列 系列1」に移動した状態で、今度は右矢印キーを押します。
すると、以下のように値を読むことができます。

  • 1月2日 363.5
  • 1月9日 418.0

右矢印キーを押し続けて、最後までいくと先頭に戻ります。
また左矢印キーで逆方向に移動できます。

この機能ですが、グラフの内容やデータの形式によっては不完全だったり不自然な読み上げになります。

例えば、日付をシリアル値(数字)として読み上げてしまう、セルの書式設定を無視して小数点以下をすべて読み上げる、といった課題を確認しています。
今回の教材では「NVDAがうまく読み上げるように」あらかじめ手を入れてあります。

コメント

Sheet1 のセル B12 には「コメント」がついています。

NVDA はコメントのつけられたセルに移動すると「コメント」と報告します。

コメントの内容は NVDA+Alt+C で確認できます。

また要素リストの種別「コメント」を使うと、コメントを一覧できます。

数式

要素リストの種別「数式」を使うと、現在のワークシートに含まれる数式を一覧できます。

Sheet1 のセル B3 には「=B2*消費税率」と書かれています。

「消費税率」はセル B8 につけられた「名前」です。

名前を管理する方法は NVDA にはありませんが、Excel の機能「名前の管理」は Ctrl+F3 で呼び出すことができます。

行と列の見出しの自動報告

A1 から B3 にかけて見出しのついた「表」があります。

ちょっと小さくて物足りないので、以下のように書き足してください:

  • C1: 商品B
  • C2: 200
  • C3: (セルB3をコピーして貼り付けます)

セル B2 の数式は B8 を名前で参照しているので、C3 には 200 * 1.08 = 216 が表示されます。

では A1 にカーソルを移動して、以下を実行します。

NVDA+Shift+C 見出し列の設定

列を左右に移動したときに、1行目の内容を見出しに使って「商品A」「商品B」と読み上げるようになります。

もういちど A1 にカーソルを移動して、今度は以下を実行します。

NVDA+Shift+R 見出し行の設定

さきほどの列見出しの報告に加えて、今度は行を上下に移動したときにも、A列の内容を見出しに使って「金額」「税込金額」と読み上げるようになります。

この「見出し行と見出し列の場所」を保存するときに NVDA は Excel の「名前」機能を使っています。
(さきほど紹介した Ctrl+F3「名前の管理」で確認できます)

この状態でファイルを保存しておくと、Excel や NVDA を起動し直しても見出しの自動報告は再現されます。

フォームフィールド

NVDA 2016.3 で追加された機能が「フォームフィールドの操作」です。

Sheet1 で NVDA+F7 要素リストを開いて、「種別」フォームフィールドに切り替えます。
「ボタン1」というボタンが見つかるので、Enter を押します。

これでフォーカスが Sheet1 のシートに貼り付けられた「ボタン」に移動した状態になりました。

スペースを押すとボタンを押すことができます(既定のアクションの実行)。

教材ファイルは「こんにちは」という小さなメッセージボックスを表示しています。
「OK」というボタンがあります。
このメッセージを閉じるまで Excel の他の操作ができません。
OK ボタンにフォーカスを移動してスペースを押す、
Enterを押す、あるいはEscを押す、といった方法でダイアログを閉じてください。

最後に

以上、要素リストの機能を中心に、NVDA が Excel に対して提供している機能を紹介しました。

機能の実装や日本語の翻訳など、まだまだ課題もあると思うので、なにかお気づきのことがあればお知らせいただけると助かります。

なお Excel をスクリーンリーダーで使う場合の一般的な解説をいくつか紹介しておきます:

視覚障害者のためのExcel 2010キー操作マニュアル

Microsoft Office 2013 のアクセシビリティ

Excel 2016 でスクリーン リーダーを使用する方法のヘルプ

PyCon JP 2016 ポスター発表: NVDA の開発とコミュニティ活動

9月21日と22日の2日間、PyCon JP 2016 に参加しました。2日目に「スクリーンリーダー NVDA の開発とコミュニティ活動」というポスター発表をしました。多くの人に見ていただけたようです。長い時間をかけてこちらの話に付き合ってくださったかたも多かったです。

PyCon JP 2016 ポスターの前に立つ西本

23日には開発スプリントのリーダーとして、NVDA 日本語版の開発の具体的な作業を紹介、そして Python でアドオンを開発するチュートリアルなどを行いました。メンバー4人で楽しくハッカソン的な時間を過ごしました。

NVDA日本語チームは2013年からユーザーを対象にしたイベントを行ってきましたが、今年、方針を変更してこういう技術者向けイベントに参加しました。結果として、より多くの人にNVDAを知ってもらったり、コミュニティのメンバーを広げたりする手段になったと感じています。

特に今年の PyCon JP は「多様性」がキーノートや講演でも取り上げられました。そのような中で、アクセシビリティの話が、多様性についての視野を広げるお役に立てていたらうれしいです。

PyCon JP の参加を通じて得た知識、気づいたことなどは、また改めて書いたり喋ったりしたいと思います。

11月12日開催の PyCon mini Hiroshima 2016 も「視覚や聴覚に障害をお持ちのかたを含めて、 誰にでも参加して楽しんでいただけるイベント」を目指しています。発表のプロポーザルを9月30日まで募集しています。

それから10月2日に広島での勉強会で Python と機械学習をテーマにLTをしようと思っています。こちらもよろしくお願いします。