一、HTML5語義化標簽
| 標簽 | 描述 |
|---|---|
| <article> | 頁面獨立的內容區域。 |
| <aside> | 頁面的側邊欄內容。 |
| <bdi> | 允許您設置一段文本，使其脫離其父元素的文本方向設置。 |
| <command> | 命令按鈕，比如單選按鈕、復選框或按鈕 |
| <details> | 用於描述文檔或文檔某個部分的細節 |
| <dialog> | 對話框，比如提示框 |
| <summary> | 標簽包含 details 元素的標題 |
| <figure> | 規定獨立的流內容（圖像、圖表、照片、代碼等等）。 |
| <figcaption> | <figure> 元素的標題 |
| <footer> | section 或 document 的頁腳。 |
| <header> | 文檔的頭部區域 |
| <mark> | 帶有記號的文本。 |
| <meter> | 度量衡。僅用於已知最大和最小值的度量。 |
| <nav> | 導航鏈接的部分。 |
| <progress> | 任何類型的任務的進度。 |
| <ruby> | ruby 注釋（中文注音或字符）。 |
| <rt> | 字符（中文注音或字符）的解釋或發音。 |
| <rp> | 在 ruby 注釋中使用，不支持 ruby 元素的瀏覽器所顯示的內容。 |
| <section> | 文檔中的節（section、區段）。 |
| <time> | 日期或時間。 |
| <wbr> | 規定在文本中的何處適合添加換行符。 |
二、語義化標簽的使用
2.1 <title></title> 頁面主要內容
（1）<title> 標簽的特點是簡短、描述性、唯一，用於提升搜索引擎排名。
（2）搜索引擎會把 title 作為判斷頁面主要內容的指標，有效的 title 應該包含幾個與頁面內容密切相關的關鍵字，建議將 title 的核心內容寫在前 60 個字符。
2.2 <header></header> 頁眉
（1）HTML5 規范描述為“一組解釋性或導航型性的條目”，通常有網站標志、主導航、全站鏈接以及搜索框。
2.3 <nav></nav> 導航
（1）頁面的導航鏈接區域，用於定義頁面的主要導航部分。
（2）導航通常使用 <ul> 無序列表。若是面包屑鏈接，則使用 <ol> 有序列表。
（3）HTML5 規范不推薦對輔助頁腳鏈接使用 nav，除非頁腳再次顯示頂級全局導航、或者是招聘信息等重要鏈接。
2.4 <main></main> 主要內容
（1）網站頁面的主要內容，並且一個頁面只能使用一次 <main> 標簽。
（2）若是 web 應用，則包含其主要功能。
2.5 <article></article> 文章標記
（1）表示的是一個文檔、頁面、應用或是網站中的一個獨立的容器。
（2）HTML5 規范聲明 <article> 標簽適用於自包含的窗口小部件:股票行情，計算器，鍾表，天氣窗口小部件等。
（3）<article>這個標簽可以嵌套使用，但是他們必須是部分與整體的關系。
2.6 <section></section> 區塊
（1）一組相似主題的內容，一般會有一個標題。
（2）實現比如文章的章節，標簽式對話框中的各種標簽頁等功能。
2.7 <aside></aside> 側邊欄
（1）表示一部分內容與頁面的主體並沒有較大的關系，並且可以獨立存在。
（2）實現比如升式引用、側邊欄、相關文章的鏈接、廣告、友情鏈接等功能。
2.8 <footer></footer> 頁腳
（1）和 <header> 標簽對應，可以實現比如附錄、索引、版權頁、許可協議等功能。
2.9 <cite></cite> 引用
（1）表示它所包含的文本對某個參考文獻的引用，比如書籍或者雜志的標題。
（2）按照慣例，引用的文本將以斜體顯示。
（3）用 <cite> 標簽把指向其他文檔的引用分離出來，尤其是分離那些傳統媒體中的文檔，如書籍、雜志、期刊，等等。
2.10 <blockquote></blockquote> 塊引用
（1）<blockquote> 與 </blockquote> 之間的所有文本都會從常規文本中分離出來，經常會在左、右兩邊進行縮進（增加外邊距），而且有時會使用斜體。也就是說，塊引用擁有它們自己的空間。
2.11 <q></q> 短的引用
（1）瀏覽器經常在引用的內容周圍添加引號。
（2）根據 HTML 4.01 規范，q 元素應當使用分界引號來呈現，就是說，q 元素包含的文本必須以引號來開始和結束。
2.12 <time></time> 日期或時間
（1）如果未定義 datetime 屬性，則必須在元素的內容中規定日期或時間。
2.13 <abbr></abbr> 簡稱或縮寫
（1）通過對縮寫進行標記，您能夠為瀏覽器、拼寫檢查和搜索引擎提供有用的信息。
（2）可以在 <abbr> 標簽中使用全局的 title 屬性，這樣就能夠在鼠標指針移動到 <abbr> 元素上時顯示出簡稱/縮寫的完整版本。
2.14 <dfn></dfn> 特殊術語或短語的定義
（1）現在流行的瀏覽器通常用斜體來顯示 <dfn> 中的文本。
（2）與其他許多基於內容的樣式和物理樣式標簽一樣，<dfn> 標簽盡量少用為妙。
2.15 <del></del> 刪除的文本
（1）和 <ins> 標簽配合使用，來描述文檔中的更新和修正。
2.16 <ins></ins> 插入文本
2.17 <code></code> 源代碼
（1）用於表示計算機源代碼或者其他機器可以閱讀的文本內容。
2.18 <pre></pre> 預格式化的文本
（1）被包圍在 pre 元素中的文本通常會保留空格和換行符。而文本也會呈現為等寬字體。
（2）若使用 <pre> 標簽來定義計算機源代碼，比如 HTML 源代碼，則使用符號實體來表示特殊字符，比如 "<" 代表 "<"，">" 代表 ">"，"&" 代表 "&"。
（3）可以導致段落斷開的標簽（例如標題、<p> 和 <address> 標簽）絕不能包含在 <pre> 所定義的塊里。盡管有些瀏覽器會把段落結束標簽解釋為簡單地換行，但是這種行為在所有瀏覽器上並不都是一樣的。
（4）pre 元素中允許的文本可以包括物理樣式和基於內容的樣式變化，還有鏈接、圖像和水平分隔線。