可訪問性 語義元素
語義元素 = 具有含義的元素。
為使用者提供一種良好的方式來導航和與您的網站互動。使您的 HTML 語義化。語義化是關於在 HTML 中使用正確的元素。HTML 5 中大約有 110 個元素。
其中兩個沒有含義——<div> 和 <span>。它們不告訴我們任何關於內容的資訊。它們沒有內建的可訪問性功能，因此我們應始終檢查是否有其他元素更適合。語義元素的示例：<form>、<table> 和 <article>。它們清楚地定義了內容。
Uber 的簡單示例
在這個 Uber 的例子中，我們有五個元素
- 一個標題
- 一個段落
- 一個按鈕
- 一個連結
- 一張圖片
這些元素可以被翻譯成 HTML
<h2><p><button><a><img>
這是正確的嗎？儘管“Sign up to drive”（註冊成為司機）看起來像一個按鈕，但 Uber 使用的是 <a> 而不是 <button>。這是程式碼，稍作簡化
<h2>加入司機行列，開始賺錢</h2>
<p>在擁有最大活躍乘客網路的平臺上開車。</p>
<a href="/signup/drive/>註冊成為司機</a>
<a href="/en/drive/">瞭解更多關於駕駛和配送的資訊</a>
<img src="driver.jpg" alt="">
這是語義正確的。按鈕被編碼為連結，因為它像連結一樣工作。它將使用者帶到另一個檢視。連結被樣式化為按鈕無關緊要，它仍然是一個連結。
應將 <button> 元素用於執行當前頁面操作的任何互動。應將 <a> 元素用於導航到另一個檢視的任何互動。
現在您已經掌握了語義化的基礎知識，讓我們檢查一下 HTML 工具箱中有哪些語義元素。接下來是地標。
