我开始学习html / css,在整个学习过程中,我看到语义学的思想受到了沉重的打击。大多数时候我都明白我应该使用什么,一切都很好。但有很多时候,感觉有太多标签用于简单的事情,例如:
假设我的网站上有一个主标题,其中包含一些导航链接,从语义上讲我得到了这个:
<section id="masterHeader">
<header>
<nav>
<ul>
<li><a href="#"> link </a></li>
</ul>
</nav>
</header>
</section>
这太多了,还是我应该这样做,因为它确实有意义?它看起来好像很多不需要的标签。
答案 0 :(得分:5)
语义设计页面的目的不是因为你作为设计师更容易阅读(虽然这是一个很好的好处),或者因为它更轻量级(通常不是)。相反,语义设计的目的是为您的代码添加含义,简单地使得具有ID和类的div无法实现。抓取您的网站的搜索引擎可以在语义标记时表面上更好地理解您的代码。
问题是,IE8及更低版本不支持这些语义元素,因此需要js shiv。但是,如果他们的JS被禁用,那么你的布局会在IE8中打破并降低。在您考虑使用HTML5元素之前,您需要权衡这一权衡,因为您的布局将在IE8-6中以no-js中断。
另外,我认为section元素在你的用法中在语义上是不正确的(但我可能错了,我必须检查w3c规范)。但这既不是在这里也不是在那里,而且大多只是挑选。
答案 1 :(得分:3)
似乎没有必要在section标签中包含标头标签。相反,它应该看起来像这样:
<header id="masterHeader">
<nav>
<ul>
<li><a href="#"></a></li>
</ul>
<nav>
</header>