Friday, April 8th 2005

Web Standards: The Acid2 Test

About a month back, Håkon Lie announced the planned creation of a browser technology test page named Acid2. The Web Standards Project agreed to sponsor and host the effort. Now the Acid2 test has been launched, although it hasn’t yet been officially announced.

It’s quite an ingenious work of art actually. It consists of a complex HTML page which makes use of a whole number of advanced CSS2 features. If rendered correctly, the various divs and spans and what-nots will make up a happy yellow face.

This test page makes me realize that even though Opera and Firefox are pretty good, they still have some way to go before they fully implement the available and useful standards. Here are screenshots showing how three common browsers cope with the test:

Here are screenshots of some old and some yet-to-be-released browsers: (Comparing Netscape 6.1 and a recent Firefox nightly build shows how far the Gecko layout engine has come since August 2001.)

Hopefully the Acid2 will inspire all the browser makers to further improve their standards compatibility. He who lives shall see.

Update: Reduced the size of the screenshots a bit.

Update 2005-11-02: Safari now passes the test! HamsterDeCombast posted a screenshot in the comments.

Posted in browsers, firefox, internet explorer at 17:27. You can follow any responses to this entry through this RSS feed. You can leave a response, or trackback from your own site.

No Responses to this post:

  1. Anonymous says:
    April 13, 2005 at 17:17

    Which browser(s) did make the cut?

  2. David Naylor says:
    April 13, 2005 at 20:26

    None. :-)

  3. Yuhui says:
    April 14, 2005 at 02:41

    Could you test Safari please?

  4. David Naylor says:
    April 14, 2005 at 08:17

    Well, I run a PC, so I can’t. But there is one here (made using a developer version of 1.3):http://www.paristemi.com/images/browsershots/safari.jpg

  5. Aaron says:
    April 14, 2005 at 13:53

    yuhui-I have Safari, Knoqueror and Epiphany tested at my site, as well as FireFox, IE, Netscape and Opera.

  6. Kevin says:
    April 14, 2005 at 14:42

    Hey, the big QUESTION is — HOW THE HECK DID HE DESIGN/DEVELOP THE PAGE W/O KNOWING WHAT THE FINAL RESULT WAS if all other browsers failed??Kinda like painting in the dark – how does he know that’s not what should be rendered??? haha

  7. Miles says:
    April 14, 2005 at 15:32

    Because he has a brain and uses it? The standards (when well designed and written) are deterministic. Some of us can see this stuff clearly in our mind. But I suspect with something like this, he laid it out on paper or using a paint program, and had other people look it over, explaining what went where, and why. That’s how I’d do it.Feel free to download the code and do it, yourself!If you were just trying to be funny, my apologies; you need to work on delivery or timing or something. 8^/

  8. David Naylor says:
    April 14, 2005 at 16:00

    Heh. Another point worth mentioning is that one of the co-authors of the test is the inventor of CSS.

  9. Anonymous says:
    April 17, 2005 at 01:46

    Firefox 1.03 renders the smiley correctly.

  10. Anonymous says:
    April 17, 2005 at 21:00

    i have 1.0.2 firefox and it renders a smiley face properly…would be nice to have an image that shows what it’s ’supposed’ to look like though, at the moment, we have no idea what the test is supposed to render, so makes it a bit hard to test…

  11. David Naylor says:
    April 17, 2005 at 21:32

    If you see the smiley face you are not looking at the test page, you are looking at the reference rendering.

  12. Anonymous says:
    April 18, 2005 at 01:11

    firefox 1.0.3 / win2k pro. failed

  13. Anonymous says:
    April 28, 2005 at 15:23

    safari now passeshttp://weblogs.mozillazine.org/hyatt/index.html

  14. omz says:
    August 7, 2005 at 23:23

    >>At 5:32 PM, Miles said…>>… The standards (when well designed and written)>> are deterministic…don’t you think this standard ( CSS ) is complex and should not to be ?will be completeley supported by one browser some day ? i dont think so.W3C: describe thinks easier ( kind of unix KISS philosopy ) !! this is not about spaceships design !! its aboutrenderign visual objects. Call Mozilla, MS, Netscape, Opera and make a decent and realizable standard

  15. David Naylor says:
    September 21, 2005 at 08:43

    “Call Mozilla, MS, Netscape, Opera and make a decent and realizable standard”Actually, the W3C is Mozilla, MS, Netscape and Opera.

  16. HamsterDeCombat says:
    November 2, 2005 at 06:47

    Screenshot of Safari 2.0.2 :http://hamsterdecombat.free.fr/images/acid2_safari.pngThe nose becomes blue when you pass the mouse on it.

  17. David Naylor says:
    November 2, 2005 at 07:20

    Cool – thanks!

  18. Anonymous says:
    November 4, 2005 at 22:16

    Opera now reads the page correctly, and is free as well!

  19. David Naylor says:
    November 4, 2005 at 23:46

    Does it really? Last thing I heard it only almost did…

  20. Anonymous says:
    January 2, 2006 at 07:26

    don’t know about the pre-release of Opera version 9, but 8.51 doesn’t render correctly, though it does look better than the screenshot posted here of 8…

Leave a Reply

«
»