HTML5導航標籤內容

似乎是在與HTML5中的<nav>標籤文件衝突的例子。我見過的大多數例子都是這樣用的：HTML5導航標籤內容

<nav> 
    <ul> 
    <li><a href='#'>Link</a></li> 
    <li><a href='#'>Link</a></li> 
    <li><a href='#'>Link</a></li> 
    </ul> 
</nav>

但是我想知道這是不是因爲人們習慣使用div。有一些例子，我已經看到，只是這樣做

<nav> 
    <a href='#'>Link</a> 
    <a href='#'>Link</a> 
    <a href='#'>Link</a> 
</nav>

第二種方法似乎對我來說更清潔和更多的語義。是否有「官方」正確版本？是否有理由仍然在nav標籤中使用<ul>，而不是直接使用錨元素？

來源

2011-09-01 Falmarri

這兩個例子都是語義的。

在第一示例中，錨定件的列表是明確的無序列表。在第二個例子中，鏈接列表只是錨元素的集合。

如果你只是想鏈接一維集合，我建議您用

<nav> 
    <a href='#'>Link</a> 
    <a href='#'>Link</a> 
    <a href='#'>Link</a> 
</nav>

然而

堅持使用ul元素允許明確的分級菜單（如下拉菜單或樹型列表）：

<nav> 
    <ul> 
    <li> 
     <a href="#">Link</a> 
    </li> 
    <li> 
     <a href="#">Link</a> 
     <ul> 
     <li> 
      <a href="#">Sub link</a> 
     </li> 
     <li> 
      <a href="#">Sub link</a> 
     </li> 
     <li> 
      <a href="#">Sub link</a> 
     </li> 
     </ul> 
    </li> 
    <li> 
     <a href="#">Link</a> 
    </li> 
    <li> 
     <a href="#">Link</a> 
     <ul> 
     <li> 
      <a href="#">Sub link</a> 
     </li> 
     <li> 
      <a href="#">Sub link</a> 
     </li> 
     </ul> 
    </li> 
    </ul> 
</nav>

來源

2011-09-01 22:15:28 zzzzBov

第一個版本更適合屏幕閱讀器（現在不記得源代碼）。 – Teetrinker

@Teetrinker，第一個是列表，第二個是樹。對於屏幕閱讀器來說，它們都不是更好的，因爲它們表達了完全不同的含義。如果你打算傳達一棵樹，那麼第一棵樹就是不可接受的。 – zzzzBov

的論點是，屏幕閱讀器讀取：「導航/列表/第一項/鏈接到A /第二個項目/鏈接到B ..」與「導航/鏈接到/鏈接到B ......」我完全在樹上得到你的觀點。 – Teetrinker

唯一真正的區別可能是搜索引擎如何查看鏈接。例如，在無序列表中，Google可能會明白該列表中的所有項目都是相關的。在第二個例子中，Google可能會認爲沒有任何鏈接是相關的。 Google可以使用該信息進行索引並更準確地顯示您的信息。

它們可以顯示相同的，但真的有很多標記的是關於如何如果沒有在所有或者一個機器人正在搜索你的網站相關信息附加到頁面樣式信息應呈現。

來源

2011-09-01 22:19:13 Caimen

谷歌或任何地方都提到實際上有意義的項目並按照你的意思解釋它？ – Lukas

@ djlukas777谷歌真的沒有透露很多谷歌做什麼，原因很明顯，但很顯然，谷歌在乎關於語義標記。瞭解什麼語義標記真的是瞭解googlebot的關鍵。列表進入列表項標籤，谷歌然後明白，它正在查看列表。如果它是一個段落標記，那麼Google知道它是一個段落。在正確的地方使用正確的標籤，Googlebot會喜歡你。對段落以外的內容使用段落標記，那麼Googlebot不會喜歡你。 – Caimen

好吧，我想這對我來說很明顯:)對你的答案來說很多thx – Lukas

您可以使用。

名單往往只被用作鏈接列表通常就是這樣，一個列表。但是，這取決於你。

來源

2011-09-02 08:45:33

他們之間沒有真正的區別。然而，像Caimen說的那樣，搜索引擎使用頁面標記將數據分組以更好的網頁搜索結果。如果鏈接在主題上非常相似（例如對於博客），則建議您使用第一個鏈接，如果鏈接不相似（用於從網站搜索導航結果），則使用第一個鏈接。

來源

2011-09-02 09:19:48 deztructicus

HTML5導航標籤內容

回答

相關問題