只要使用正確的語意 HTML 元素，您或許可以滿足大部分或所有鍵盤存取需求。這表示您可以省下使用 tabindex 的時間，而且使用者也能獲得更多快樂！
免費鍵盤支援 (和更優質的行動裝置體驗)
一些內建互動元素，具有適當的語意和鍵盤支援。大多數開發人員使用的廣告是：
此外，含有 contenteditable 屬性的元素有時可用於任意形式文字輸入作業。
這些元素提供的內建鍵盤支援很容易被忽略。以下提供一些範例元素供您探索。建議您不要使用滑鼠，改用鍵盤操作。您可以使用 TAB (或 SHIFT +
TAB) 在控制項之間移動，也可以使用方向鍵和 ENTER 和 SPACE 等鍵來操控這些值。
如果您有手機，可以看出這些內建元素在行動裝置上多次出現不重複互動。嘗試自行重現這些行動互動功能是件苦差事！建議您盡可能使用內建元素 這是另一個好理由
以 button 取代 div
常見的無障礙功能反面模式，是將非互動式元素 (例如 div 或 span) 視為按鈕，方法是在其中新增點擊處理常式。
但使用者必須符合以下條件，才可視為可存取：
- 可透過鍵盤成為焦點
- 停止支援功能
- 支援
ENTER或SPACE鍵可執行動作 - 由螢幕閱讀器正確朗讀
div 按鈕沒有上述任一項目。也就是說，您需要撰寫其他程式碼來複製 button 元素帶來的免費內容！
舉例來說，button 元素有稱為「*合成點擊啟用」*的簡潔技巧。將「點擊」處理常式新增至 button 時，系統會在使用者按下 ENTER 或 SPACE 時執行該處理常式。div 按鈕沒有這項功能，因此您需要編寫其他程式碼來監聽 keydown 事件，檢查按鍵碼是否為 ENTER 或 SPACE，然後執行點擊處理常式。哎呀！
這需要很多額外的工夫！
請比較此例中的差異。使用 TAB 控制，並使用 ENTER 和 SPACE 嘗試點選這些項目。
如果現有的網站或應用程式中有 div 按鈕，請考慮將按鈕換成 button 元素。button 非常容易設計樣式，而且提供許多無障礙功能！
連結與按鈕
另一個常見的反面模式是將連結附加 JavaScript 行為，把連結視為按鈕處理。
<a href="#" onclick="// perform some action">
按鈕和連結都支援某種形式的合成點擊啟用功能。所以該選擇哪一個？
- 如果按一下元素，就會在頁面上執行動作，請使用
<button>。 - 如果按一下元素，會將使用者導覽至新頁面，請使用
<a>。這包括使用 History API 載入新內容及更新網址的單一網頁網頁應用程式。
這是因為螢幕閱讀器朗讀按鈕和連結的方式不同。使用正確的元素可協助螢幕閱讀器使用者瞭解預期的結果。
待辦事項：DevSite - 思考和檢查評量
樣式
部分內建元素 (尤其是 <input>) 可能難以設定樣式。只要善用一些聰明的 CSS，或許就能解決其中幾項限制。(又稱奇蹟) WTFForms 專案包含樣式表範例，介紹一些技巧，以便設定部分較難的內建元素設定樣式。
後續步驟
使用內建 HTML 元素可大幅提升網站的無障礙功能，並大幅減輕工作負擔。請嘗試使用 Tab 鍵瀏覽網站，找出任何不支援鍵盤的控制項。如果可以，請將其切換為標準化 HTML 替代項目。
有時，您可能會發現 HTML 中沒有相對應的元素。沒關係！請繼續閱讀，瞭解如何使用 tabindex 為自訂互動控制項新增鍵盤支援。