# Semantic Elements 語意標籤
###### tags: `HTML`
>以往只能用 div標籤來劃分區塊，**HTML5** 新增了語意化標籤，使得網頁中每個區塊的設計目的可以更清楚的表現。

### 常用語意標籤
| 語意標籤 | 語意含義 |
| -------- | -------- |
| `<section>` | 有自己明顯含義的**區塊** |
| `<article>` | 內容本身是獨立且**完整的區塊** |
| `<nav>` | 導航連結區塊 |
| `<header>` | 標頭區塊 |
| `<footer>` | 頁尾區塊 |
| `<main>` | 頁面主要內容區塊 |
| `<aside>` | 跟主要內容無關的區塊 |
| `<figure>` | 引用图片、表格 |
| `<adress>` | 聯絡訊息 |

:::warning
`<nav>` `<section>` 不能放進 `<address>` 裡面。
:::
### 語意標籤優點
#### SEO 優化
因為結構明確的關係，所以搜尋引擎在搜尋網站的同時，可以更精準。同時也因為架構明確，會被搜尋引擎判斷是個架構完整網頁，也會提升網站的排名。

#### 維護管理方便
在找看標籤的同時，可以直接推測出此標籤的內容，使得網站管理、維護工作會更簡單與容易。