HTML5 设计原理

注:本文中的例子应该用代码展示的,但是因为现在用的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表单,它做到了“优雅降级”。

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