第一次參加鐵人賽～新手中的新手，一步一腳印的學習筆記就在這邊跟大家分享啦！
第一篇文章先來簡單介紹HTML5實用的語意化標籤，HTML屬於標記式語言，用< >符號組成標籤(tag)與屬性(attribute)，來表示功能單位、建立架構，並使用『巢狀結構』來組合標籤，讓瀏覽器顯示出標題、段落、超連結、圖片、清單⋯等。

語意化標籤

語意化標籤(Semantic Elements)又稱為結構標籤，是HTML5開始有的，讓瀏覽器更加清楚標籤定義的區塊。目的是讓搜尋引擎更清楚了解每個< tag >的意義，清楚了解每個區塊的設計目的，有助於SEO優化。
HTML5之前每個區塊都使用< div >來設計，現在能使用< header >(頁首)、< footer >(頁尾)、< nav >(導覽列)、< main >(主要內容)、< article >(文章)、< section >(段落)、< aside >(側邊欄)。

標籤功能

• header 網站頁首｜通常包含logo、標題
• nav 導覽列｜網站分頁連結
• main 主要內容｜一個頁面只能有一個main
• section 區塊內容｜有明確主題的區塊，可以包涵article
• article 文章內容｜有意義的段落文章，也能包含section
• aside 側邊區塊｜網頁側邊，主題以外的內容，通常為側邊選單
• footer 網站頁尾｜通常放入網站資訊與版權宣告

這些標籤雖然與原本div的寫法幾乎相同，外觀上也並無差異，但在網頁識別上，能夠讓搜尋引擎快速掌握重要區塊，如同 h1 ~ h6 的差異，不只大小的差別，還有重要性的不同，搜尋結果相對也會不一樣！善用語意化標籤可以更好地讓搜尋引擎找到你要傳達與分享的內容喔！