読者です 読者をやめる 読者になる 読者になる

ブラウザの空間ナビゲーション

この記事はWeb Accessibility Advent Calendar 2013のゲリラ投稿です。何か書いてみようかなーと色々思案し、ネタを思いついたところで投稿しようとしてアドベントカレンダーのページを開いたら全部枠が埋まっていたので何日目とか関係なく仕方なくゲリラ投稿します。

さて、Web Accessibilityということで非常に悩んだ物の、ブラウザエンジニアもどきを自称する私としては、本稿ではブラウザの空間ナビゲーションについて語ろうと思っています。

What is 空間ナビゲーション?

キーボードを用いてページ中のフォーカスを移動する機能です。それだったらタブキーで出来るじゃねーかと思う方も沢山いらっしゃるかもしれませんが、矢印キーでフォーカスを移動できる機能です。

空間ナビゲーション - Opera Wikiの記述を引用してみましょう。

空間ナビゲーションとは、レンダリングされたページ上の要素を html の構造に関わらず、表示された位置関係によって上下左右にフォーカスを移動出来るキーボードナビゲーションのこと。

です。 フォーカス移動先の要素を判別するアルゴリズムはヒューリスティックなものにならざるを得ず、おまけに矢印キーはフォーカス移動以外でも頻繁に使用される為、実装によって完成度がまちまちかつ、それぞれにクセがあるのですが(後述)、視覚で把握した空間情報をフォーカス移動に直接反映できるため、タブキーでのフォーカス移動にくらべると遥かに扱いやすい操作を提供しています。

また、矢印キーによって操作が可能であるため、ゲームコントローラーの十字キーなどと相性のいいインターフェースでもあります。

その機能特性上、視覚に頼る部分が大きい為、a11yというよりもUXの文脈で語るべき内容かもしれませんが、ゲリラ投稿ということでご容赦いただければと思います。

空間ナビゲーションの実装

空間ナビゲーションの実装で最も著名なものはPresto時代のOperaに実装されていた物ではないかと思います。shiftキーと合わせて矢印キーを使用する自動的に有効になり、ページ中を縦横無尽に駆け巡る事が出来ました。フォーカスリングの視認性の良さと、人間の飛びたい真理のつぼを抑えたジャンプ先選定は本当に心地の良いもので、キーボードブラウジングの心強い友ではありましたが、OperaがPrestoを捨てBlinkと駆け落ちした後、Blinkベースで再登場したOperaを名乗るブラウザからは消えました。未だに載っていません。開発断念記念でOperaないしPrestoのソースコードが公開される事も無かった為、その快適な実装のアルゴリズムの詳細は時代の波間に消える事となりました。たぶん世界中を探せば実装を知っている元Opera社員もいることと思いますが、まあNDAかかってるでしょうし期待しない方が幸せでしょう。

真なるOpera (Presto)が消滅し、その後継を自称するOpera (Blink)に未だに実装されていない為、表舞台から消え去ったと(たぶん)思われている空間ナビゲーションですが、実際には、Opera以外にも実装が存在しています(一応)。

Firefox 27 (現在Aurora、そのうちBeta)以降の実行バイナリの奥深くに格納されたSpatialNavigation.jsmというモジュールの内部に空間ナビゲーションは眠っています。ですが、Operaのそれと比べてはいけない。とりあえず動くだけの未完成品です。私の記憶では2008~10年頃に既に何かしらの形式で実装が存在していた覚えが有りますが、改めて当該モジュールの変更履歴を確認すると、2013年10月と、ついこの間に導入された事になっています。一度削除されたものが再度導入されたか、私の記憶違いのどちらかと思いますのであんまり気にしないでください。

この再導入の経緯も、セットトップボックス上のAndroidFirefox for Androidを(確かゲーム目的で)動かすためのouyaと呼ばれるプロジェクトによるものなので、Firefox for Androidではデフォルトで有効になっていますが、デスクトップ版のFirefoxではこの機能を起動する為の実装すら存在していません。デスクトップ版のFirefoxで機能を試すには、未実装箇所を補完するアドオンを導入する必要が有ります。ということで補完して有効にするアドオンを作ってみました

Firefoxの空間ナビゲーションを使ってみる

