理解HTML標籤語義化
阿新 • • 發佈：2019-01-03
什麼是標籤語義化
標籤的語義
通過標籤判斷內容語義，例如根據<h1>標籤我們呢能夠判斷出該內容是標題，根據<p>標籤判斷出該內容是段落，根據<input>標籤判斷出該內容是輸入框等
如何判斷一個網頁是否遵循標籤語義化
去掉網頁樣式，看該網頁的結構是否良好有序，是否仍有很好的可讀性
為什麼標籤要語義化？
1. 標籤語義化對於搜尋引擎友好，利於SEO
2. 更容易讓螢幕閱讀器讀出網頁內容
3. 去掉或者丟失樣式的時候，頁面仍然能夠呈現清晰的結構
4. 便於團隊的開發與維護如何使標籤更具語義化
對於不同的內容使用對應的標籤，如段落使用<p>標籤，錨點使用<a>標籤
使用表格時，標題要用caption，表頭用thead，主體部分用tbody包圍，尾部用tfoot包圍。表頭和一般單元格要區分開，表頭用th，單元格用td；
用title、alt用於解釋名詞或解釋圖片資訊，活用label標籤
通過為<input>設定id屬性，在<label>標籤中設定”for = id”來讓文字和相應的<input>對應起來
儘可能地減少使用無語義的標籤如<div>和<span>
語意不明顯，可以用<p>也可以用<div>的情況下，儘量用<p>，因為<p>在預設情況下有上下間距，對相容特殊終端有利；
不要使用純樣式標籤，改用CSS設定
使用HTML5結構元素，如<head>、<footer>等，參考文章：HTML 5的革新——語義化標籤