それマグで!

知識はカップより、マグでゆっくり頂きます。 takuya_1stのブログ

習慣に早くから配慮した者は、 おそらく人生の実りも大きい。

忘れ去られゆくキーボード・ショートカット1 タブキーによる項目移動

キーボードショートカットが日本では忘れ去られようとしている

いつの頃からか、キーボードを使うのは「悪」という監査が蔓延っているようです。キーボードから直接入力することが危険だそうです。

f:id:takuya_1st:20190706170308p:plain ローソン銀行の例

絶滅危惧種のキーボード・ショートカット:タブキー

いまや絶滅危惧種になってしまった。「タブキーを知りません」と「入力時に押したことないです。」という人は、90%を超える(個人調べ)だろう。

自称:情強の情報系学生でも、タブキーを単体で殆ど使っていません。Alt+TabやCtr+Tabだとまだ使われているが、タブキー単体で押す人は殆ど皆無だと思われる。

タブキーはフォーカス移動

タブキーによるフォーカス移動を知らないのである。というかフォーカスを概念として知らない。

タブキーとエンターは組み合わせで使うものなのですが、「マウスカーソルを移動しクリック」だけが正しい操作だと倣っているのでしょう。タブキーをおしてエンターを押せません。

アプリケーションやウェブブラウザの入力項目はタブキーで移動することができます。エンターで選択することができます。

しかし、jQuery などで実装されたモーダルウインドウには「全く」これらのことが配慮されていません。タブでフォーカス移動もできない、Enterでクリック代替をすることもできません。中途半端な実装のモーダルウインドウのライブラリは滅びていいと思います。

また、jQeury で実装されたフォーム項目には対象項目を非表示のママ実装されているものがり、タブ移動ができない入力フォームが数多くあります。残念なことです。

タブキーが実装されている例

Twittertweet フォーム。

f:id:takuya_1st:20190706170827p:plain

f:id:takuya_1st:20190706170810p:plain

タブキーが忘れ去られると困ったことになる。

タブキーは「ハンディキャップ」の人たちにも大変有益だと思う。バリアフリーを声高に叫ぶ割に、身近なキーボードのキーを使わないまま配慮を忘れ去られゆく。

駐車場に車椅子のスペースを作るのと同じくらいWEBサイトや入力フォームにおけるTabキーは重要です。完全に愚痴でしかないが、日本では本当に軽視されていて、できれば政府が主導してガイドラインを定めるべき案件です。日本政府がいかにIT無能かわかるのではないでしょうか。

iOS にはタブキー相当の「入力項目の移動」があります。

iOS を見てみると、タブキーと呼ばずに「上下」の項目移動があります。これがPCのキーボードのタブに相当します。ところがほとんど認知されていません。悲しい限りです。

f:id:takuya_1st:20190706171951p:plain

さらにひどい悲しい事実として知ってほしい。この「入力項目の移動ボタン(タブキー)」が邪魔で消したいという人が後を立ちません。Q&Aサイトではよく質問で上がってきます。利用者からだけでなく、開発者のQ&Aサイトでもクライアントに言われたから消したいとう書き込みを何度か見かけたことがあります。

タブキーという呼び方が「ブラウザのタブ」とかぶる

タブキーという呼称が、残念なことに、ブラウザのタブと同じ音で同じスペリングのために、タブについて調べることが事実上不可能になっています。

また、タブといっても伝わらないので、タブキーと言わないと伝わらないことが多いです。これも希少化に拍車を掛けているのではないでしょうか。

タブはインデントだと思われている

「タブキーはインデント」のためにあると思いこんでいる人も多い。タブといえば、スペースとタブで宗教論になることも多いです。そのためタブで項目移動は忘れ去られゆく。

海外のサービスはWEBでもSPAでも比較的Tabキーを実装している

Slackなどもタブキーで項目移動をきっちり実装してたりします。tabindex を無視するスタイルなのは、日本の大手企業のWEBサイトによく見られます。イオンとかセブンとかローソンとか。

もしかしたら海外ではちゃんとdisabled people に対して配慮しているのか、スピード狂のためにTABキーを実装するのが文化として根付いてるかもしれない。

タブキーによる項目移動の使い方:tabindex

タブキーはフォーカス移動をして使うものです。

TABキーとShift+TABキーがペアで使われます。決定はEnter(またはSpace)を押します。

フォーカスを外したいときはESCです。

タブキーとESCとEnterはペアで使います。

これだけです。

開発者は、フォームの項目にtabindex を入れれば良いのです。入れなくても左上から順番に項目が選ばれます。フォーカスしたくない(ちょっと隠してたりdisabledなinput) なら -1 をいれてタブフォーカスを無効にすれば良いわけです。

このブログを書いているはてなブログでも、編集画面にはタブキーによるtabindex の項目移動は実現できていません。

Windows もTABキーを忘れようとしている。

Windows10から搭載された設定画面とエクスプローラーでは、以前ほどタブキーを使えないことが多いです。彼らもタブキーの存在を忘れてしまったのでしょう。

タブキーの存在

私達は、タブキーによる項目移動とフォーカスという概念を徐々に失っていると思います。

わたしとタブキーの出会い。

私は、タブキーをいつから使っているか思い出せません。パソコンを使い始めたのが2005 年ごろなのでそれ以降であることは間違いないです。ノートPCにして、マウスを捨てたのが2010 年頃なので、多分その頃から本格的に使ってると思います。

いまでは、タブキーで「はい・いいえ」を移動したり、「キャンセル」を押したり、入力フォームを手早く移動したり、無くてはならない存在ですが、徐々に使えない箇所が増えていて悲しい。

タブキーが使えると早いのに

タブキーが使えると入力が圧倒的に早くなります。RPAとかバズワードが飛び交ってますが、自動入力と定形入力の高速化より、まず入力者であり操作者であるわたしたちがタブキーによ入力高速化をしたほうが良いと思う。しかしそうなっていないのが少し残念。

多く人はタブキー忘れてしまったのでしょうか。

Windowsエクスプローラと設定もタブキーで操作しにくくなり、ウェブのjQuery モーダルはタブキーが動かず、iOS では邪魔者扱い。Excel入力でもタブ移動より矢印カーソルやマウスが好まれる。はてなブログでもタブキーで右側メニューを選べない。

このままタブキーによる項目移動は絶滅していく運命にあるのでしょうか。

タブキーめっちゃ使うよ!!って人がいたらコメントくだされば嬉しいです。