非モーダルダイアログを表示するボタンをアクティブ化した後、キーボードフォーカスはどこにあるべきですか？
次のような非モーダルダイアログを表示するボタンがあります。
[Show Symbol Picker]ボタンをクリックすると、シンボルピッカーの非モーダルダイアログが表示されます。ボタンをもう一度押すと、ダイアログは開いたままになり、他の非モーダルダイアログの背後にある場合は、前面に表示されます。
ボタンを使用してフォーカスすることができます Tab キー。ユーザーが Enter キーがフォーカスされている間、非モーダルシンボルピッカーは上記のように表示されます。
ただし、ユーザーがボタンを押した後、どこにフォーカスを置くべきかわかりません。 Enter キー。それはダイアログまたはボタンのどちらにあるべきですか？モーダルダイアログが既に開いていて、ボタンが再度押された場合はどうなりますか（通常、開いているダイアログが前面に表示されるアクション）。
キーボードのアクセシビリティに関する信頼できる情報源を見つけたいのですが。また、ボタンや非モーダルダイアログを排除する代替設計を探していません（これは、既存の設計のビジネス要件であり、現時点では変更する権限がありません）。
ここにもっとコンテキストが必要です。デスクトップ（windows、mac）アプリの動作はWebとは異なります。
デスクトップ
ダイアログが新しいウィンドウとして開きます。通常、新しいウィンドウがフォーカスされます。ユーザーは、小さいダイアログを維持したまま、タブでフォーカスをメインウィンドウに戻すことができます。または、ウィンドウを閉じるショートカットを使用してウィンドウを閉じます（Windows：Ctrl + W、Mac：Cmd + W）。
Web
Webの動作は少し異なりますが、「Esc」キーを使用してダイアログを閉じることも一般的です。いつものように、ユーザーが新しいダイアログを表示するアクションを実行することを選択した場合、ユーザーは新しいダイアログの要素と対話したいという想定になります。ダイアログの最初のボタンにフォーカスを置きます。タブはダイアログのすべてのボタンを通過します。ダイアログを閉じるための「X」もタブ可能にする必要があります。ユーザーは「Shift + Tab」で「X」またはすべてのボタンからタブにアクセスして「X」に戻るか、「Esc」を押して直接モーダルを閉じることができます。
Updateコメントから、OPは、ユーザーがメインウィンドウでシンボルを表示できることで実際にメリットがあることを示しました。したがって、ダイアログを画面に直接表示されるサイドペインとして扱うことを検討する必要があります。または、WAI_ARIAで定義されている「グループ」 http://www.w3.org/TR/2013/WD-wai-aria-practices-20130307/#kbd_layout_whatgroup おそらく、グループを「ショー」に関連付けます記号ピッカー」ボタン。開いている場合は、最初のボタンにフォーカスを当てますが、ユーザーがタブをシフトして[ピッカーの表示]ボタンに戻ることができるようにします。または、ユーザーがボタンリストの最後にいる場合、タブは[ピッカーの表示]ボタンの後の次の要素にフォーカスを移動しますメイン画面で。
動的に追加/新しいコンテンツ：
これが「モーダルダイアログ」ではなく、トリガー要素（リンクまたはボタン）によって作成されたコンテンツであると主張する場合、WCAGには、新しいコンテンツの処理方法に関するわずかに異なるガイドがあります。
"トリガー要素の直後のドキュメントオブジェクトモデルへの動的コンテンツの挿入" の実装については、このWCAGリソースを参照してください。
スクリーンリーダーでの読み上げ順序は、デフォルトのタブ順序と同様に、ドキュメントオブジェクトモデルのHTMLまたはXHTML要素の順序に基づいています。この手法は、スクリプトをトリガーするためにアクティブ化された要素の直後に新しいコンテンツをDOMに挿入します。トリガー要素はリンクまたはボタンである必要があり、スクリプトはonclickイベントから呼び出す必要があります。これらの要素はネイティブにフォーカス可能で、onclickイベントはデバイスに依存しません。フォーカスはアクティブ化された要素に留まり、その後に挿入される新しいコンテンツは、タブ順とスクリーンリーダーの読み順の両方で次のものになります。
「説明」セクションでWCAGに準拠するためには、トリガーするボタンのDOMの直後に新しいDOMを挿入するだけでよいことを示唆しているようです。これは、より一般的には達成しようとしていることに当てはまり、ビジネス要件を満たしているようです。すぐにクリックした後のタブオーダーと現在のフォーカスに関する情報も提供します。
ダイアログ：
ボタンをクリックすると、コンテンツが画面に追加されます。フォーカスが新しいコンテンツにシフトされる必要があります。そうしないと、スクリーンリーディングユーザーが失われます。ダイアログが閉じられるまで、ユーザーはダイアログの外にタブ移動できません。
ダイアログなどの新しいHTMLコンテンツは、それをアクティブ化した要素の直後にDOMに挿入する必要があります。フォーカスは新しいダイアログに送られ、その中に閉じ込められる必要があります。 ESCキーでダイアログを閉じる必要があります。 X（閉じる）ボタンがキーボードでアクセスでき、代替テキストがあることを確認します。ダイアログが閉じると、フォーカスはそれをアクティブにした要素に戻ります。
私はWCAGワーキンググループによって管理されているWikiによってこのリソースに誘導されました。 wiki /ソースはここにあります： http://www.w3.org/WAI/GL/wiki/Managing_focus_for_modal_dialogs
利用可能な追加のリソース、および実装に関するいくつかの指示/ガイドがあります。アプリケーションがWebアプリケーションでない場合でも、多くの要点が適用されます。