您的位置: 首页 > 技术文档 > 网页制作 > 悟道Web标准:让W3C标准兼容终端
全透视:CSS Z-index 属性 回到列表 悟道WEB标准:统一思想,遵循标准
 悟道Web标准:让W3C标准兼容终端

作者:greengnn 时间: 2009-10-10 文档类型:原创 来自:蓝色理想

第 1 页 悟道Web标准:让W3C标准兼容终端 [1]
第 2 页 悟道Web标准:让W3C标准兼容终端 [2]

其实上面所说的,也就是让W3C标准兼容终端,本应该终端按照W3C规范来开发解析器,但是种种的原意,终端各持己见,置W3C标准于不顾,而用户体验永远是第一位的。所以我们既然遵循标准,又要兼容终端。
我们不是标准的制定者,仅仅是实施者。就要考虑到项目的用户群体的特性,使用哪个终端多一点,显而易见,IE6的使用者仍然是大多数的。而且XHTML的严格定义方式不符合IE6的解析方式。通过权衡,即选择了W3C的推荐标准,虽然不是最新的,也兼容了现有终端的情况。
废话有点多了,概要的说明一下,选择一个适合项目大多数用户终端的标准,就HTML来说,4.0和xhtml1.0(改良后)都是不错的,但是要遵循HTML的结构化和语义化的要求,标签必须小写,闭合合理,嵌套正确,摒弃表现型标记,结构代码和表现代码分离。html1.0也可以编写成xml结构化的状态,即时没有xml声明。

CSS是最头疼的一块,如果严格按照W3C的css2.1规范,是很难兼容到IE系列浏览器的,特别是IE5.5 IE6两种,他们的解析和W3C相差甚远,所以CSS文件就必须进入hack,一种是css自身的私有属性和私有识别的代码,一种是IE浏览器特有的条件注释。细节就不多讲了。
如何既遵循标准,有兼容浏览器。那就是使用符合标准或者近似符合的浏览器作为主要开发软件,我建议安装有firebug插件的firefox作为第一个调试工具,等界面完成后,再调试其他浏览器,通过csshack或者条件注释,或者两者混搭。
理想的CSS兼容方案是,IE8,firefox这类通过Acid2 测试的浏览器使用标准的CSS代码,对没有通过测试的(就是IE系列)使用条件注释。例如:

<link rel="stylesheet" type="text/css" href="w3c.css" />
<!--[if IE 7]>
<link rel="stylesheet" type="text/css" href="ie7.css" />
<![endif]-->
<!--[if lt IE 7]>
<link rel="stylesheet" type="text/css" href="ie7lt.css" />
<![endif]-->

IE5.5的份额太少,可以考虑不兼容,兼容也主要是盒模型上的兼容。
理想的终究会存在很多现实的问题,比如IE的请求数过多,这是速度上的损失,代码维护不方面,同一个页面需要维护多个css文件,容易产生遗漏,避免这两个因素,css hack是做好的方式,主样式+私有样式解决兼容问题。
针对IE,常见bug的处理,haslayout的触发,放在标准CSS代码的后面。比如:

.clearfix:after{content:"\0020"; display:block; height:0; clear:both;}
.clearfix{*zoom:1;/*IE haslayout*/}
.box {float:left;margin-left:20px;_display:inline;/*双倍margin bug*/}

以后的浏览器对CSS的处理都采用W3C css2.1规范为主,私有属性为辅的策略,比如firefox的-moz-,IE8的-ms-,sefari和Chrome的-webkit-,Opera的-o-。

Javascript的标准兼容终端,我不是很清楚,基本的还可以看出,应用W3C的DOM操作文档树,而不是IE的document.all,摒弃IE的Jscript和VBscript。而且JS是可以去判断终端的,实例:

var ua = navigator.userAgent.toLowerCase();
    var _isOpera = ua.indexOf('opera') != -1,
        _isSafari = ua.indexOf('safari') != -1,
        _isGecko = !_isOpera && !_isSafari && ua.indexOf('gecko') > -1,
        _isIE = !_isOpera && ua.indexOf('msie') != -1,
        _isIE6 = !_isOpera && ua.indexOf('msie 6') != -1,
        _isIE7 = !_isOpera && ua.indexOf('msie 7') != -1;

通过终端的判断,给IE开小灶,解决IE 的兼容问题。

