选择显示字体大小

网站设计的标准时代

本文观点:遵循国际网站标准(web standards)进行网站设计和改善。
阅读对象:网站设计人员、web应用开发人员
关 键 字:web standards、xml、xhml、css、dom、doctype、accessibility

前言

  网络上的变革每天都在发生,当我们觉得网站设计技术已经非常简单和熟悉的时候。国外网站设计标准化的概念早已悄悄的形成和迅速“蔓延”,自2000年起,大部分新发行的浏览器版本都开始支持网站标准。主流的网页编辑工具也开始全面支持网站标准,甚至一些软件几乎完全由xml文件组成,例如dreamweaver mx。一些著名的大型商业网站开始采用网站标准来重新构建(例如体育资讯www.espn.com),另外一些则拒绝非标准浏览器浏览它们的网站(例如连线杂志www.wired.com)。众多的设计网站(例如:www.k10k.net) 和个人网站更是标准推广的先行者,纷纷转向采用xhtml+css来建立。2004年2月4日xml1.1推荐标准正式发布,标志着网站设计的标准时代已经到来。

  国外网站标准的声势汹涌,但国内业界显得有些后知后觉或者毫无兴趣,让我们来看看国内三大门户网站首页对网站标准的遵循情况:

校验项目

校验目标网站

校验结果

