联系站长 加入收藏 设为首页 繁體中文 RSS
  首页 | 生活百科 | 电脑网络 | 高手学堂 | 语录名言 | 读书文学 | 极品软件 | 奇趣图片 | 站长微博  
 您的位置: 精品百字节网 >> 电脑网络 >> 站长宝典 >> 正文 当前没有通告!
   □  网站设计的标准时代   3星级
网站设计的标准时代
[ 作者:青菜芋子     来源:青菜芋子's blog     点击数:     更新时间:2008-04-03     文章录入:Admin
【字体:
[内容提要]
网络上的变革每天都在发生,当我们觉得网站设计技术已经非常简单和熟悉的时候。国外网站设计标准化的概念早已悄悄的形成和迅速“蔓延”,自2000年起,大部分新发行的浏览器版本都开始支持网站标准。主流的网页编辑工具也开始全面支持网站标准,甚至一些软件几乎完全由XML文件组成,例如DreamweaverMX。一些著名的大型商业网站开始采用网站标准来重新构建(例如体育资讯www.espn.com),另外一些则拒绝非标准浏览器浏览它们的网站(例如连线杂志www.wired.com)。众多的设计网站(例如:www.k10k.net)和个人网站更是标准推广的先行者,纷纷转向采用XHTML+CSS来建立。2004年2月4日XML1.1推荐标准正式发布,标志着网站设计的标准时代已经到来。
本文观点:遵循国际网站标准(WebStandards)进行网站设计和改善。
阅读对象:网站设计人员、web应用开发人员
关键字:WebStandards、XML、XHML、CSS、DOM、DOCTYPE、Accessibility
前言
网络上的变革每天都在发生,当我们觉得网站设计技术已经非常简单和熟悉的时候。国外网站设计标准化的概念早已悄悄的形成和迅速“蔓延”,自2000年起,大部分新发行的浏览器版本都开始支持网站标准。主流的网页编辑工具也开始全面支持网站标准,甚至一些软件几乎完全由XML文件组成,例如DreamweaverMX。一些著名的大型商业网站开始采用网站标准来重新构建(例如体育资讯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标准都没有遵循。举例来说:标签,早在1998年4月HTML4.0标准中就已经被W3C列为“不建议使用(deprecated)”标签。但我们的三大门户网站首页上都有不少类似的代码。这里的简单列表,目的不是批评这些网站做得不好(事实上大部分的大型商业站点都通不过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)。对应的标准也分三方面:结构化标准语言主要包括XHTML和XML,表现标准语言主要包括CSS,行为标准主要包括对象模型(如W3CDOM)、ECMAScript等。这些标准大部分由W3C起草和发布,也有一些是其他标准组织制订的标准,比如ECMA(EuropeanComputerManufacturersAssociation)的ECMAScript标准。我们来简单了解一下这些标准:
1.结构标准语言
(1)XML
XML是TheExtensibleMarkupLanguage(可扩展标识语言)的简写。目前推荐遵循的是W3C于2000年10月6日发布的XML1.0,参考(www.w3.org/TR/2000/REC-XML-20001006)。和HTML一样,XML同样来源于SGML,但XML是一种能定义其他语言的语。XML最初设计的目的是弥补HTML的不足,以强大的扩展性满足网络信息发布的需要,后来逐渐用于网络数据的转换和描述。关于XML的好处和技术规范细节这里就不多说了,网上有很多资料,也有很多书籍可以参考。
(2)XHTML
XHTML是TheExtensibleHyperTextMarkupLanguage可扩展标识语言的缩写。目前推荐遵循的是W3C于2000年1月26日推荐XML1.0(参考http://www.w3.org/TR/xhtml1)。XML虽然数据转换能力强大,完全可以替代HTML,但面对成千上万已有的站点,直接采用XML还为时过早。因此,我们在HTML4.0的基础上,用XML的规则对其进行扩展,得到了XHTML。简单的说,建立XHTML的目的就是实现HTML向XML的过渡。
2.表现标准语言
CSS是CascadingStyleSheets层叠样式表的缩写。目前推荐遵循的是W3C于1998年5月12日推荐CSS2(参考http://www.w3.org/TR/CSS2/)。W3C创建CSS标准的目的是以CSS取代HTML表格式布局、帧和其他表现的语言。纯CSS布局与结构式XHTML相结合能帮助设计师分离外观与结构,使站点的访问及维护更加容易。
3.行为标准
1)DOM
DOM是DocumentObjectModel文档对象模型的缩写。根据W3CDOM规范(http://www.w3.org/DOM/),DOM是一种与浏览器,平台,语言的接口,使得你可以访问页面其他的标准组件。简单理解,DOM解决了Netscaped的Javascript和Microsoft的Jscript之间的冲突,给予web设计师和开发者一个标准的方法,让他们来访问他们站点中的数据、脚本和表现层对像。
(2)ECMAScript
ECMAScript是ECMA(EuropeanComputerManufacturersAssociation)制定的标准脚本语言(JAVAScript)。目前推荐遵循的是ECMAScript262(http://www.ecma.ch/ecma1/STAND/ECMA-262.HTM)。
三.遵循标准的网站与传统网站的区别
传统网站只是印刷媒体的延伸,设计目标是保证在4-6个主流浏览器版本中看起来一致。通常的特征是:

以表格为基础的布局。
内与表现方式混杂在一起。典型的例子是标签。
垃圾代码(非标准代码)。
不易用的代码。
语义不正确的代码。比如不解释的话,你根本不明白这是字体加粗的意思。
而采用网站标准建立的网站是一个能够接受各种用户和各种设备的广泛的交流沟通工具。一般特征是:

语义正确的标识。即使用能够表达含义的标签。保证代码可以在文本浏览器、PDAs、搜索引擎中被正确理解。
正确有效的代码。通过W3C代码校验(http://validator.w3.org/)的就是正确代码。
对人、机都易用的代码。能够接受广泛的用户和设备的访问,
用CSS分离表现层和内容。使代码更简洁、下载速度更快,批量修改和定制表现形式更容易。

四.采用网站标准的好处和缺点
1.好处
对网站浏览者的好处:
文件下载与页面显示速度更快;
内容能被更多的用户所访问(包括失明、视弱、色盲等残障人士);
内容能被更广泛的设备所访问(包括屏幕阅读机、手持设备、搜索机器人、打印机、电冰箱等等)
用户能够通过样式选择定制自己的表现界面
所有页面都能提供适于打印的版本
对网站所有者的好处:

更少的代码和组件,容易维护
带宽要求降低(代码更简洁),成本降低。举个例子:当ESPN.com使用CSS改版后,每天节约超过两兆字节(terabytes)的带宽。
更容易被搜寻引擎搜索到
改版方便,不需要变动页面内容
提供打印版本而不需要复制内容
提高网站易用性。在美国,有严格的法律条款(Section508)来约束政府网站必须达到一定的易用性,其他国家也有类似的要求。


2.缺点
需要花费更多时间来学习标准
依然需要注意浏览器的兼容问题
用CSS来实现某些表现反而比表格更为麻烦


五.怎么改善现有网站
我们大部分的设计师依旧在采用传统的表格布局、表现与结构混杂在一起的方式来建立网站。学习使用XHTML+CSS的方法需要一个过程.
上一篇文章:如何提高网站的Google PR值 下一篇文章:友情链接的重要作用
发表评论 □告诉好友 □打印此文 □收藏此页 □关闭窗口 □返回顶部
 最新热点文章
 精品医院类网站网址大收集
 如何删除windows 2003或xp系统隐藏的...
 DedeCms管理员后台登陆经常自动退出的...
 知道IP如何用dos命令查出电脑名称
 WORD出错老是要求以安全模式打开文件...
 如何设置首页不显示页眉页脚?
 如何利用inurl命令查询网站外链及栏目...
 
 最新推荐文章
 精品医院类网站网址大收集
 如何利用宽带路由器控制局域网内电脑上...
 CSS圆角代码的实现方法
 带停顿的单行文字滚动代码
 实用的新网站免费收录提交地址精选
 Left join , Right Join, Inner Join用...
 趣话淘宝网衍生的多种新型职业
 
 最新图文
  ◇  网友评论:(只显示最新5条。评论内容只代表网友观点,与本站立场无关!)
关于本站 | 免责申明 | 网站地图 | 联系站长 | 友情链接 | 与我同在
冀ICP备06032589号【虚拟化精英群虚拟化精英群续
  Copyright© 2006-2009 100byte.Com All Rights Reserved
网站声明:本网站是公益性质网站,部分内容来源于网络,如有侵犯您权利的地方,请与精品百字节站长联系,尽快修正.
Powered By CreateLive CMS 本站法律顾问:(冀港)武镇海律师
点击这里给我发消息