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实现背景模糊的三种方式
Mar 09 HTML / CSS
8款精美的CSS3表单设计(登录表单/下拉选择/按钮附演示及源码)
Feb 04 HTML / CSS
CSS3中使用RGBa来调节透明度的教程
May 09 HTML / CSS
CSS3实现多样的边框效果
May 04 HTML / CSS
HTML5 placeholder属性详解
Jun 22 HTML / CSS
html5 touch事件实现页面上下滑动效果【附代码】
Mar 10 HTML / CSS
html5本地存储_动力节点Java学院整理
Jul 12 HTML / CSS
详解FireFox下Canvas使用图像合成绘制SVG的Bug
Jul 10 HTML / CSS
HTML5 canvas 基本语法
Aug 26 HTML / CSS
利用html5 canvas破解简单验证码及getImageData接口应用
Jan 25 HTML / CSS
手机端用rem+scss做适配的详解
Nov 15 HTML / CSS
JavaScript+Canvas实现自定义画板的示例代码
May 13 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
php中3des加密代码(完全与.net中的兼容)
2012/08/02 PHP
php中FTP函数ftp_connect、ftp_login与ftp_chmod用法
2014/11/18 PHP
Laravel Intervention/image图片处理扩展包的安装、使用与可能遇到的坑详解
2017/11/14 PHP
TP5框架model常见操作示例小结【增删改查、聚合、时间戳、软删除等】
2020/04/05 PHP
js获取当前页面路径示例讲解
2014/01/08 Javascript
jquery实现搜索框常见效果的方法
2015/01/22 Javascript
js实现鼠标悬浮给图片加边框的方法
2015/01/30 Javascript
js鼠标按键事件和键盘按键事件用法实例汇总
2016/10/03 Javascript
Javascript的动态增加类的实现方法
2016/10/20 Javascript
浅谈angularjs module返回对象的坑(推荐)
2016/10/21 Javascript
jQuery EasyUI 获取tabs的实例解析
2016/12/06 Javascript
微信小程序--组件(swiper)详细介绍
2017/06/13 Javascript
vue vuex vue-rouert后台项目——权限路由(适合初学)
2017/12/29 Javascript
angular第三方包开发整理(小结)
2018/04/19 Javascript
微信小程序利用swiper+css实现购物车商品删除功能
2019/03/06 Javascript
vue中使用百度脑图kityminder-core二次开发的实现
2019/09/26 Javascript
javascript实现摄像头拍照预览
2019/09/30 Javascript
使用Vue.set()方法实现响应式修改数组数据步骤
2019/11/09 Javascript
win与linux系统中python requests 安装
2016/12/04 Python
利用Celery实现Django博客PV统计功能详解
2017/05/08 Python
Python之os操作方法(详解)
2017/06/15 Python
python 给DataFrame增加index行名和columns列名的实现方法
2018/06/08 Python
Python面向对象进阶学习
2019/05/21 Python
给我一面国旗 python帮你实现
2019/09/30 Python
django自定义模板标签过程解析
2019/12/14 Python
基于pandas中expand的作用详解
2019/12/17 Python
python 基于opencv实现图像增强
2020/12/23 Python
红色康乃馨酒店:Red Carnation Hotels
2017/06/22 全球购物
澳大利亚现代波西米亚风格女装网站:Bohemian Traders
2018/04/16 全球购物
档案接收函范文
2014/01/10 职场文书
《桂花雨》教学反思
2014/04/12 职场文书
股东协议书
2014/04/14 职场文书
销售岗位职责范本
2014/06/12 职场文书
酒店爱岗敬业演讲稿
2014/09/02 职场文书
MIME类型中application/xml与text/xml的区别介绍
2022/01/18 HTML / CSS
为Centos安装指定版本的Docker
2022/04/01 Servers