以及何時使用ARTICLE，ASIDE和DIV
新的HTML5 SECTION元素可能會讓人有些困惑。 如果您在HTML5之前構建HTML 文檔 ，那麼您很可能已經在使用該元素在頁面中創建結構化分區，然後使用它們對頁面進行樣式設置。 因此，用SECTION元素簡單替換現有的DIV元素看起來很自然。 但這在技術上是不正確的。 所以如果你不僅僅用SECTION元素替換DIV元素，你如何正確使用它們？
SECTION元素是一個語義元素
首先要理解的是SECTION元素是一個語義元素。 這意味著它為用戶代理和人類提供了附加內容的含義 - 特別是文檔的一部分。
這可能看起來像一個非常普遍的語義描述，那是因為它。 還有其他HTML5元素可以為您的內容提供更多的語義區分，您在使用SECTION元素之前應首先使用這些元素：
- 文章
- 在旁邊
- NAV
何時使用SECTION元素
當內容是網站的獨立部分時，可以使用ARTICLE元素，該部分可以獨立存在，並可像文章或博客文章一樣進行聯合。 當內容與頁面內容或網站本身相切時（例如側邊欄，註釋，腳註或相關網站信息）切線相關時，請使用ASIDE元素。 對導航內容使用NAV元素。
SECTION元素是一個通用的語義元素。 當其他語義容器元素都不合適時使用它。 您可以使用它將文檔的各個部分組合成不同的單元，您可以用某種方式將它們描述為相關單元。 如果無法用一個或兩個句子描述該部分中的元素，則可能不應使用該元素。
相反，你應該使用DIV元素。 HTML5中的DIV元素是一個非語義容器元素。 如果您嘗試合併的內容沒有語義含義，但仍需要將其合併為樣式，則DIV元素是適合使用的元素。
SECTION元素如何工作
文檔的一部分可以顯示為文章和ASIDE元素的外部容器。 它也可以包含不屬於ARTICLE或ASIDE的內容。 SECTION元素也可以在ARTICLE，NAV或ASIDE中找到。 您甚至可以嵌套各個部分，以指示一組內容是另一組內容的一部分，它是文章的一部分或作為整體的頁面。
SECTION元素在文檔的輪廓內創建項目。 因此，您應該始終有一個標題元素（H1到H6）作為該部分的一部分。 如果你不能為該部分提供標題，那麼DIV元素可能更合適。 請記住，如果您不希望部分標題出現在頁面上，您可以隨時使用CSS進行屏蔽。
何時不使用SECTION元素
除了以上建議首先使用更具體的語義元素外，還有一個確定的區域不應該使用SECTION元素：僅用於樣式。
換句話說，如果將元素放在該位置的唯一原因是附加CSS樣式屬性，則不應使用SECTION元素。 查找語義元素或使用DIV元素。
最終它可能不重要
編寫語義HTML的困難在於，對我而言，語義對你來說可能完全是無稽之談。 如果您覺得您可以在文檔中使用SECTION元素，那麼您應該使用它。 大多數用戶代理不關心，並會按照您預期的方式顯示頁面，無論您是設計DIV還是SECTION。
對於喜歡語義上正確的設計師來說，使用語義上有效的SECTION元素非常重要。 對於只希望他們的頁面能夠工作的設計師來說，這並不重要。 我相信編寫語義有效的HTML是一種很好的做法，可以讓頁面更加面向未來。 但最終取決於你。