web-dev-qa-db-ja.com

Webショートカットに最適な修飾キーの組み合わせ

私のウェブサイトの多くのユーザーは、よく見るページにアクセスするためのキーボードショートカットを求めました。リンクにはaccesskeyが含まれることがありますが、それらにアクセスするには ブラウザ間で一貫性がない です。 JavaScriptを使用してショートカットを検出します。修飾キーがどうあるべきかについての入力をお願いします。私はに傾いています Ctrl+Shift

14
Mikhail

2つの例はおそらく「確立された実践」と呼ぶには十分ではありませんが、少なくとも2つの大きな例です。GoogleとTwitterはどちらも使用していません。または、この方法で表示したい場合、ナビゲーション用の修飾キーは G

Twitterの「お気に入り」ページにアクセスするには、 G、その後 F。 Gmailの下書きフォルダに移動するには、 G それから D

非ナビゲーションショートカットも単純な文字を使用します。例えば J リスト(ツイート、メールなど)を先に進めるため、 K 後方に移動します。*

*私の本では、これは絶対に間違っています。私にとって、「K」の左側にある「J」は、「J」が「前」であり、「K」が「次」であることを意味します。ただし、他の方法で行うのが標準のようです。

どちらも「実際の」修飾キーを使用しません。 Stack Exchangeサイトのキーボードショートカットも検討し始めており、同じことを行う可能性があります。修飾キーをまったく使用しない理由は2つあります。

  • すでに使用されているものをつまずく可能性が低くなります。 Ctrl、Alt、Meta、Command、Shiftの任意の組み合わせは、おそらく一部のオペレーティングシステム、ウィンドウマネージャー、ブラウザー、ブラウザープラグイン、またはGreasemonkeyスクリプトによって既に使用されています。手紙のみ?そんなにない。
  • 使いやすい。 「Ctrl-Alt-Qを押してFooタブを開き、次にMeta-Shift-F12を押してBarアクションを実行します」-それは私のキーボードショートカットの目的である私の人生をより簡単/より速くしません。

一方、考慮すべき2つの注意事項があります。

  • ユーザーがテキストボックスに入力しているときにキーストロークが発生した場合、キーストロークを無視する必要があることは明らかです。これは技術的な問題ではありませんが、ユーザーがショートカットを使用できないことを意味します。

    たとえば、ページが検索ボックスを自動フォーカスする場合、またはWebアプリのテキスト入力が非常に多い場合、問題が発生する可能性があります。

  • 有効化/無効化について考えることをお勧めします。キーボードショートカットはパワーユーザー機能です。 「通常の」ユーザーは、誤ってキーボードショートカットをトリガーすると驚かれる場合があります(明らかに修飾キーを押すと、この可能性が低くなります)。

    たとえば、Gmailのキーボードショートカットはデフォルトでオフになっていますが、 ? これは(当然)キーボードショートカットヘルプを表示します– 有効化/無効化へのリンクを含むショートカット。キーボードショートカットは、設定してもかまいません(ユーザー設定は、Stack Exchangeサイトで一般的に回避しようとしていることです)と言える領域であり、これに対するGoogleのソリューションは、この点でいいようです。

    しかし、「デフォルトでオフ」は明らかに、発見可能性を隠します。

–しかし、すべてのことを考慮すると、「モディファイヤキーなし」は私にとって良い解決策のように思えます。

12
balpha

「最適な」または汎用のキー修飾子の選択はありません

最適なオプションは次のとおりです。

  1. 修飾キーを使用せず(1回のキー押下のみ)、ユーザーのカーソルが入力フィールドまたはテキストエリアにあるときにキー押下の検出を停止します。Googleが Gmailショートカット

    - または -

  2. アナリティクスデータのオペレーティングシステムの統計に基づいて、訪問者の大部分に適したデフォルトを選択します。デスクトップソフトウェアと同様に、ショートカットが必要なパワーユーザーがショートカットをアクティブにし、ユーザー設定で修飾キーを上書きできるようにします。

    - または -

  3. 修飾キーの代わりに「トリガー」キーを使用します。検討する ,2 タブ付きナビゲーション領域の2番目のタブに移動し、 ,3 たとえば、3番目に移動します。コンマとそれに続く数字の組み合わせは、競合や偶発的なプレスの可能性を減らすのに十分なほどまれです。

すべての場合において、デフォルトでショートカットキーを無効にすることを検討することで、おそらくショートカットキーを気にしない大多数のユーザーの予期しない動作を防ぐことができます。

なぜ修飾子のコンボを選択しないのですか?

これらのメソッドを推奨する理由は、ブラウザ環境でJavaScriptを使用しても安全であると考えることができる標準化されたクロスプラットフォーム修飾子キーがないことです。を含むもの Ctrl、 Shift、 Alt、 または Cmd 特定のプラットフォームでブラウザのショートカットが壊れる可能性があります。

使用する提案 Ctrl+Shiftたとえば、Windows上のFirefoxショートカットを破壊します。多くの場合、その組み合わせを使用して 特殊機能 を実行します。 Ctrl + Shift + D、開いているすべてのタブをブックマークします。

クロスプラットフォームの標準がないため、ブラウザのメーカーは異なるショートカットを使用して、異なるプラットフォームごとにアクセスキーをトリガーします。 Appleは Ctrl Macおよび Alt たとえば、WindowsのSafariで。

さらに、各ブラウザはショートカットの競合を異なる方法で解決し、これはユーザーに予期しない結果をもたらします。 JavaScriptの機能にキー入力をバインドすると、ネイティブブラウザーのショートカットとしても機能します...

  • Firefoxは、return false;の場合、JavaScriptショートカットを単独で実行しますが、return true;の場合、Firefoxブラウザーのショートカットに続いてJavaScript関数を実行します(つまり、デフォルトで両方を実行します)。
  • IEはJavaScript関数を実行した後、IEブラウザーショートカットを実行します。
  • Safari/Chrome/Operaはブラウザのショートカットを処理しますが、JavaScriptのショートカットは処理しません。

[ソース:John Resigの jquery.hotkeys readme page のふもとにある補遺。]

8
Nick