什麼是使用HTML5構造Breadcrumb導航的最新方式

Chris Coyier wrote a while ago最好的標記在<nav>部分中使用rel='up'部分，但那是在2010年，他說這種方式當時是有爭議的。使用HTML5爲麪包屑導航欄標記層次結構的最佳方式是什麼？這是克里斯reccomendation：什麼是使用HTML5構造Breadcrumb導航的最新方式

<nav> 
    <p> 
    <a href="/" rel="index up up up">Main</a> > 
    <a href="/products/" rel="up up">Products</a> > 
    <a href="/products/dishwashers/" rel="up">Dishwashers</a> > 
    <a>Second hand</a> 
    </p> 
</nav>

來源

2012-06-03 Will Moritz

這是谷歌如何代表了麪包屑（使用微）標記 -

<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb"> 
    <a href="http://www.example.com/dresses" itemprop="url"> 
     <span itemprop="title">Dresses</span> 
    </a> › 
</div> 
<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb"> 
    <a href="http://www.example.com/dresses/real" itemprop="url"> 
     <span itemprop="title">Real Dresses</span> 
    </a> › 
</div> 
<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb"> 
    <a href="http://www.example.com/clothes/dresses/real/green" itemprop="url"> 
     <span itemprop="title">Real Green Dresses</span> 
    </a> 
</div>

來源：https://support.google.com/webmasters/answer/185417

但我不真的認爲任何一種方法都存在正確或錯誤！

來源

2013-09-23 15:47:14

嗯，我個人通過迪夫亞Manian，這解釋了語義真的並不重要一樣多，因爲大多數人認爲喜歡this article。大多數時候，人們會在網頁瀏覽器中查看您的頁面，並且不知道您的底層CSS或HTML結構是什麼，只要它看起來很漂亮並且工作正常，就不會輕視。

大多數搜索引擎和計算機輔助功能軟件會找出它是什麼，而不管你的具體標記，只要你沒有專門設法妨礙它們。將導航放在導航標籤中當然會幫助更智能的軟件，但更智能的軟件無論如何都會發現它。

不管您的代碼是否遵循語義，都不會爲您提供足夠的實際好處，因此值得您花時間決定rel=up是編碼導航的「最佳方式」。不要浪費你的時間，只需編碼你的網站。（當然，除非你要按小時收費。）

來源

2012-06-03 03:26:34

'不用介意那些html nutheads，只需在那裏放一張桌子'。 – djspark

什麼是使用HTML5構造Breadcrumb導航的最新方式

回答

相關問題