如何使網頁上的結帳進度欄可以訪問？

Question

通過結帳進度條，我的意思是這樣的：

我試圖做這樣的Web UI組件訪問，特別是對屏幕閱讀器（如JAWS）的用戶。我一直在Google上搜索幾個小時才能找到一些爲這種用例設計的詠歎調屬性，但沒有找到。

我可以想到的一個不太優雅的解決方案是，只要這個進度條發生變化 - 前進或後退，就可以使用javascript生成一條警告消息，格式如「你完成了：abc，你現在在：d，你仍然有：efg要走「。我想知道是否有更好的方法來做到這一點。

Answer 1

使用HTML5的進度標籤和ARIA的進度條角色。

http://www.w3schools.com/tags/tag_progress.asp

https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_progressbar_role

Answer 2

一個水平時間線可以很容易地安裝有引導3和內聯列表是這樣的：

<ul class="list-inline"> 
    <li>Item 1</li> 
    <li>Item 2</li> 
    <li>Item 3</li> 
</ul> 

，這將導致（與造型）出現這樣的：

查看電子書： http://codepen.io/richfergus/pen/pNvRWd?editors=1100#0