在 HTML5 中 新增了語意標籤，用意是：

• 取代掉不具意義的 <div> 等tag
• 用語意化標籤來加強文件的結構化。

HTML 5 中新增的 tag 其實參考了以往網頁設計師在設計網頁時所使用的 ID 或 class，但是因為 ID 與 class 的命名很容易有分歧，例如導覽列，你可能看過的寫法就有 <div class=“menu”>、<div class=“nav”>、<div class=“navigation”>，但這樣其實不利於團隊的專案管理，而 HTML5 新增的標籤則有助於管理，另外也有助於瀏覽器、搜尋引擎讀取網頁，有助於網頁的 SEO。

HTML5 所有新增的標籤可以參考這裡

下面就比較常用的標籤來做說明。
要注意的是，不要把以前用 div 加 class 的觀念，帶來新的標籤上使用，因為他們有各自定義的使用目的。

<header>

標題元素：預設為區塊元素，為文章或區塊定義標題。

一個頁面中可以有多個header。<header>是一容器，但裡面裝的東西應該只有區塊的標題或者摘要。另外，w3.org 中有提到 <header> 不能放在 <footer>、<address>或另一個 <header>裡面。

<nav>

導覽列。裡面裝的東西應該只有主要的navigation links，用來連結到網站其他頁面，或者連結到網站外的網頁。不要把各種link都丟到裡面。

<nav> 不可以放到<address> 裡面。

<main>

網頁的主要內容，一頁 HTML 只能出現一次。

<section>

文件中的一個群組或區塊。一般來說，section 裡面的應該是有意義且附帶標題的一段內容，裡面都會包含 title 或 heading。
不要把 當作 div 來使用，他們的使用目的不同。

<section>不可以放到<address> 裡面。

<article>

article 是獨立的區塊包含完整的內容，也必須帶有heading。
article跟section的區分是，article有更高的獨立性及完整性。

article 是可以獨立存在、具有完整內容、可獨立於網站其他部分的區塊；而section雖然也具有獨立表達內容的能力，但是對外層有一定的相依性。

例如：雜誌、部落格的文章、報紙文章等。

<aside>

aside 元素定義了除了內容之外的其他內容。例如：側邊欄。
aside 的內容應該與周圍的內容有相關性。

<figure>

figure 是一個有完整內容的區塊，是主要內容的一部分，可以任意移動位置而不影響整體內容的表達。例如：圖片與標題可以組合在 figure 元素裡。

<footer>

footer 代表一個區塊的結尾訊息。footer內通常會包含作者、版權等資訊。

善用 HTML5 標籤，可以讓網頁更有語意化，瀏覽器、搜尋引擎也會更易解讀、搜尋。
明天再繼續介紹對於 HTML5 標籤的選用，各位看倌明天見囉～

參考資料：
[1] https://www.w3.org/TR/2012/WD-html-markup-20121025/elements.html
[2] https://www.w3schools.com/html/html5_new_elements.asp