https://www.cnblogs.com/Lee-ahao/p/6555771.html

WHAT（何為語義化） 很多時候我們寫HTML，為了方便都會直接使用div和span標籤，再通過class來確定具體樣式。網站哪一部分為標題，哪一部分為導航，哪一部分為頭部和底部，都只能通過class進行確定，但class命名規範卻又沒有一套統一的標準，因此導致很多時候無法確定整體網站的結構。 因此，在HTML5出現後，添加了關於頁面佈局結構的新標籤。而在HTML書寫過程中，根據不同的內容使用合適的標籤進行開發，即為語義化。 WHY（為什麼要語義化） 語義化的優勢主要在於下面幾點： 1.其他開發者便於閱讀程式碼，通過不同標籤明白每個模組的作用何區別； 2.結構明確、語義清晰的頁面能有更好的使用者體驗，在樣式（css）沒有載入前也有較為明確的結構，更如img這一類的，在圖片無法載入的情況下有alt標籤告知使用者此處圖片的具體內容； 3.利於SEO，語義化便於搜尋引擎爬蟲理解，和搜尋引擎建立良好的溝通，能讓爬蟲爬去更多關鍵有效的資訊； 4.方便其他設別閱讀（如螢幕閱讀器，盲人裝置和移動裝置等）。 HOW（如何語義化） 語義化大致如下圖所示 一般的網站分為頭部、導航、文章（或其他模組）、側欄、底部，根據不同的部位，使用不同的標籤進行書寫。 表示頁面不同位置的標籤：header、nav、article、section、footer、aside 表示具體元素的作用或者意義的標籤：a、abbr、address、audio、blockquote、caption、code、datalist、del、detail、ol、ul、figure、figuration、img、input、mark、p...... 具體太多不詳細列了，可以去 http://www.w3school.com.cn/

查一下 除了頁面具體結構不再只使用div進行佈局，還有在一些標籤的使用上也需要注意，如關於b標籤和strong標籤的例子。 在w3c中有這麼一段話 以下元素都是短語元素。雖然這些標籤定義的文字大多會呈現出特殊的樣式，但實際上，這些標籤都擁有確切的語義。 我們並不反對使用它們，但是如果您只是為了達到某種視覺效果而使用這些標籤的話，我們建議您使用樣式表，那麼做會達到更加豐富的效果。(頁面地址:http://www.w3school.com.cn/tags/tag_phrase_elements.asp) b標籤這是純粹的樣式標籤，表明這段文字需要加粗，但strong標籤則是語氣標籤，除了加粗外，在html結構中表示這個是強調的內容。同樣道理的還有i標籤與em標籤。