HTML5大綱的問題 - 部分和區分頁眉/頁腳

Question

我正確地看HTML5標籤的第一次真正的，並想出這個頁面結構（一個博客網站）：

<header> 
    <nav> 
     <ul> 
      <li>list 1</li> 
      <li>list 2</li> 
     </ul> 
    </nav> 
</header> 
<main> 
    <h1>Main page heading</h1> 
    <article><h1>Post 1</h1></article> 
    <article><h1>Post 2</h1></article> 
    <div id=「sidebar」> 
     <aside><h1>Aside heading</h1></aside> 
    </div> 
</main> 
<footer> 
    <aside><h1>Footer widget heading</h1></aside> 
    <aside><h1>Footer widget heading</h1></aside> 
</footer> 

當我運行這通過HTML大綱工具https://gsnedders.html5.org/outliner/我得到這個：

1. Main page heading 
    1. Untitled Section 
    2. Post 1 
    3. Post 2 
    4. Aside heading 
    5. Footer widget heading 
    6. Footer widget heading 

不正是我本來以爲應該概括。

Q1。不知道爲什麼我在那裏得到'無標題部分'。玩耍表明這實際上與<nav>有關。我應該擔心'無題組'嗎？就我而言，導航並不需要標題...

Q2。很明顯，我的頁面結構並沒有真正達到預期的效果。我想將<header>和<footer>與<main>頁面內容區分開來。我知道這些標籤不是分段元素，但是如果不是，那麼它們的用途是什麼，特別是在<header>和<footer>的情況下？我的理解是，<main>應該用在過去可能使用過<div id="main">或<div id="wrapper">的地方，並且應該表示頁面的主要區域，這正是它正在做的。

我沒有使用<section>標籤的原因是因爲我明白，他們不應該被用作樣式包裝，更多的是'頁面章節'。這個頁面沒有任何章節（唯一的自包含的東西已經與<article>和<aside>區分了），所以我不明白爲什麼我應該使用<section>。

我也嘗試使用<h1>標籤<header>和<footer>這似乎解決我的問題。

<header> 
    <h1>Site title</h1> 
    <nav> 
     <ul> 
      <li>list 1</li> 
      <li>list 2</li> 
     </ul> 
    </nav> 
</header> 
<main> 
    <h1>Main page heading</h1> 
    <article><h1>Post 1</h1></article> 
    <article><h1>Post 2</h1></article> 
    <div id=「sidebar」> 
     <aside><h1>Aside heading</h1></aside> 
    </div> 
</main> 
<footer> 
    <h1>Footer heading</h1> 
    <aside><h1>Footer widget heading</h1></aside> 
    <aside><h1>Footer widget heading</h1></aside> 
</footer> 

大綱：

1. Site title 
    1. Untitled Section 
2. Main page heading 
    1. Post 1 
    2. Post 2 
    3. Aside heading 
3. Footer heading 
    1. Footer widget heading 
    2. Footer widget heading 

但是，這並沒有真正覺得自己是一個很好的解決方案，同時爲標題，也許應該有一個標題，我不想給我的頁腳中的冠軍。任何替代建議將不勝感激。我只想保持儘可能簡單的事情，同時仍然使用標籤來達到正確的目的。

我感謝任何人閱讀這整個問題的時間。如果我對這個輪廓線太過迷戀，請告訴我。

Answer 1

一個典型的網頁（這是一個網站的一部分），應該有網站標題（而不是主內容標題）作爲body切片根的標題。爲什麼？因爲導航等網站內容不應位於網頁主內容標題的範圍內。

如果網站標題不是所需的，頁面應該至少得到一個無標題的大綱條目，這可以通過在適當的地方使用分段內容元素explicitly來實現。

參見my answer with examples（another one）。

Q1。不知道爲什麼我在那裏得到'無標題部分'。玩耍表明這實際上與<nav>有關。我應該擔心'無題組'嗎？資產淨值並不真的需要一個標題就我而言......

逢節（切片內容元素，如section和nav，和切片的根元素，如body和）「多頭」的標題。如果你沒有提供，outliner可能會顯示類似「無標題部分」的內容。這是一個部分，沒有標題。不，你不必擔心：每個部分都有一個標題（導航可以是一個例子）並不一定有用/合適。第二季度銷售價格指數爲：

Q2。 [...]我知道這些標籤不是片段元素，但如果不是，那麼它們是什麼，特別是在和？

每個部分可以具有header和footer（和address）元素。他們的工作？要標記content that is not considered to be the main content of that section。所以header作爲body的子項是整個文檔的標題，header作爲article的子項僅爲本文的標題等（see examples）。

不需要給頁腳一個標題（或使用它的一個部分）。只需使用footer，你明確表示內容是（在你的情況下）文檔的頁腳。如果頁腳是複雜的，即包含許多內容，則節/標題可以是合適的。由於您的頁腳中有兩個aside元素，因此您可以考慮添加一個可以代表頁腳的父代（無標題）section或用作兩個aside元素的分組父代（但如果這樣做有意義取決於您的實際內容）。