代码校验(xhtml)
(校验地址:http://validator.w3.org/、
(http://www.htmlhelp.com/tools/validator/ )

www.sina.com.cn

失败,混杂的html,未达到xhtml1。黄色警报:字符集错误。(定义了gb2312,但页内使用了非gb2312字符)。非标准代码43处。

www.163.com

失败,混杂的html,未达到xhtml1。红色警报:未定义doctype。非标准代码41处。

www.sohu.com

失败,混杂的html,未达到xhtml1。黄色警报:字符集错误。非标准代码38处。

css2校验
(校验地址:http://jigsaw.w3.org/css-validator/validator-uri.html )

www.sina.com.cn

25处错误。

www.163.com

1处警告,10处错误。

www.sohu.com

1处警告,15处错误。

  校验结果显示所有门户网站都没有符合网站标准,甚至连html4.0标准都没有遵循。举例来说:<font>标签,早在1998年4月html4.0标准中就已经被w3c列为“不建议使用(deprecated)”标签。但我们的三大门户网站首页上都有不少类似<font color=red>的代码。这里的简单列表,目的不是批评这些网站做得不好(事实上大部分的大型商业站点都通不过w3c严格的正确性校验),有很多的原因造成这种状况,例如采用老的信息发布系统,网页设计人员的技术和意识不够等等。我们只是想说明一点:连比较规范的上市公司的网站都没有意识到遵循标准,其他规模教小的商业网站就更不用说,国内对网站标准没有足够的重视。

  让我们赶紧跟上新时代的步伐,一起来了解一下网站标准吧。

一.为什么要建立网站标准

  我们大部分人都有深刻体验,每当主流浏览器版本的升级,我们刚建立的网站就可能变得过时,我们就需要升级或者重新建造一遍网站。例如1996-1999年典型的“浏览器大战”,为了兼.netscape和ie,网站不得不为这两种浏览器写不同的代码。同样的,每当新的网络技术和交互设备的出现,我们也需要制作一个新版本来支持这种新技术或新设备,例如支持手机上网的wap技术。类似的问题举不胜举:网站代码臃肿、繁杂浪费了我们大量的带宽;针对某种浏览器的dhtml特效,屏蔽了部分潜在的客户;不易用的代码,残障人士无法浏览网站等等。这是一种恶性循环,是一种巨大的浪费

如何解决这些问题呢?有识之士早已开始思考,需要建立一种普遍认同的标准来结束这种无序和混乱。商业公司.netscape、microsoft等)也终于认识到统一标准的好处,因此在w3c(w3c.org)的组织下,网站标准开始被建立(1998年2月10日发布xml1.0为标志),并在网站标准组织(webstandards.org)的督促下推广执行。

简单说,网站标准的目的就是:

  对于网站设计和开发人员来说,遵循网站标准就是使用标准;对于你的网站用户来说,网站标准就是最佳体验。

  访问量排名世界第4,中国第1的新浪网站,也遭遇非标准dhtml的问题。在最新发布.netscape7和mozila1.6浏览器中,新浪首页的漂浮广告全部失效,层叠挤在页面左下角。也许那些广告主认为损失这些潜在的用户无所谓。(截图日期2004年4月12日)

二.什么是网站标准

  网站标准不是某一个标准,而是一系列标准的集合。网页主要由三部分组成:结构(structure)、表现(presentation)和行为(behavior)。对应的标准也分三方面:结构化标准语言主要包括xhtmlxml,表现标准语言主要包括css,行为标准主要包括对象模型(如w3c dom)、ecmascript等。这些标准大部分由w3c起草和发布,也有一些是其他标准组织制订的标准,比如ecma(european computer manufacturers association)的ecmascript标准。我们来简单了解一下这些标准:

 1.结构标准语言

  (1)xml

  xml是the extensible markup language(可扩展标识语言)的简写。目前推荐遵循的是w3c于2000年10月6日发布的xml1.0,参考(www.w3.org/tr/2000/rec-xml-20001006)。和html一样,xml同样来源于sgml,但xml是一种能定义其他语言的语。xml最初设计的目的是弥补html的不足,以强大的扩展性满足网络信息发布的需要,后来逐渐用于网络数据的转换和描述。关于xml的好处和技术规范细节这里就不多说了,网上有很多资料,也有很多书籍可以参考

2)xhtml

  xhtml是the extensible hypertext markup language可扩展标识语言的缩写。目前推荐遵循的是w3c于2000年1月26日推荐xml1.0(参考http://www.w3.org/tr/xhtml1)。xml虽然数据转换能力强大,完全可以替代html,但面对成千上万已有的站点,直接采用xml还为时过早。因此,我们在html4.0的基础上,用xml的规则对其进行扩展,得到了xhtml。简单的说,建立xhtml的目的就是实现htmlxml的过渡。

 2. 表现标准语言

  css是cascading style sheets层叠样式表的缩写。目前推荐遵循的是w3c于1998年5月12日推荐css2(参考http://www.w3.org/tr/css2/)。w3c创建css标准的目的是以css取代html表格式布局、帧和其他表现的语言。纯css布局与结构式xhtml相结合能帮助设计师分离外观与结构,使站点的访问及维护更加容易。

 3.行为标准

  (1)dom

  dom是document object model文档对象模型的缩写。根据w3c dom规范(http://www.w3.org/dom/),dom是一种与浏览器,平台,语言的接口,使得你可以访问页面其他的标准组件。简单理解,dom解决.netscaped的javascript和microsoft的jscript之间的冲突,给予web设计师和开发者一个标准的方法,让他们来访问他们站点中的数据、脚本和表现层对像。

 (2) ecmascript

  ecmascript是ecma(european computer manufacturers association)制定的标准脚本语言(javascript)。目前推荐遵循的是ecmascript 262(http://www.ecma.ch/ecma1/stand/ecma-262.htm)。

三.遵循标准的网站与传统网站的区别

  传统网站只是印刷媒体的延伸,设计目标是保证在4-6个主流浏览器版本中看起来一致。通常的特征是:

  而采用网站标准建立的网站是一个能够接受各种用户和各种设备的广泛的交流沟通工具。一般特征是:

  校验结果显示所有门户网站都没有符合网站标准,甚至连html4.0标准都没有遵循。举例来说:<font>标签,早在1998年4月html4.0标准中就已经被w3c列为“不建议使用(deprecated)”标签。但我们的三大门户网站首页上都有不少类似<font color=red>的代码。这里的简单列表,目的不是批评这些网站做得不好(事实上大部分的大型商业站点都通不过w3c严格的正确性校验),有很多的原因造成这种状况,例如采用老的信息发布系统,网页设计人员的技术和意识不够等等。我们只是想说明一点:连比较规范的上市公司的网站都没有意识到遵循标准,其他规模教小的商业网站就更不用说,国内对网站标准没有足够的重视。

  让我们赶紧跟上新时代的步伐,一起来了解一下网站标准吧。

一.为什么要建立网站标准

  我们大部分人都有深刻体验,每当主流浏览器版本的升级,我们刚建立的网站就可能变得过时,我们就需要升级或者重新建造一遍网站。例如1996-1999年典型的“浏览器大战”,为了兼.netscape和ie,网站不得不为这两种浏览器写不同的代码。同样的,每当新的网络技术和交互设备的出现,我们也需要制作一个新版本来支持这种新技术或新设备,例如支持手机上网的wap技术。类似的问题举不胜举:网站代码臃肿、繁杂浪费了我们大量的带宽;针对某种浏览器的dhtml特效,屏蔽了部分潜在的客户;不易用的代码,残障人士无法浏览网站等等。这是一种恶性循环,是一种巨大的浪费

如何解决这些问题呢?有识之士早已开始思考,需要建立一种普遍认同的标准来结束这种无序和混乱。商业公司.netscape、microsoft等)也终于认识到统一标准的好处,因此在w3c(w3c.org)的组织下,网站标准开始被建立(1998年2月10日发布xml1.0为标志),并在网站标准组织(webstandards.org)的督促下推广执行。

简单说,网站标准的目的就是:

  对于网站设计和开发人员来说,遵循网站标准就是使用标准;对于你的网站用户来说,网站标准就是最佳体验。

  访问量排名世界第4,中国第1的新浪网站,也遭遇非标准dhtml的问题。在最新发布.netscape7和mozila1.6浏览器中,新浪首页的漂浮广告全部失效,层叠挤在页面左下角。也许那些广告主认为损失这些潜在的用户无所谓。(截图日期2004年4月12日)

二.什么是网站标准

  网站标准不是某一个标准,而是一系列标准的集合。网页主要由三部分组成:结构(structure)、表现(presentation)和行为(behavior)。对应的标准也分三方面:结构化标准语言主要包括xhtmlxml,表现标准语言主要包括css,行为标准主要包括对象模型(如w3c dom)、ecmascript等。这些标准大部分由w3c起草和发布,也有一些是其他标准组织制订的标准,比如ecma(european computer manufacturers association)的ecmascript标准。我们来简单了解一下这些标准:

 1.结构标准语言

  (1)xml

  xml是the extensible markup language(可扩展标识语言)的简写。目前推荐遵循的是w3c于2000年10月6日发布的xml1.0,参考(www.w3.org/tr/2000/rec-xml-20001006)。和html一样,xml同样来源于sgml,但xml是一种能定义其他语言的语。xml最初设计的目的是弥补html的不足,以强大的扩展性满足网络信息发布的需要,后来逐渐用于网络数据的转换和描述。关于xml的好处和技术规范细节这里就不多说了,网上有很多资料,也有很多书籍可以参考

2)xhtml

  xhtml是the extensible hypertext markup language可扩展标识语言的缩写。目前推荐遵循的是w3c于2000年1月26日推荐xml1.0(参考http://www.w3.org/tr/xhtml1)。xml虽然数据转换能力强大,完全可以替代html,但面对成千上万已有的站点,直接采用xml还为时过早。因此,我们在html4.0的基础上,用xml的规则对其进行扩展,得到了xhtml。简单的说,建立xhtml的目的就是实现htmlxml的过渡。

 2. 表现标准语言

  css是cascading style sheets层叠样式表的缩写。目前推荐遵循的是w3c于1998年5月12日推荐css2(参考http://www.w3.org/tr/css2/)。w3c创建css标准的目的是以css取代html表格式布局、帧和其他表现的语言。纯css布局与结构式xhtml相结合能帮助设计师分离外观与结构,使站点的访问及维护更加容易。

 3.行为标准

  (1)dom

  dom是document object model文档对象模型的缩写。根据w3c dom规范(http://www.w3.org/dom/),dom是一种与浏览器,平台,语言的接口,使得你可以访问页面其他的标准组件。简单理解,dom解决.netscaped的javascript和microsoft的jscript之间的冲突,给予web设计师和开发者一个标准的方法,让他们来访问他们站点中的数据、脚本和表现层对像。

 (2) ecmascript

  ecmascript是ecma(european computer manufacturers association)制定的标准脚本语言(javascript)。目前推荐遵循的是ecmascript 262(http://www.ecma.ch/ecma1/stand/ecma-262.htm)。

三.遵循标准的网站与传统网站的区别

  传统网站只是印刷媒体的延伸,设计目标是保证在4-6个主流浏览器版本中看起来一致。通常的特征是:

  而采用网站标准建立的网站是一个能够接受各种用户和各种设备的广泛的交流沟通工具。一般特征是:


 


关键字 本文所属关键字

相关 与本文相关文章

分类 所有文章关键字导航

源码编程相关

Java   Asp   PHP   .Net   XML   C/C++   CGI   VB   Jsp   J2ee   J2se   J2me   EJB   Servlet   Tomcat   Resin   Struts   Weblogic   Eclipse   ANT   GUI   JMS   Web servise   IDEA   Webphere   Hibernate   Spring   Jboss   Applet   Swing   Socket   Javamail   Perl   Ajax   P2P   安全   模式   框架   测试   开源   游戏

SQL数据库相关

My-SQL   Ms-SQL   Access   DB2   Oracle   Sybase   SQLserver   索引   存储过程   加密   数据库   分页   视图  

手机无线相关

3G   Wap   CDMA   GRPS   GSM   IVR   彩信   短信   无线   增值业务

网页设计制作相关

HTML   CSS   网页配色   网页特效   Javascript   VBscript   Dreamweaver   Frontpage   JS   Web   网站设计

网站建设推广相关

建站经验   网站优化   网站排名   推广   Alexa

操作系统/服务器相关

Windows XP   Windows 2000   Windows 2003   Windows Me   Windows 9.x   Linux   UNIX   注册表   操作系统   服务器   应用服务器

图形图像多媒体相关

Photoshop   Fireworks   Flash   Coreldraw   Illustrator   Freehand   Photoimpact   多媒体   图形图像

标准 网站致力的规范

Valid CSS!

无不良内容,无不良广告,无恶意代码

Valid XHTML 1.0 Transitional

creativecommons