如何爲D3.js製作的時間軸滑塊實現508 Compliance（如Aria）？

Question

我瞭解Aria的用法並使應用程序可以訪問網絡。但我不知道如何實現時間線滑塊的遵從性方法。我怎麼會搶刷的焦點，並將它讀取其數據的輔助技術（如屏幕閱讀器）

這是plunk I'm working with。

Answer 1

在創建一個對象，它是由屏幕閱讀器用戶可用的第一步是使鍵盤的交互。

我不知道我完全理解你與但從鍵盤角度開展工作的對象，它看起來像它應該表現得像一個列表框，允許連續選擇。

在正常的列表框中，這些項目是垂直列出的。你的「列表」是水平的。

在一個正常的列表框，我可以使用向上/向下箭頭鍵列表框內移動選擇。選擇突出顯示。在你的「列表」中，我應該可以使用左/右箭頭鍵將當前選擇移動到其中一個塊。無論這個區塊是寬的還是在前幾個區段中，還是狹窄的，如在最後一個區段中一樣，都沒有關係。當我向左或向右移動時，選擇適當的塊。

在一個正常的列表框，一旦我有一個項目中選擇，我可以通過同時使用向上/向下鍵按住shift鍵延伸該選擇。在你的「列表」中，我應該能夠按住shift鍵，同時使用左/右箭頭鍵來擴展我的選擇。這模仿拖動按鈕按下鼠標。

一旦你的工作，得到了反饋，屏幕閱讀器的用戶僅數步之遙。其中一個簡單的方法就是在詠歎調直播區域。每次選擇更改或擴展時，您都可以更新詠歎調直播區域內的文本。更新文本時將更改此更改。文本本身可以從視覺用戶隱藏，或者像dandavis用他的例子所暗示的那樣，顯示所選擇的範圍可能對視覺用戶有幫助。