HTML5 与 XHTML2


Posted in HTML / CSS onOctober 17, 2008

多数人使用 HTML 4 和 XHTML 1 编写网页。相对较少的 HTML 狂热者了解语义 HTML 的概念、验证 HTML 结构和改进文档的可访问性。高质量的 HTML 文档是反复权衡、设计优选和讨论酝酿的结果。尽管受到诸多批评,还没有任何语言的普及性能与 HTML 比肩。多数用户满足于标准的现状,仿佛生来就该如此一样。
但是和其他很多标准一样,HTML 也有后继者。即便现在,专家仍然在考虑 HTML 的下一版本,解决当前版本中已知的所有问题。和任何人多的地方一样,这些专家也对此项工作的未来方向持有不同意见。
关于新 HTML 版本的第一个提议来自 W3C 组织的一个工作组。这个工作组想法围绕着 XHTML 2— 这个标准延续了原来进一步净化 XHTML、回归第一版 HTML 设计理念的开发方向。
W3C 之外的一些重要的 HTML 专家 — 浏览器厂商、Web 开发人员、作者和其他有关人员 — 不同意 XHTML 2 的方向。2004 年,他们成立了一个独立的工作组,为新的 HTML 版本提出了一种新的设计方向。在 WHATWG(Web 超文本应用程序技术工作组,Web Hypertext Application Technology Working Group)的名义下,他们推出了 HTML 5 和 Web Forms 2。
数年之后,通过工作草案清楚地描述了 HTML 的另一种发展方向。2007 年 4 月,W3C 针对是否接纳 HTML 5 进入标准审核程序的提议进行了投票,(还)没有承认它是正式标准。多数人赞同。于是出现了一种有意思的情形:W3C 同时研究两种互相竞争的 HTML 和 XHTML 后继技术。从理论上说,两者都有充分的理由。从实践上说,让所有的主流浏览器支持这两种标准还要克服很多障碍。
这就是导致目前这种情况的基本事实。更有意义的是讨论两种提议之间的真正分歧。本文概括介绍了两种提议的基本要点,然后剖析两者的设计理念。 经常用到的缩写词
CSS:级联样式表
HTML:超文本标记语言
W3C:万维网联盟
XHTML:可扩展超文本标记语言 XHTML 简史
理解 XHTML 2 背后隐藏的设计理念需要了解一点历史。20 世纪 90 年代初,第一个 HTML 版本是基于标准通用标记语言(SGML)的。主要的区别在于超链接特性 — 万维网的关键基础和成功因素。和 SGML 一样,HTML 允许作者描述文档的结构,把头部和段落、有序列表、无序列表分开。在屏幕上的显示结果和浏览器有关。
随着 Web 日渐普及,HTML 用户要求控制页面的观感。浏览器厂商在 HTML 2 和 3 中推出了新的特性。网页变得难以理解,复杂的嵌套表结构成为控制页面布局的主要手段。文档的其余部分则充斥着 font 标记和 color 声明。原来的文档结构已经难以理清。
HTML 4 的出现就是为了结束这种混乱,它将表示逻辑推给了 CSS,为高级的内容定位引入了层(DIV)。和 HTML 3 相比这意味着代码编写模式上的变化。为了简化迁移的过程,通过 HTML 4 的 Transitional 版本来支持旧的 HTML 3 结构。适用于高级用户的 Strict 版本则要求将内容和表示彻底分开。
第一个 HTML 4 网站把 DIV 当作新的圣杯一样使用,页面中几乎每个需要略加修饰的元素都用上,包括(但不限于)头部。HTML style 属性是常见的描述表示细节的地方。最终从网页中消灭了泛滥成灾的表格。但内容和表示逻辑仍然混在一起。必不可少的 CSS 文件只有寥寥数行。
最近,一些知名的 Web 开发人员为 HTML 4 样式表提出了一种更巧妙的办法。在现代浏览器中,CSS 属性并没有局限于 DIV 元素。只要愿意可以为任何 HTML 元素指定样式。很多 weblog 开始谈论语义 HTML。没有完全禁止 DIV 元素,但是网页编写者开始使用最适合描述其内容的 HTML 元素。比方说,多数网站的导航菜单最好用无序列表来描述。再比如,不对段落元素使用 bigHeader 这样的类名,而改为 H1 元素,然后用 CSS 根据要求修改表示形式。
同时,W3C 提出 XHTML 1 作为符合结构良好而有效的 HTML 4 的 XML 版本。对于 XML 用户来说,这样做简化了将 XML 内容转化成网页并用已有验证程序检查转换结果的工作。XHTML 1.1 尝试将不同的问题隔离到不同的模块中。模块化方法便于针对不同的需要重用标准的不同部分,也有利于用新的功能扩展标准。
和 HTML 4 相比,XHTML 1.1 的用户甚至更多,把内容和表示分离开。但是和过去一样,一些实际问题只能使用 CSS 中技巧来解决。比如,无序列表表示的菜单结构通常包括漂亮的图片。但是,图像不大容易通过文本-语音设施读给有视觉障碍的人听。而且 Lynx 这样的文本浏览器也不能显示图像。一个复杂的 CSS 技巧可以在浏览器中隐藏文本显示图像。但是如果不同页面上的菜单不同,就很难用 CSS 指定这部分内容了。 XHTML 2 背后的设计理念
XHTML 2 背后最重要的设计理念是进一步分离内容和表示,改进 HTML 4 和 XHTML 1 残留的瑕疵。比如,为无序列表中的每项指定图像的原生支持。原来的 IMG SRC 标记换成了可用于任何元素的可选属性 SRC。修改后的 CSS 完全脱离了内容,不支持图像的设备很容易转而表示文本。
但 CSS 不是 Web 开发人员的惟一挑战。大量的时间用于服务器和 HTML 表单的交互以及存在大量 JavaScript™ 代码。表单仅限于一维的键值对。开发 JavaScript 代码工作量很大,但是在文本-语音转换设备这样的接口上毫无用处。
基于模块化的方法,XHTML 2 用 XForms 模块替换了 HTML Forms,使用适当的应用程序模型增加了对常见问题的支持。XForms 不需要一行脚本就能指定交互逻辑、验证规则和计算方法。此外,这种技术采用了丰富的 XML 结构而不是键值对,允许出现嵌套的子表单和重复的元素。除了提供一个强大的引擎外,文本-语音设备更适合改变应用程序的丰富性。
除了 XForms,还有其他一些 XHTML 有关的问题抽取为独立的规范满足其他需要 — 比如 XML Events、XFrames 和 Ruby(亚洲语言)。
随着表示的分离,编程也从标准中分离出来。onClick 之类的交互属性被 XML Events 模块代替。由于 XML Events 规范本身就是为此而设计的,它提供了一组更强大的工具来处理用户接口。
对于 XHTML 2 的创新,总结而言其基本理念就是分解不同的问题。问题不再是 HTML 的次要特性,而成为新规范的主要目的。因此,新规范最适合优化面临的问题。不过,区别对待不同的问题是出于理念而不是实践的需要。熟悉使用这套工具的聪明的开发人员可以得到需要的结果。但是当前 HTML 版本的一般用户能否创建高质量的 XHTML 文档并不好说。
XHTML 2 的目标很可能不是一般 HTML 用户。但是在好的开发人员手中,可以作为增强可访问性的不错的方法。 HTML 5 的设计理念
WHATWG 在设计 HTML 5 的时候采用了一种更符合实际的方法。没有考虑问题分解之类的抽象理念,这个工作组从当前主流浏览器的行为出发制定文档,和 W3C 规范完全不同。在上述分析的基础上,这个工作组调查了 HTML 的实际运用。
根据这些信息,工作组提出了旨在简化一般 Web 开发人员工作的方案。虽然 HTML 5 宣称源于上一 HTML 版本,但其主要目标不是纯粹性。比如,模块化文档的主要目标是方便用优化的 Web 应用程序替换。
基于此目的的模块化语言大大简化了 Web 应用程序的开发。比如,HTML 5 支持数据表格、菜单和工具栏这类交互组件。使用默认行为的描述性 HTML 元素可以避免用大量代码模拟通用 DIV 的行为。
HTML 5 规范不限于 HTML 元素和属性。它定义了编辑文档和拖放式交互这类专用的 JavaScript API。这种方法和分解问题的办法截然不同。它简化了 Web 开发人员 API 但增加了规范的大小。
HTML 5 和 HTML 4 的相似性远远超过 XHTML 2 和 XHTML 1 的相似性。迁移路径更平坦了,有经验的 HTML 4 开发人员熟悉新版本也更方便。新特性遵循相似的逻辑。特定元素的专门事件属性允许 HTML 编辑人员提供更适当的文本完成功能。
当前的 Web 应用程序和服务器的交互依赖于异步 JavaScript XML (Ajax)。HTML 5 认识到了和服务器交互的重要性,定义了多种和网络交互、分发收到的服务器事件和从其他域向文档发送消息而不会造成安全问题的方式。
HTML 5 的基本设计理念是利用 Web 开发人员需要的特性扩展 HTML 4。HTML 5 在继承 HTML 4 基本技术的同时进行了简化。为了解决 HTML V4 的不足,HTML V5 选择最简单直接的办法重新设计。 新标准的实际应用
XHTML V2 和相关模块得到了 W3C 的官方支持,相关模块成为 W3C 支持的其他 XML 规范的重要因素。不幸的是,W3C 的官方认可不能保证主流 Web 浏览器的支持。支持一般的 XHTML V2 不是问题:现代浏览器已经支持很多功能。正确地使用 XHTML V2 依赖于相关模块的可用性。在撰写本文的时候,Microsoft 是否要扩展 Windows® Internet Explorer® 以支持 XML Events 和 XForms 这些特性还不清楚。一种 Mozilla XForms 插件,包括 XML Events,已经开发了数年。该插件提高了这种技术的功能,降低了实现的难度。
HTML V5 规范的编写保持了和浏览器厂商的深入沟通,始终考虑到实现的问题。尽管该团队对 W3C 官方认可表示怀疑。FAQ 甚至没有正式回答什么时候通过正式批准的问题。不论 W3C 的态度如何,浏览器厂商似乎决定实现非正式的 HTML 5 标准。浏览器厂商赶在官方标准出炉之前已不是第一次了。 互相竞争的标准
到目前为止,HTML 5 和 XHTML 2 都还不是正式的推荐标准。将来一些细微的地方还可能变化。但它们的发展方向不会变,两者都解决了现行标准存在的一些不足。未来的浏览器如何增加对这两种新标准的支持还有待观察。当前浏览器同时支持 HTML 4 和 XHTML 1。类似地,将来的浏览器可能同时支持 HTML 5 和 XHTML 2。这两种标准都有各自的支持者。
如果对 XHTML 1.1 比 HTML 4 更关心,希望创建的文档能够支持不同的设备,可能更偏爱 XHTML 2。如果使用 XHTML 1 仅仅是因为它符合 XML 标准,而更喜欢 HTML 5 的新特性,XHTML 5(用 XML 改写的 HTML 5)也许是您的最佳选择。
HTML 5 颇受使用 HTML 4 开发交互式 Web 应用程序的开发人员的欢迎。对于使用所见即所得 文档编辑器的站点这种方法更可行。但是要具体情况具体分析,HTML 4 和 XHTML 1 很可能要并存很长时间。

