nishimotzの日記

写真 青い空と雲と建物と木々の緑

nishimotzの日記

  • オープンセミナー2020@広島

    オープンセミナー2020@広島が昨日（2020年2月8日）開催されました。


    Togetter まとめ
    私も3年くらい前から実行委員の一人として運営に関わっていて、今回は副委員長を務めました。
    おかげさまで100人を超える（懇親会の参加者だけでも67人）多くの人にご参加いただき、盛況に終わりました。
    次回以降のスタッフ希望のご連絡は @24motz 宛でも結構ですので、お待ちしています。

    PyCon mini Hiroshima 2020

    私の会社（シュアルタ）は前回に続いてスポンサーとなりました。
    去年に続いてスポンサーセッションの時間を5分いただいたのですが、イベントのテーマ「エンジニアライフHacks」に沿った話をするには時間が短すぎました。
    そこで 過去にブログに書いた内容を「PyCon mini Hiroshima のウェブサイトとアクセシビリティ」として紹介しました。

    スライドの中でご紹介した重要な告知は
    「2020年10月10日（土曜）に PyCon mini Hiroshima 2020 をやります」
    です。詳細はこれからすこしずつ発表していきます。よろしくお願いします。

    「正しいことを」の話

    スクリーンリーダー NVDA のコミュニティ活動を踏まえてウェブ制作の配慮の話をしました。
    私の活動のモチベーションを「正しいことを躊躇なく行うのは、気持ちいい」と表現しています。
    「正しいことを躊躇なく」は、Python コミュニティの著名な人たちからヒントを得たキーワードです。
    「正しいことを行うことに喜びを感じている人たち」は、アクセシビリティのコミュニティで著名な人たちについての私の観察です。
    「エンジニアは正しくないことを行いたくたい」は、自分の感じていることでもあり、よく語られていることでもあります。
    こういったことを考えていたら、前述のようなトークになりました。短い時間で説明するのは難しかったですね。

    Hacks?

    各セッションは聞きながら響いたキーワードや感じたことをツイートしています。
    2020年2月8日 @24motz のTwiLog
    どなたもきちんと考え抜いて丁寧に「エンジニアの生き方・学び方」あるいは「ソフトウェア開発の最先端」を語っておられました。
    「働くこと」と「楽しむこと」の両立についても多く語られました。
    これは、前回の「学び方Hacks」のときからテーマ決定に参加している私の反省になるのですが、設定したテーマが「Hacks」という、ちょっと斜に構えたキーワードになっているのは、アンバランスだなあ、と思いました。
    学び方にも生き方にも「Hacks はない、まじめにやろう」という、当たり前のようなことを、去年と今年と2回にかけて、登壇者の皆さんから感じ続けています。

    座長＆実行委員長

    昨夜の懇親会で挨拶しましたが、PyCon mini Hiroshima 2020 の座長も、オープンセミナー2021@広島の実行委員長も、どちらも「やります」ということになりました。


    この一年、いろいろご協力、ご支援をいただければ幸いです。よろしくお願いします。

    株式会社シュアルタ

    私が2011年に広島に戻って以来、基本的にフリーランスのような働き方でエンジニアとしてやってこれたのは、オープンセミナーや PyCon のようなコミュニティのイベントで、いろいろなことを学ばせてもらったおかげだと思っています。
    株式会社シュアルタは2018年2月9日（肉球の日）設立で、今日は会社の設立記念日でもあります。
    無事に第2期が終わり、今月から第3期として営業をしております。
    ウェブアプリ、モバイルアプリなどの受託開発、ソフトウェア開発のコンサルティングをしながら、スクリーンリーダー NVDA 日本語版の活動を行い、ペット事業の研究も続けています。
    シュアルタも引き続きよろしくお願いします。

  • NVDA 2019.3 の新機能

    このエントリーは Webアクセシビリティ Advent Calendar 2019 の3日目の記事になります。
    NVDA日本語チーム の西本です。ふだんは広島県広島市にいます。オープンソースのスクリーンリーダー NVDA の日本語対応に関わりながら、NVDA 日本語版のリリースを続けています。
    ウェブアクセシビリティ基盤委員会 WAIC WG2 にも参加しています。
    広島では Python のコミュニティ活動やイベント開催に関わっています。
    フリーランスの技術者として NVDA に関するコンサルティングや開発のお仕事をいただくこともあります。
    私の会社（シュアルタ） にご相談ください。

    NVDA相談会の開催報告

    本題に入る前に NVDA 日本語チームのブログ記事をご紹介します。
    2019年11月1日にサイトワールド2019で「NVDA相談会」を開催しました。
    NVDA 相談会 in サイトワールド2019 開催報告

    NVDA 2019.3 の新機能

    NVDA 2019.3 はまだリリースされていませんが NV Access のブログ で変更点が紹介されています。
    私も 翻訳 をしていて、単に Python のバージョンが変わるだけではなく「新機能も盛りだくさん」になってきたなあと感じています。
    ここでは Web アクセシビリティに関わる皆様に関係があることを中心にご紹介してみます。

    フォーカスハイライト

    2016年のアドベントカレンダー記事 など何回か紹介した「フォーカスハイライト」という NVDA アドオンですが、ついに NVDA 2019.3 で NVDA 本体の機能になります。
    この機能は「画面が見えにくい人」の支援技術であると同時に、NVDA の「ナビゲーターオブジェクト」や「ブラウズモード」がどう動くのか、どういう状態なのかを把握できるので、アクセシビリティ検証に役立つと思います。
    私の実装は大幅に書き直しされましたが、基本的に「私がやりたかったこと」を「私がやってきた方法」で実装してもらえました。
    さらに、NVDA 本体に入ることのメリットとして、NVDA に視覚的な拡張を行うアドオン（ビジョン拡張プロバイダー）の仕様が決められて、その枠組みで新しいフォーカスハイライトが実装されました。
    現状では、NVDA 2019.3 のフォーカスハイライトと、私のアドオンは、それぞれ以下のような利点があります。

    • 本体機能：ブラウズモードのカーソルをハイライトできる。Webブラウザで左右の矢印キーで1文字ずつ移動すると、どの文字を読んでいるかがわかる。
    • アドオン：ハイライトの色や太さのカスタマイズができる。NVDA+Alt+P でハイライトの表示／非表示を切り替えできる。過去のバージョンの NVDA でも利用できる。

    おそらく今後は NVDA 本体のフォーカスハイライトの改良に貢献したほうがよいと考えています。ご要望があればお知らせください。

    スクリーンカーテン

    さきほど紹介した「ビジョン拡張」のもうひとつの機能として「スクリーンカーテン」が追加されました。
    VoiceOver にもあるのでご存じかも知れませんが、簡単にいえば「画面を真っ黒にする」機能です。
    アクセシビリティ検証作業のために目をつぶって操作をしていた晴眼者の皆様にも、待望の機能かも知れませんね。
    （スクリーンカーテンを終了する方法をちゃんと練習してから試してください。）
    NVDA 2019.3 設定「ビジョン」カテゴリ

    WAI-ARIA など Web 標準への対応の強化

    NVDA の Enhanced Aria アドオン に相当する機能強化が NVDA 本体で行われました。
    例えば Issue 9485 として aria role group への対応を確認しました。
    報告されていた例をすこし手直しした下記の例をブラウザのロケーションバーに入力して
    data:text/html, <p><button>1</button></p><p role="group" aria-label="A"><button>2</button></p><p><button>3</button></p>

    1, 2, 3 という3つのボタンが上下に並んでいる
    最初は Tab でボタンに移動、続いて下矢印キーで操作すると

    • ボタン 1
    • A グループ ボタン 2
    • グループの外 ボタン 3

    のようになります。
    この「グループ」の報告は「書式とドキュメント情報」で有効・無効を切り替えられます。
    また「入力ジェスチャー」でカスタマイズすれば、1文字ナビゲーションで「グループ」単位の移動ができます。
    （デフォルトではキー操作が割り当てられていません）
    他には例えば Issue 9616 として role=combobox 対応の不具合が修正されています。
    この他に figure 要素や article 要素への対応も強化されています。

    コンソール対応の改善

    Web 関連ではありませんが、2019.3 ではコマンドプロンプトや WSL など、いわゆる「コンソール」への対応が改善されます。
    この作業の一部は、Google Summer of Code の支援で行われました。
    従来の NVDA ではコマンドプロンプトが日本語の文字を正しく処理できない場合がありましたが、新しい NVDA では改善していると思います。

    2019.3 リリースへの道のり

    NVDA の通常のリリース作業は、本家ベータ版のリリース、翻訳チームの作業期間の宣言（string freeze と呼ばれます）とその作業締切（通常は2週間後）、リリース候補版、通常はその1週間後に正式リリースとなります。
    今日すぐに本家ベータ版がリリースされたとしても、最短で3週間後に正式リリースとなります。
    あれ、NVDA 2019.3 は本当に2019年12月31日までにリリースされるの？
    みたいなハラハラドキドキも私たちと共有したいという皆様、まずは NVDA 日本語チームのメーリングリストへのご参加から、私たちの活動にご協力いただけると嬉しいです。
    詳しくは www.nvda.jp をご参照ください。

  • PyCon mini Hiroshima 2019 のサイト制作

    2019年10月12日（土曜）に PyCon mini Hiroshima 2019 を開催しました。
    イベント自体については別の場で報告を書こうと思っていますが、チームから「ウェブサイト構築の話を共有してほしい」という意見があったので、忘れないうちに、まずここに書いておきます。
    hiroshima.pycon.jp は2015から2016にかけては GitHub Pages で私が自分で作りました。
    2018 からは参加費をいただくイベントとして開催することに決めて、専門家に制作をお願いして、WordPress で構築されました。
    （現在は静的サイトに変換して残しています）
    2019 では、もっと自分たちでコントロールしながら制作したいと考えて、Next.js を使いました。
    さいわいチームにはコーディングもデザインもやっていただける Nyoho さんがおられて、私は作業をチェックして本番環境にデプロイする、という立場になりました。
    今年の PyCon mini Hiroshima チームは GitHub のプライベートリポジトリを作りました。
    ウェブサイトのソースコードを Git で管理し、ウェブサイト制作のタスクも、それ以外のタスクも、すべてこのリポジトリの issues として管理しました。
    日程だけを告知する私の仮サイト（BootStrap Studioで作成）を、Next.js のサイトに置き換えていく作業は、6月ごろ始まりました。
    リダイレクトに必要な nginx の設定をリポジトリに含める提案があり、それを私が pytest と requests でテスト駆動しながら導入する、というのを（すごい広島 with Python のネタにしながら）やったのが6月下旬。
    7月上旬には、プルリクエストごとにプレビュー用の Web アプリのビルドが行われるようになり、本番環境を更新する前に、ブラウザでレビューが行える体制が整いました。
    このころから、私自身は node.js で React のコードを触るのをやめて、逆に本番環境へのマージの権限は私だけが持つことにして、レビューアーに徹することにしました。
    7月末に Nyoho さんが SVG アニメーションで動くヒーロー画像を制作したあたりから、私は、いろいろな環境に配慮したアクセシブルなサイトであることをレビューするようになりました。
    残念ながら SVG アニメーションは最後まで IE11 や Microsoft Edge では動かせなかったのですが、かわりに動かないタイトル文字を出してもらうようにしました。
    このやりとりの中で、Next.js を使いながらアクセシビリティを確保できそうだ、という見通しが得られました。
    やがて、スクリーンリーダーの利用者が適切に操作・閲覧できることを、私自身が「NVDA でアクセシビリティの検証をするディレクター」の立場で行うようになりました。
    ページが複数になったときには、タイトルをページごとに変えてもらうようにしました。
    アニメーションの機種依存振り分けの議論の途中で、 CSS で display:none するとスクリーンリーダーから読み取れなくなることを紹介すると、そうだったのかと驚かれました。
    「日時」や「会場」などの情報を h2 や h3 などの見出しレベルにどう割り当てたらよいのか、あるいは見出し要素に情報そのものを入れてしまっていいのか、といったことも議論しました。
    例えば「日時」という見出しがあって、その真下に「10月12日」と書いてあるのと、見出しそのものが「10月12日」になっているのは、どちらがうれしいだろうか。
    スクリーンリーダーの「見出しジャンプ」という機能を紹介すると、「じゃあ見出しに情報が入っていたほうが効率的だね」という議論になりました。
    一方で「日時」というテキストをスクリーンリーダー利用者にだけ読めるように提示する、というテクニックはどうだろう。
    いわゆる sr-only クラスのような実装はあるけれど、想定外の閲覧環境で（例えば -10000px の位置指定が）どうなるかわからないし、みんなが同じコンテンツを読むほうがよいのではないか、と私はアドバイスしました。
    テキストの表記についても、「10:00～」はちょっと不安。「10:00開始」はよさそう。「10時00分開始」はさらに安全。
    けれど、このあたりの読み上げはユーザーエージェントに依存しているし、読み手は 10:00 を時刻だと解釈できる可能性は高い、などなど。
    一方で IE や Edge でレンダリングが崩れる、といった指摘、機種依存文字の指摘、などもありました。
    プレビュー Web アプリのおかげで、効率的に検証することができました。
    ですが、Nyoho さんもご多忙だったので、実際に解決したい課題がすべてクリアできたのは、イベントの前日の夕方でした。
    この話には Python の要素がほとんどないのですが、今回の一連の作業を通じて、PyCon mini Hiroshima チームの中で「アクセシビリティ、こんな風にやっていくんだなあ」という感覚を共有できたこと、私自身も「アクセシビリティやっていき勢」としての活動ができたことを、ちょっぴりうれしく感じています。
    今回のイベントにスクリーンリーダーユーザーが参加してくださったわけではなく、リアルなフィードバックをいただくのもまだこれからの課題です。
    このチームの経験を、次回の PyCon mini Hiroshima で、かどうかはわかりませんが、どこかで活かしたいと思っています。