HTML5学习笔记:section是有语义的div

时间:2012-4-28 作者:剧中人

本文为转载内容,原文地址已找不到

html5已经出来有一段时间了,虽然万恶的IE面对其赤果果的色诱也硬不起来,但还是有很多优秀的网站开始应用了,毕竟大势所趋嘎嘎。

最近在啃html5的书,虽然书里讲的好多东西,在网络上的一些杂文里都看到过,不过毕竟是书,会有一些小细节是值得去翻阅的。

好了 切入主题,讲讲心得:

section 是有语义的div

很多人很费解 为什么html5 放着div 那么短小精干的东西不用,非要用section呢?

我的理解是div 依然有用,只是它可以代表无语义的东西。section像是一个沙盒子,将不同的部分,区块,模块,区分开。

首先要说的就是这个header标签,之前看了好多关于html5的杂文,给人的感觉就像是 header 标签是 网站头部进化过来的,其实不然,就像以前很多人认为 h1只允许有一个一样。

因为 header 可以包含在 article 里作为 文章的头部标签。

hgroup 在header 标签中充当目录指引作用

原先一直很不明白hgroup 的作用,因为w3cschool 上表现的例子中hgroup中都是些h* 标签集合,这种东西在实际应用中的应用场景非常狭隘。但当发现 article 里可以丢header 标签后 这个问题就解决了。其实个人觉得这个标签的重心在目录指引,在内容为王的时代,hgroup标签会给seo带来一定贡献。

有了沙箱后,网站结构变得不是那么虎头蛇尾

很多人认为 一个web 中 只能用一个h1 不能用太多 h2,以及少量h3, 甚至都找不到 h4的踪迹。 事实告诉我们,我们甚至可以在 nav 标签中使用h1。 那么这样写不但不会混淆seo 抓重点。而且能让web 看着更加婀娜多姿,凹凸有致。