HTML / CSS 相关文章推荐
浅析CSS3中鲜为人知的属性:-webkit-tap-highlight-color
Jan 12 HTML / CSS
CSS3实现背景透明文字不透明的示例代码
Jun 25 HTML / CSS
使用CSS3实现字体颜色渐变的实现
Aug 10 HTML / CSS
HTML5 canvas基本绘图之绘制矩形
Jun 27 HTML / CSS
详解使用HTML5的classList属性操作CSS类
Oct 13 HTML / CSS
详解rem 适配布局
Oct 31 HTML / CSS
20佳惊艳的HTML5应用程序示例分享
May 03 HTML / CSS
html5版canvas自由拼图实例
Oct 15 HTML / CSS
有关HTML5中背景音乐的自动播放功能
Oct 16 HTML / CSS
基于canvas使用贝塞尔曲线平滑拟合折线段的方法
Jan 10 HTML / CSS
canvas 下载二维码和图片加水印的方法
Mar 21 HTML / CSS
AmazeUI中模态框的实现
Aug 19 HTML / CSS
X/HTML5 和 XHTML2
Oct 17 #HTML / CSS
HTML5: Web 标准最巨大的飞跃
Oct 17 #HTML / CSS
详解Html5中video标签那些属性和方法
Jul 01 #HTML / CSS
HTML5之多线程(Web Worker)
Jan 02 #HTML / CSS
浅谈pc和移动端的响应式的使用
Jan 03 #HTML / CSS
canvas绘制文本内容自动换行的实现代码
Jan 14 #HTML / CSS
详解通过变换矩阵实现canvas的缩放功能
Jan 14 #HTML / CSS
You might like
一键删除顽固的空文件夹 软件下载
2007/01/26 PHP
用PHP实现的随机广告显示代码
2007/06/14 PHP
如何让thinkphp在模型中自动完成session赋值小教程
2014/09/05 PHP
php简单统计字符串单词数量的方法
2015/06/19 PHP
10条php编程小技巧
2015/07/07 PHP
PHP实现的pdo连接数据库并插入数据功能简单示例
2019/03/30 PHP
thinkphp5 + ajax 使用formdata提交数据(包括文件上传) 后台返回json完整实例
2020/03/02 PHP
利用JS重写Cognos右键菜单的实现代码
2010/04/11 Javascript
jquery 学习之二 属性(类)
2010/11/25 Javascript
jQuery Validate 验证,校验规则写在控件中的具体实例
2014/02/27 Javascript
JS+CSS实现实用的单击输入框弹出选择框的方法
2015/02/28 Javascript
JavaScript的jQuery库中ready方法的学习教程
2015/08/14 Javascript
js中 计算两个日期间的工作日的简单实例
2016/08/08 Javascript
基于jQuery实现的查看全文功能【实用】
2016/12/11 Javascript
解析JavaScript数组方法reduce
2016/12/12 Javascript
微信小程序 Toast自定义实例详解
2017/01/20 Javascript
Vue 2.X的状态管理vuex记录详解
2017/03/23 Javascript
vue 点击按钮增加一行的方法
2018/09/07 Javascript
微信小程序实现图片翻转效果的实例代码
2019/09/20 Javascript
vue封装swiper代码实例解析
2019/10/08 Javascript
关于Vue中axios的封装实例详解
2019/10/20 Javascript
[03:00]DOTA2-DPC中国联赛1月18日Recap集锦
2021/03/11 DOTA
快速了解python leveldb
2018/01/18 Python
python 中if else 语句的作用及示例代码
2018/03/05 Python
Python numpy 点数组去重的实例
2018/04/18 Python
解决pandas.DataFrame.fillna 填充Nan失败的问题
2018/11/06 Python
Win10 安装PyCharm2019.1.1(图文教程)
2019/09/29 Python
python 解决flask uwsgi 获取不到全局变量的问题
2019/12/22 Python
HTML5时代CSS设置漂亮字体取代图片
2014/09/04 HTML / CSS
CSS3制作炫酷带方向感应的鼠标滑过图片3D动画
2016/03/16 HTML / CSS
用HTML5.0制作网页的教程
2010/05/30 HTML / CSS
学生学习总结的自我评价
2013/10/22 职场文书
上课说话检讨书大全
2014/01/22 职场文书
岗位说明书怎么写
2014/07/30 职场文书
2015年药店店长工作总结
2015/04/29 职场文书
MySQL基础(一)
2021/04/05 MySQL