一、HTML語義化的背景
HTML結構語義化，是近幾年才提出來的，對比之前的 HTML 結構，大多是一堆沒有語義的標籤。用的最多的就是 DIV+CSS，為了改變這種現狀，開發者們和官方提出了 HTML結構語義化的概念，並且在 HTML5 新增了很多語義化標籤。
二、HTML語義化的概念
語義化是指根據內容的結構，選擇合適的標籤，便於開發者閱讀和寫出更優雅的程式碼的同時，讓瀏覽器的爬蟲和機器很好的解析。
三、HTML語義化的必要
隨著網際網路的發展，WEB承載越來越多的資訊（圖片，音訊，視訊等），人們開始用機器來處理網路資訊，就此誕生了搜尋引擎。如次龐大及複雜的資訊如何讓搜尋引擎處理和挖掘，所以讓機器能夠更好地讀懂WEB上內容就變得越來越重要。
傳統的Web由文件組成，W3C希望通過一組技術支撐 “資料的Web”，即 Web of Data，將Web看作一個儲存和管理資料的大型分散式資料庫。語義Web是構造這樣的資料Web的重要一環，幫助人們建立資料並儲存在Web上，建立相關的詞彙表及資料的處理規則。
四、HTML語義化的作用
4.1 頁面結構清晰
去掉或 CSS 樣式丟失的時候,也能讓頁面呈現清晰的結構，增強頁面的可讀性。
4.2 支援更多裝置
方便其他裝置解析（如螢幕閱讀器、盲人閱讀器、移動裝置）以有意義的方式來渲染網頁。
4.3 利於SEO優化
和搜尋引擎建立良好溝通，有助於爬蟲抓取更多的有效資訊，搜尋引擎的爬蟲也依賴於標記來確定上下文和各個關鍵字的權重。
4.4 便於團隊開發和維護
在團隊中大家都遵循W3C標準，可以減少很多差異化的東西，方便開發和維護，提高開發效率，甚至實現模組化開發。
五、HTML語義化的方法
（1）根據文件上下文結構合理的選用最適合表達當前語義的標籤；
（2）儘可少使用無語義的標籤 <div> 和 <span>；
（3）不要使用帶有樣式的標籤，比如：<b> 、 <u> 、 <font> 等，使用 CSS 設定；
（4）標題標籤的使用應該根據重要性逐級遞減，沒有斷層，並且一個頁面只能有一個 <h1>；
（5）提高關鍵詞密度，如影像的替代文字 alt，提示文字 title；
（6）正確使用內容容器，比如段落 <p>，列表 <ul>, <ol>, <li>, <dl>, <dt>, <dd>;
（7）需要強調的文字，可以使用 <strong> 或 <em> 標籤（瀏覽器預設樣式，能用 CSS 設定就不用）， <strong> 預設樣式是加粗（不用 <b>），<em> 是斜體（不用 <i>）；
（8）表格注意使用，標題 <caption>，表頭 <thead>，表格主體（正文）<tbody>，表注（頁尾）<tfoot>。<tr> 定義表格行，<th> 定義表頭，<td> 定義表格單元。
（9）表單域使用 <fieldset>標籤，並且<legend> 標籤為 <fieldset> 定義標題；
（10）每個 <input> 標籤對應的說明文字都需要使用 <label> 標籤，通過為 <input> 設定 id 屬性，並且在 <lable> 標籤中設定 for=id 使說明文字和對應的 <input> 關聯。