HTML5 设计原理

oschina
 oschina
发布于 2012年05月18日
收藏 25

注:本文中的例子应该用代码展示的,但是因为现在用的DOCTYPE为XHTML1.0,浏览器读不出来HTML5代码,pre也没法
代码阅读,所以只能通过文字来说明了。

 

 

 

避免不必要的复杂性
如果可能,简明的解决方案总是比复杂的解决方案更受欢迎。

HTML 4.01的文档类型是这样设置(因为浏览器解析的原因,我把尖括号省略了):
!DOCTYPE html PUBLIC “-//W3C//DTD HTML 4.01//EN” “http://www.w3.org/TR/html4/strict.dtd”

XHTML 1.0的DOCTYPE是:
!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN”
“http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”

而在HTML 5中,省掉不必要的复杂性,doctype就简化成了:!DOCTYPE html

支持已有的内容
已存在的内容依赖于预期的用户代理处理过程和行为,来实现预期的功能。

支持已有的内容是指,对已存在的内容100%的支持。

解决现实的问题
对应网页内容面对的问题,不能迎合存在需要的摘要架构是胜不过实际的解决方案的。

举例子,假设我使用HTML 4或XHTML 1,对应一个整块内容,比如一个商品列表好了,有商品图、商品标题、商品简介等,我要分别给这三块元素加上三个相同的链接。然而在HTML5里面,你完全 可以用一个a标签包含这三个区块。也就是,a标签包含块级元素。这解决了现实的问题。

求真务实
HTML5中新的语义元素就是遵循求真务实原理的反映。

假如你现在看网页,估计都会有这样的一些代码: id=”header” id=”navigation” id=”main” id=”sidebar” id=”footer” 然而在HTML5里面,新增的标签可以把相应的div替换掉,比如header、nav、aside、footer。别以为这些是id的替换品,不是的, 新标签其实是替换class的,因为这些标签可以在页面中重复使用。

平稳退化
应该制定HTML5 文档的一致性要求,甚至利用新元素、属性、API和内容模型。这样,网页内容才能在更老或者能力较弱的用户代理中优雅降级。

就用HTML5表单来说明吧,input新增的type有number、search、range、email、date、url等,这些新type值在不支持它的浏览器里面,将被解释为text。所以,可以大胆使用HTML5表单,它做到了“优雅降级”。

最终用户优先
一旦遇到冲突,最终用户优先,其次是作者,其次是实现者,其次标准制定者,最后才是理论上的完满。

本站文章除注明转载外,均为本站原创或编译。欢迎任何形式的转载,但请务必注明出处,尊重他人劳动共创开源社区。
转载请注明:文章转载自 开源中国社区 [http://www.oschina.net]
本文标题:HTML5 设计原理
加载中

最新评论(8

蝴蝶飘飘
蝴蝶飘飘

引用来自“mallon”的评论

应用系统直接强制Chrome,省事

+1
悟庭
悟庭
应该还没完吧。。这文章不错。
xesam
xesam
HTML5设计原理——Jeremy Keith在 Fronteers 2010 上的主题演讲
http://www.cn-cuckoo.com/2010/10/21/the-design-of-html5-2151.html
xesam
xesam
这篇文章本来很长很不错的,结果呗阉割成这个鸟样。。。
mallon
mallon
应用系统直接强制Chrome,省事
我心飞翔
平滑过渡的技术,才能更让大家接受。
胡晅晖
胡晅晖
在研究了.........
异常爱
异常爱
好文章~我就不“顶”了,直接+1
返回顶部
顶部