このアドオンの使い方は簡単です。リンク先(gist)から"Download Gist"し、中に入っている - bootstrap.js - install.rdf をzipアーカイブにまとめ、拡張子をxpiに変更し、NightlyでもAuroraでもBetaでもなんでもいいので、Firefox 27以降にDrag&Dropしてインストールすれば即座に現在開いている全ウィンドウの全タブおよび今後開く全ウィンドウの全タブで空間ナビゲーションが有効になります。

空間ナビゲーションを無効にするにはアドオンを無効にすればいいのですが、SpatialNavigation.jsmの実装の都合上、内部的なモジュールの起動は可能なのですが、終了が不可能になっているので、アドオンを無効にしても、その後に開くタブでのみ無効になるだけで、すでに空間ナビゲーションになっているタブは閉じるまで有効になったままです。いいですね、この「どうせデスクトップで使うヤツはいないだろう」と言わんばかりのやっつけ仕事感。導入経緯を考えればやむなしと言えますが、それでもFirefox for Androidにおいて、オプションで有効から無効に切り替えた場合にどうするんだろうという気になります。

ちなみにこの空間ナビゲーションは、組み合わせるキーが指定されているはずなのですがページ内にフォーカスした状態で矢印キーを押すだけで動きます。おお!やった動いたぞ!すげえ!Operaの専売特許じゃなかったんだ!これでOpera公国Presto朝からの亡命者もがっちりゲットだ!と思う方もいらっしゃるかもしれませんが、そうは問屋がおろしません。

まず、Operaほどジャンプ先がこなれていない。ときどき、見出しではなくその隣の関連リンクに飛ぶ時が有ります。おまえは構造化文書という言葉を知っているのか。しかもテキストエリア内にフォーカス移動したあとが致命的です。テキストエリア内で矢印キーを押すと、テキストエリア内を移動することを通常は期待すると思いますが、この空間ナビゲーションは他の要素に浮気してジャンプします。なんというチャラさ。明らかにイベントハンドリングの思慮が足りない。

そして何よりも、Opera (Presto)の青くて太いものと違って、Geckoのフォーカスリングは細い点線なので、どこにジャンプしたのかわからない。ダメじゃん。何かがおかしい。やっぱりGeckoのフォーカスリングの細さは何かがおかしい。早く太くてぶっとい視認性がいいUserAgentスタイルにアップデートされるべき。Break the Webとかどうでもいいので早くフォーカスリングを太くしろGecko

とまあこんな感じに、まだまだこなれていない感じですが、今後こなれてくれれば有望かもしれません。もっとも、かなりマイナー機能という事もあり、たぶん誰かが積極的にバグ報告をするか、パッチを書かない限りは(放っておくだけでは)改良され難いモジュールでもあります。自分も何点か直したい欲がウズウズしているのですが、たぶん私よりもOpera (Presto)の空間ナビゲーションを知っていた方がよりよい実装を提案できる気がするので、旧Operaユーザーで空間ナビゲーションフリークでFirefoxに難民もしくは亡命された方の大活躍に期待させていただきたくも思います。

ブラウザがもつべき役割

ここ数年の華々しい「Webプラットフォーム化」の割に、こうした、一見地味ながらも堅実かつユーザーを豊かにする機能がすっかり陰に隠れ気味なのは嘆かわしい事だと思っています。かねてよりブラウザはWebのGUIシェルであるという自説を唱えている私としては、Webの技術面が豊かになっていく一方で、こうしたユーザー体験の補助技術があまり活発でないことは残念に思います。Webは開発技術者のためにあるのではなく、万人のために存在する物です。開発技術者のためだけに存在するのであれば、コマンドラインから起動するだけでよいのです。そうではなく、幅広いユーザーにあまねくWebを使ってもらう為のブラウザであるからこそ、こうしたユーザーの使い勝手を地道ながらも向上させる方法に、もう少し力を注いでいってほしいと思う次第です。もし誰もやらないのであれば、OSSということで自分がやるだけとも言えますが、それでも個人の力ではやはり足りないので、ブラウザベンダももう少しだけ本気になってくれていいのです。

Indie UIとかが今後やって来るしね。

なんかアクセシビリティというよりもユーザビリティに寄ってしまった結論だけど、まあ、いいか。