You need to be a tester

January 28, 2002

You, as a Web designer who cares about standards, don’t just need to know HTML, CSS and whatever other languages your clients require. You need to have a certain kind of personality. No, not a creative personality, although that helps – you need to be persistent, inquisitive and doggedly determined. This is not because you need to have special qualities to get your clients to pay (heck, I pull a public-sector salary, and Web design work is only one part of my job description). These qualities are needed to understand browser bugs and develop workarounds.

For example, when MacEdition launched, we hit a crashing bug in early Netscape versions. I now have a full diagnosis of the problem – DIVs with border styles containing certain other tags such as nested tables or ACRONYM will crash Netscape Navigator 4.0 to 4.08 – but working that out took weekends of simplifying the page down and testing all possible combination of elements. I have since added it to my listing of valid CSS that consistently crashes some version of Netscape 4 – as far as I am aware, it’s the only such compilation on the Web.

Similarly, when I went public with the Opera CSS px-unit rescaling issue, it was only after a number of evenings of comparing the same page in Opera and other browsers, holding up a ruler to the screen.

And when I finally got my iBook with Mac OS X, I realized that a few basic tester pages and the W3C’s CSS1 test suite are not enough. In previous columns, I have stated that OmniWeb only supports the CSS background-color property on BODY and table cells (TD and TH elements), and DIV elements in Version 4.1. That’s not the whole story. It turns out that OmniWeb will respect the background-color property of other elements, provided they are absolutely positioned or have the position:fixed style applied. However, position:fixed doesn’t actually work like it’s meant to – fix the element’s position in OmniWeb – it just colors the background.

Now, I would never have worked this out from the W3C test suite or from screenshots from readers. I was able to work out other gems of nutty CSS goodness, such as the fact that OmniWeb supports margin styles defined separately, like margin-left:20px; but (until Version 4.03) not margin:20px for all sides. But there are a lot of properties in the CSS spec, and one test suite can’t cover them all in enough detail to nail these bugs.

There are resources other than the W3C test suite, and it’s fair to say that there is a lot of information around about CSS1 support in the main browsers. However, it don’t always cover the most recent versions or the more complicated problems. Bugs involving complex combinations of elements and properties plague some browsers, but are likewise not covered in the standard resources. Even though IE6 was representing up to 20 percent of the pageviews for “mainstream” (non-Mac) sites by December 2001, there is still actually very little information available on the specific bugs in this new browser, although at least one bug associated with scrolling content seems to have been identified in detail.

Offsetting this increased complexity of the browser population, newer browsers like Opera and Netscape 6/Mozilla are, like Netscape 4, pretty much bug-for-bug compatible across platforms. This means that in general, if something is broken on Windows it will also be broken on the Mac OS and Linux. The same could not be said of Internet Explorer, where Version 6 on Windows is only now catching up to what Version 5.0 on the Mac was doing two years ago.

Richinstyle is at least making an effort to keep up to date with new browsers but is quite incomplete in places. Eric Meyer’s Master Grid and the CSS Pointer Group bug list are updated less frequently and really only concentrate on the Level 1 version of the spec. This is not surprising given that support for properties introduced in CSS2 was very sparse until 2001, and still incomplete now. David Baron’s test pages are a valuable resource listing bugs in Mozilla/Netscape 6’s support for CSS2 properties.

Although information about some newer browsers like Mozilla, Opera 6, IE6 and Konqueror is beginning to be incorporated into these resources, it’s unfortunate that none of these resources currently cover Mac-only browsers like OmniWeb or iCab. There is a wonderful resource comparing all Mac OS X browsers’ support for various key features but unfortunately it doesn’t go into any detail about CSS. So authors of Mac-oriented sites are behind the eight ball relative to more general-interest sites, because we have less information about the capabilities of browsers used by our readers. On the other hand, iCab and OmniWeb seem to account for a smaller proportion of MacEdition’s readership than IE6 already does for many sites, which is also less documented at present than previous versions.

Now, I suppose I could spend the next few months testing browsers, but if I haven’t mentioned it before, I have a PhD thesis that I really should be writing instead. I have gotten as far as this partial list of CSS support in OmniWeb 4.0.6 and 4.1 Beta, and iCab 2.6, but there is more to do. So if you have time, you can help all Mac-oriented Web authors (and non-Mac-oriented ones) by pitching in. First, fire up your Mac-specific browsers and head on over to Richinstyle. Fill out as many of the tests as your can bear to complete (don’t forget to set your browser tag to something real, not a spoofing option ). Second, if there are specific bugs and glitches you have identified in some of these browsers that are not captured by the standard tests, tell me. Especially tell me if you have a reproducible Netscape 4 crash on valid HTML and/or CSS. Crash bugs are virtually impossible to find systematically; you have to just stumble across them.

The best solution to browser bugs and bad standards support is for manufacturers to stop producing them. We’ve gotten a long way on that with Opera, Netscape 6/Mozilla, IE5.x for Mac and IE6 for Windows. There are still glitches and gaps which need more documentation, but things are a lot better than two years ago or even one year ago. However, there are still older and new but less standards-compliant browsers out there, like Netscape 4 and the Mac-specific browsers. Identifying Netscape 4 bugs helps all Web authors work around its crappiness. Hammering down the bugs in the Mac-specific browsers gives us a set of solid information to take back to their creators. Web authors need to work together on this one.

Will you join CodeBitch? You’ll need to be a tester.

— CodeBitch (codebitch@macedition.com) is the grumpy cow who does the HTML production for MacEdition. Read other articles by CodeBitch

E-mail this story to a friend