专栏首页程序生涯Acid: 单网页检查页面,浏览器兼容性测试,浏览器好坏的标志

Acid: 单网页检查页面,浏览器兼容性测试,浏览器好坏的标志

某网页在Firefox中很正常、很漂亮,但是在IE中就变得乱七八糟,这究竟是谁的问题呢?这个问题答案就是Acid

Acid是什么?

互联网中存在这各种各样的网页服务器、网页浏览器,他们往往是在不同平台、采用不同的技术开发。由于大家采用的标准不同,导致早期互联网存在大量的不兼容问题。典型的表现形式就是,一个浏览器中正常的网页,在另外一个浏览器中就变得不正常。

为此,1994年10月,互联网联盟(World Wide Web Consortium,简称W3C)在麻省理工学院计算机科学实验室成立,建立者是互联网的发明者Tim John Berners Lee。W3C制定了一系列标准并督促Web开发者和内容提供者遵循这些标准。标准的内容包括使用语言的规范,开发中使用的导则和解释引擎的行为等等。W3C也制定了包括XML和CSS等的众多影响深远的标准规范。

兼容性的一个核心问题就是浏览器如何对于网页进行排版,即如何渲染(Render)。但是,各个浏览器的开发者都更加愿意自己设定标准,这样浏览器一旦占领市场,就可以新来的竞争者设置障碍。微软的IE尤其喜欢这样,通过捆绑占领市场,通过奇怪的网页标准让对手浏览器无所适从。所以W3C标准制定的初期,基本上无人理睬。

为了确立标准制定者的权威,W3C在不断游说各大浏览器开发者的同时,想出了一个绝妙的主意。1998年W3C建立了一个网页标准项目,Web Standards Project,招募专业网页程序员开发了一个测试网站,用来测试浏览器对于W3C标准的遵循程度,这个测试网站,就是Acid

在这个网站面前,哪些浏览器和蔼可亲,哪些浏览器头上有角就变得一清二楚。这让用户选择有了一个直观的比较,让浏览器开发员有了一个明确的目标。采用相同的标准,能够让网站开发者节省大量的时间,让浏览器的用户看到更多的内容,所以随着时间的推移,通过Acid测试也逐渐成为评价浏览器好坏的标志。

目前Acid测试分Acid1Acid2Acid3三级,Acid4测试正在开发中。

如果浏览器能够通过Acid1测试,会在页面上看到一堆红色、黄色和黑色的盒子。Acid1主要测试的是对CSS 1.0的兼容程度,目前所有主流浏览器都能够完美通过测试,包括IE6、IE7、IE8、Firefox 2、Firefox 3、Safari 3、Safari 4、Chrome 1、Chrome 2、Opera 9。

Acid1测试页面: http://acid1.acidtests.org/

如果浏览器能够通过Acid2测试,会在页面上看到一个笑脸。Acid2主要测试的对象是HTMLCSS 2.0PNG图像标准。该测试网页编码十分严谨,稍有不符合,就排不出笑脸或者画面出现异常。测试刚推出时,没有一个浏览器能通过测试。2005年Safari和Konqueror通过、2006年Opera和Firefox通过,IE直到2009年的IE 8.0方才通过。

Acid2测试页面: http://acid2.acidtests.org/

用浏览器打开Acid3的测试页面,页面会不断加载功能,直接给出测试满足程度的分数,完美结果为100分。Acid3主要测试的对象是ECMAScriptDOM Level 3Media Queriesdata: URL。测试刚推出的时候,没有一个浏览器可以通过测试。下表是到目前(2009-06)为止的各主要浏览器测试成绩。

浏览器

版本

测试成绩

Firefox

3.0.11

72/100

Konqueror

4.2.4

87/100

Opera

9.64

85/100

IE

8.0

20/100

Safari

4.0

100/100

Chrome

2.0.172.31

100/100

Acid3测试页面: http://acid3.acidtests.org/

后话

回到文章开头时候提的那个问题,某网页在Firefox中很正常、很漂亮,但是在IE中就变得乱七八糟,这究竟是谁的问题呢?从目前Acid的表现看,基本上是IE的问题吧,呵呵。另外,在中国,目前使用最广的浏览器还是老旧的IE6,这是个连Acid2都没有通过的浏览器啊,无话可说。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 序列化与json性能评测

    在小数据压缩方面,json比序列化快了近1倍,而其他方面序列化比json都要快一些,特别是大数据解压缩这一块整整快了4倍。

    用户7657330
  • PHP缓存技术介绍

    缓存是指临时文件交换区,电脑把最常用的文件从存储器里提出来临时放在缓存里,就像把工具和材料搬上工作台一样,这样会比用时现去仓库取更方便。因为缓存往往使用的是RA...

    用户7657330
  • 浏览器内核及分类

    浏览器=shell+内核 其中shell的种类相对比较多,内核则比较少。Shell是指浏览器的外壳:例如菜单,工具栏 等。主要是提供给用户界面操作,参数设置...

    用户7657330
  • 纯 CSS 实现波浪效果!

    Sb_Coco
  • 前端-纯CSS实现波浪效果!

    当然,借助其他力量(SVG、CANVAS),是可以很轻松的完成所谓的波浪效果的,先看看,非 CSS 方式实现的波浪效果。

    grain先森
  • web图像的常见应用策略与技巧

    本文介绍一些关于响应式图像的适配应用策略,回退原理,SVG的换色技巧,雪碧图的百分比定位计算公式等相关的一些小知识点,目的在于帮助一部分同学快速的理清图像应用思...

    练小习
  • web图像的常见应用策略与技巧

    腾讯ISUX
  • web图像的常见应用策略与技巧

    本文介绍一些关于响应式图像的适配应用策略,回退原理,SVG的换色技巧,雪碧图的百分比定位计算公式等相关的一些小知识点,目的在于帮助一部分同学快速的理清图像应用思...

    练小习
  • 快速部署DBus体验实时数据流计算

    说明all in one是一个单机版本dbus环境,是给用户快速体验dbus的功能,只是一个简单体验版,不能用于其它环境或者用途,具体包括如下:

    宜信技术学院
  • SQL可以正常用,但cmd启动不了mysql,报错[ERROR] unknown variable ;basedir=....问题

    SQL可以正常用,但cmd启动不了mysql,报错[ERROR] unknown variable ;basedir=….问题 解决办法:将对应[mysql...

    学到老

扫码关注云+社区

领取腾讯云代金券