导航
【初探HTML5之使用新标签布局】用html5布局我的博客页！
【HTML5初探之form标签】解放表单验证、增加文件上传、集成拖放
【HTML5初探之绘制图像（上）】看我canvas元素引领下一代web页面
【HTML5初探之绘制图像（下）】看我canvas元素引领下一代web页面
【HTML5初探之多媒体元素】视频播放HTML5、Flash谁才是王道？
【HTML5初探之本地存储】如果没有数据库。。。
【HTML5初探之离线应用】如何打造零请求、无流量的网站？
【HTML5初探之通信API】跨域门槛不再高、数据推送不是梦
【HTML5初探之Web Workers】网页也能多线程
【HTML5初探之Geolocation API】让我们来回去地理信息
前言
一直觉得该学习HTML5，这是web前端大势所趋，若此时还不学习，必将被淹没于技术的洪流，何谈成为优秀的web前端技术人员？
于是乎，小的来了。昨天初略看了下大纲，HTML包括以下东西：
1 增加了一些新元素，以更好的支持web语义化操作，提供更友好的seo
2 解决现有浏览器几个标准问题，视频播放、音频播放
3 强化页面特效控制，增加原生拖放相关，增加表单验证相关
4 增加本地存储功能，让页面响应效果提高，增加移动端用户体验
5 增加地理位置相关接口，用于获取地理信息
6 增加web 通讯相关功能，可以将服务器信息推送至页面
7 增加web worker对象用于处理页面 影响效率脚步
8 增加画布功能，可在页面绘制复杂图形
9 增加了更多的元素选择器
......
千里之行始于足下，让我揭开HTML5新增的布局类标签吧！
HTML5的布局
就布局来说，大概就是以下几个，其实有些也不是布局相关的了：
标签
个人理解
article
相当于：<div class="article"></div>
出现动机不明，小的不明，据说是为了增加语义化，小的就在想在低版本浏览器下咋办，无解。
一般用于一个独立的环境，比如：帖子、文章或者其它独立的地方
section
小的感觉还是div了，据说该元素用于网站内容分块，小的亦不明白为神马我不老老实实的用div就算了，答案是语义化。
提示：
1、当使用该容器需要直接定义样式时建议使用div（不懂啊）
2、section元素内容可以单独存储到数据库或者输出到word中（这个听起来靠谱点，比如用户评论）
3、该元素一般具有标题
总结：在书上得到的结论是能不用就不用，这样对吗？？？
nav
相当于：<div class="nav"><ul></ul></div>
该元素个人认为较靠谱……，一般用于页面头部导航或者其它会使用到ul的地方，或者分页处。
aside
该元素一般就是我们所谓两列布局的话，左边出现菜单栏容器
time
html5中，使用时间标签被单独提了出来，这个还算可以理解，且用着试试
支持一pubdate属性，表示为发布日期
header
语义化标签，相当于<div class="header"></div>小的认为能用
其中有个hgroup可以用作副标题的存在
footer
语义化标签，相当于<div class="footer"></div>
address
相当于div了，小的认为没什么意义了，又要考虑 向下兼容，一般在footer中包含与联系人地址有关的东东
新标签制作博客页
现在来一张我博客页的截图
其中大概包括以下几块：
1、header 头部
2、navigation 导航
3、aside 左栏信息
4、main 正文
5、评论
在做的过程中，我总把div和section等不太分的清楚，慢慢的就模糊了彼此之间的界限，最后得出一个结论：
一些新元素不是很有必要！这就是我的第一感受，但应该是不够宏观，到html5学到后面，估计会看到他们存在的意义。
完成的界面
昨晚做完，大概是以下模样，到后面确实晚了，就没做了，因为我要给我女朋友幸福。。。。
基本用到了以上每个元素，一些我理解了，但是一些我不能完全理解；
View Code
关于IE7、8
不必说低版本浏览器是不能识别该元素的！
传说中的解决方案：
1
2
3
4
5
6
<script type="text/javascript">
document.createElement('header');
</script>
<style type="text/css">
header { display: block;}
</style>
但老夫在冲忙中试了试，亦不行，具体相关问题，留待小弟第一次学完后，2次学习时在一并回顾。
结束语
因为是初学HTML5，肯定会有很多不足的地方，当我真正做起来的时候，感觉有所不同，最后居然给header等标签单独定义了class？？？
新东西还是需要很多思考的，这样和直接用div的界限更加不分明了，此问题留待以后解决，有必要学习看看比较成熟的HTML5网站。
昨晚学的东西比较实在，也没有什么难点，下次小的看看新增的form标签会不会有所不同呢？
本文转自叶小钗博客园博客，原文链接http://www.cnblogs.com/yexiaochai/archive/2013/04/16/3023912.html，如需转载请自行联系原作者
