正確的HTML5大綱爲網站

嗯，我有一個網站和全新的HTML5標籤，使語義網頁。但是，所有的信息都混亂在我腦海中。正確的HTML5大綱爲網站

我的網站有：

橫幅和導航頭;
內容阻斷與標籤和標籤標頭（由小頭分離一些促銷文本）（可以是多於一個的標籤集管在單個標籤）
頁腳

好，我看到的，主導航應位於<nav>塊中，標題爲<header>，頁腳爲<footer>。

應該是什麼標籤？這是一個<section>？或者一個選項卡與選項卡標題一樣多<section>？標籤選擇面板應該使用哪個標籤？它只是一個<div>或另一個<nav>？

下一個頭痛是頭。那麼，我想網站標題（這是在<header>標記與橫幅）應該是<h1>。但如何處理部分？如果每個標籤有一個部分，則會有多個相同級別的標題，並且將它們設置爲<h1> s是不正確的，因此它們將變爲<h2> s。但部分沒有<h1>標題是否正確？

接下來的事情 - ARIA角色。我應該爲頁眉，內容和頁腳編寫角色（banner，contentinfo，main），導航？

來源

2013-10-06 efpies

閱讀[the-importance-of-sections]（http://coding.smashingmagazine.com/2013/01/18/the-importance-of-sections/）...可以回答你的問題 – aldanux

Mark up內容，而不是演示。選項卡是一種演示方法。 – Alohci

@Alohci然而，選項卡可以用'role =「標籤」'標記，但我不知道ARIA在搜索引擎中很重要，或者它們只是用於屏幕閱讀器（wat？）。 – efpies

HTML5語義標記不會執行與Div標記不同的任何操作。他們看起來更加語義化。因此，可以像標題和導航一樣說，將所有內容放在標題部分。所以會

<header> 
<nav> 
    <ul> 
     <li>Link 1</li> 
     <li>Link 2</li> 
     <li>Link 3</li> 
     <li>Link 4</li> 
    </ul> 
</nav> 
</header>

至於部分，是你的選擇，我通常使用一節我的網站的一部分，如果我打破這分章節我會用標籤或側欄。

你仍然需要用CSS來格式化這些像你一樣的DIv，但更容易遵循。

希望這是有道理

來源

2013-10-06 12:52:25

應該是什麼標籤？這是一個<section>？或者一個選項卡與選項卡標題一樣多<section>？

這沒關係如何你顯示你的內容（如標籤）;這取決於你的實際內容。

想想你的頁面內容在文字處理器文件中，沒有任何佈局。現在，您需要對其進行組織，以便在文檔開始時獲得一個很好的輪廓或TOC。該結構/輪廓用HTML5（以及僅在HTML 4.01中的標題）中的標題（h1-h6）和剖面元素（section,article,nav,aside）表示。具有標題（h1 - h6）

一切+相應的內容可被封閉在一個section（分別在一個更具體的article/aside/nav，如果他們的定義相匹配。）。見my answer to a related question。

哪個標籤應該用於標籤選擇面板？它只是一個<div>或另一個<nav>？

如果它代表該選項卡部分的導航，並且該選項包含在該部分中，則可以使用nav。一個直觀的例子是一篇文章中的目錄（例如維基百科文章）。作爲body的孩子，站點範圍的導航是nav。全文導航（= TOC）是作爲article的子項。

如果我有每個標籤一個部分，將有不止一個同等級別的頭，它是不正確的，使他們<h1> S，所以他們會成爲<h2>秒。但部分沒有<h1>標題是否正確？

使用h1將不會不正確。

所有的分節元素（section，article，nav，aside）以及切片根（例如body）「有」標題（如果你沒有提供一個明確的，這將是無）。使用最高等級的標題。因此，您可以在每個部分中使用h1，或者您可以調整標題級別以使其與計算大綱相對應（除非您需要超過6個級別）。

我應該爲頁眉，內容和頁腳（banner，contentinfo，main）編寫角色，導航嗎？

某些HTML5元素映射到default WAI-ARIA roles。對於支持WAI-ARIA但不支持HTML5的用戶代理或尚未實施最新角色映射的用戶代理，您可能需要明確添加這些已映射的角色。

來源

2013-10-07 01:02:48 unor

正確的HTML5大綱爲網站

回答

相關問題