2

我正在开发一个网站,我曾经使用无序列表进行导航,但前段时间我从雅虎开发者博客中看到了一些文章。在这篇文章中,他们解释了如何改善你的加载时间,并且有很多提高性能的技巧和窍门。现在,我尝试在 Google 上搜索 html 的语义,以及是否使用 ul 链接列表或仅使用“div”中的一堆“a”标签或任何其他语义上适合目的元素的标签。实际上,每个人都鼓励使用它们,对我来说这已经很自然了,但是我计算了我的链接,大约我已经有大约 120 个(也许更多)链接(每个在列表元素中)。你建议谁?或者有人可以推荐关于它的好文章吗?

<ul>
     <li>
         <a href="#">Link</a>
     </li>
</ul>

or

<div>
     <a href="#">Link</a>
</div>

PS哦,不要对我的链接感到惊讶,他们在那里是有原因的:)

4

4 回答 4

3

在这种情况下 li ul 的最佳实践,为了获得更多解释,我认为这篇文章对你很有用为什么我应该使用 'li' 而不是 'div'?

于 2012-09-18T18:15:25.453 回答
3

从 CSS 渲染的角度来看,我会使用无序列表,因为我认为它会导致 CSS 更干净;此外,您的站点中可能还有更多 div,因此当浏览器搜索匹配项时,它不必尝试匹配每个 div 样式。但是,这确实是一个微优化,除非您对页面进行分析并发现它存在问题,否则您不必担心太多。

至于提高页面性能,还有许多其他途径(缓存、缩小、减少往返)。我建议你阅读这个。这是 Google 关于网络性能最佳实践的想法。此外,在您最喜欢的网络浏览器(应该是 Chrome)中查看一些分析工具。

于 2012-09-18T18:11:20.157 回答
1

Normally the navigation will not add too much to your page load time.

You should stick to the unordered lists for another reason. Some screen reader software and search engines have learned that unordered lists are used as navigation.

And people without CSS activated will recognise the lists as navigation,too.

If you use HTML5 additionally wrap the navigation in a <nav> tag

于 2012-09-18T18:19:33.357 回答
1

我不认为您在 div 或列表中的 120 个链接会减慢您的页面速度,您可以使用 css 控制 div 或列表,您不需要 js 来格式化它们。需要考虑的事情是……每页有多少内容,谁在托管您的网站,每页有多少图像及其大小,html 文件的总大小,以及最重要的数据库调用。

于 2012-09-18T18:08:42.603 回答