if (_isIE6) { // IE6
            //语句
}

DHTML的历史远远大于现在所说的富客户端,很多经验组建都源自于早期的IE平台上的DHTML,如何保持JS主体代码的标准化和对IE系列的兼容,我自己还需要再积累积累。

最后,为什么很多团队要求将firefox作为开发环境,待代码完成后再进行IE系列的bug调试。就是基于这个思想,先按照W3C标准规范编码,再处理对标准支持不好的浏览器的。这样你才能理解为什么把IE的错误解析成为bug,而且页面工程师的教材也接近统一,那就是W3C的文档,那是我们权威的教材。向后,终端都尊重了W3C标准,IE8就是很好的例子。

经典论坛交流
http://bbs.blueidea.com/thread-2952264-1-1.html

本文链接:http://www.blueidea.com/tech/web/2009/7055.asp 

出处:蓝色理想
责任编辑:bluehearts

上一页 悟道Web标准:让W3C标准兼容终端 [1] 下一页

◎进入论坛网页制作WEB标准化版块参加讨论,我还想发表评论

相关文章 更多相关链接
悟道WEB标准:统一思想,遵循标准
关于文件命名
分离之后的感想
Web开发的改良
全方位清理浮动
作者文章 更多作者文章
悟道WEB标准:统一思想,遵循标准
分离之后的感想
页面生命周期2.0
页面制作角色的思考
像table一样布局div II
关键字搜索 常规搜索 推荐文档
热门搜索:CSS Fireworks 设计比赛 网页制作 web标准 用户体验 UE photoshop Dreamweaver Studio8 Flash 手绘 CG
站点最新 站点最新列表
周大福“敬•自然”设计大赛开启
国际体验设计大会7月将在京举行
中国国防科技信息中心标志征集
云计算如何让安全问题可控
云计算是多数企业唯一拥抱互联网的机会
阿里行云
云手机年终巨献,送礼标配299起
阿里巴巴CTO王坚的"云和互联网观"
1499元买真八核 云OS双蛋大促
首届COCO桌面手机主题设计大赛
栏目最新 栏目最新列表
浅谈JavaScript编程语言的编码规范
如何在illustrator中绘制台历
Ps简单绘制一个可爱的铅笔图标
数据同步算法研究
用ps作简单的作品展示页面
CSS定位机制之一:普通流
25个最佳最闪亮的Eclipse开发项目
Illustrator中制作针线缝制文字效果
Photoshop制作印刷凹凸字体
VS2010中创建自定义SQL Rule
>> 分页 首页 前页 后页 尾页 页次:2/21个记录/页 转到 页 共2个记录

蓝色理想版权申明:除部分特别声明不要转载,或者授权我站独家播发的文章外,大家可以自由转载我站点的原创文章,但原作者和来自我站的链接必须保留(非我站原创的,按照原来自一节,自行链接)。文章版权归我站和作者共有。

转载要求:转载之图片、文件,链接请不要盗链到本站,且不准打上各自站点的水印,亦不能抹去我站点水印。

特别注意:本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有,文章若有侵犯作者版权,请与我们联系,我们将立即删除修改。

您的评论
用户名:  口令:
说明:输入正确的用户名和密码才能参与评论。如果您不是本站会员,你可以注册 为本站会员。
注意:文章中的链接、内容等需要修改的错误,请用报告错误,以利文档及时修改。
不评分 1 2 3 4 5
注意:请不要在评论中含与内容无关的广告链接,违者封ID
请您注意:
·不良评论请用报告管理员,以利管理员及时删除。
·尊重网上道德,遵守中华人民共和国的各项有关法律法规
·承担一切因您的行为而直接或间接导致的民事或刑事法律责任
·本站评论管理人员有权保留或删除其管辖评论中的任意内容
·您在本站发表的作品,本站有权在网站内转载或引用
·参与本评论即表明您已经阅读并接受上述条款
推荐文档 | 打印文档 | 评论文档 | 报告错误  
专业书推荐 更多内容
网站可用性测试及优化指南
《写给大家看的色彩书1》
《跟我去香港》
众妙之门—网站UI 设计之道
《Flex 4.0 RIA开发宝典》
《赢在设计》
犀利开发—jQuery内核详解与实践
作品集 更多内容

杂⑦杂⑧ Gold NORMANA V2