Advanced Browser and Platform Compatibility
Objectives:
Understand that different browsers exist and each has its own way of rendering a page.
Understand that different computer platforms render web pages differently, even with the same browser.
Build a web page that will happily work across all the major browsers and platforms.
Designing for the World Wide Web brings with it a cartload of problems that were not associated with traditional media. The simple fact that a web developer cannot be sure exactly how a page will display on the end user's computer screen (or television, or PDA, or mobile phone, or Braille reader) is a serious consideration. What you can do, however, is use code known to work across different platforms and test with the most common hardware and software configurations.
Such problems do not exist with traditional media, although they have problems of their own. In the world of print, after you've seen what's coming off the printing press, you can be 100-percent sure that is exactly how your audience will be viewing your work. Of course, it can be a tricky job to get the finished article to come out right, but that's another matteryou always have the chance to see your work in the same way your audience will see it.
When a web developer launches a site, there is always the chance that a user somewhere will be viewing the site with a hardware and software configuration that was not tested for. With the wild differences in the way pages look under different circumstances, this quickly becomes very complicated. What's more, you may never know that there is a problem unless someone is kind enough to report it. Most users will just leave the site if it doesn't work properly for them.
Available Browsers
A great number of browsers are available on the Internet. Some are excellent groundbreaking products, whereas others are just small hobby projects. Table 4.1 lists a number of the most commonly used browsers available at the time of writing and a usage percentage from three different sources. Note that many browsers are available, most of which are used by very few people, and some of which do not report their identity properly, making them impossible to detect or log.
Table 4.1 Browsers Currently in Common Use and Their Market Share
|
Source 1 |
Source 2 |
Source 3 |
Internet Explorer 6 |
29% |
27% |
36% |
Internet Explorer 5 |
59% |
62% |
40% |
Internet Explorer 4 |
4.0% |
3.1% |
2.3% |
Internet Explorer 3 |
0.1% |
0.05% |
0.5% |
Internet Explorer 2 |
0.05% |
0 |
0.1% |
Netscape Navigator 6 / Mozilla |
1.0% |
1.0% |
5.9% |
Netscape Navigator 4 |
5.0% |
5.1% |
5.8% |
Netscape Navigator 3 |
0.1% |
1.4% |
0.25% |
Opera versions |
0.5% |
0.15% |
0.5% |
(Other) |
1.5% |
0.15% |
8.0% |
Source: Browser News (http://www.upsdell.com/browserNews/), March 10, 2002.
The statistics in Table 4.1 were gathered from three different sources, as detailed here:
Source 1. Statistics are from sites that use a hit counter, which excludes many popular, professionally made sites.
Source 2. Statistics are from Proteus the Internet Consultancy (http://www.proteus.co.uk), and are primarily from UK sites, with a somewhat regional audience. Note the anomalously high Netscape Navigator 3 percentage. This may include browsers that mimic Netscape, which other sources classify as "other" browsers.
Source 3. Statistics are from http://www.upsdell.com. Because of its special audience, its statistics apply to a narrow segment of the population.
As you can see, Internet Explorer has the dominant market share, and the nearest competitor (Netscape Navigator) is a long way behind. With Internet Explorer being shipped with every copy of Microsoft Windows, we can only expect that lead to grow.
TIP
You can keep up-to-date with the latest statistics at the Browser News web site (http://www.upsdell.com/browserNews/).
Even though you can estimate that approaching 90 percent of your site's visitors will be using a modern version of Internet Explorer, that doesn't mean you can totally ignore the rest. Roughly 10 percent of visitors still use a browser other than Internet Explorer 5 or 6, and that's a percentage that needs considering before it is ignored out of hand. This is one reason why it is still important to create cross-browser web sites and not lose a potential 10 percent of your customers.
Support for Technologies
With so many different technologies out there on the web, and with so many different browsers supporting a selection of each, designing a widely compatible web site becomes a nearly impossible task for any Web developer.
Table 4.2 offers a guide to which technologies are supported by which browsers. Of course, all have their idiosyncrasies in the way they support these technologies; so the information needs to be taken with a pinch of salt and should not be considered a substitute for thorough testing.
Table 4.2 Browsers and Their Supported Technologies
|
HTML 3.2 |
HTML 4.0 |
Java |
JavaScript |
CSS 1 |
CSS 2 |
XML |
DOM 1 |
DOM 2 |
I-frames |
Plug-ins |
Windows |
|||||||||||
Explorer 5.5 |
Y |
Y |
Y |
Y |
P |
P |
P |
P |
P |
Y |
Y |
Explorer 5.0 |
Y |
Y |
Y |
Y |
P |
P |
P |
|
|
Y |
Y |
Explorer 4.0 |
Y |
|
Y |
Y |
|
|
|
|
|
Y |
Y |
Netscape 6 |
Y |
Y |
Y |
Y |
Y |
P |
Y |
Y |
P |
Y |
Y |
Navigator 4.7 |
Y |
Y |
Y |
Y |
Y |
P |
|
P |
|
|
Y |
Navigator 3.0 |
Y |
|
Y |
Y |
|
|
|
|
|
|
Y |
Opera 5 |
Y |
Y |
Y |
Y |
Y |
P |
Y |
P |
P |
Y |
Y |
Opera 3 |
Y |
Y |
Y |
Y |
Y |
P |
|
|
|
|
|
Macintosh |
|||||||||||
Explorer 5.0 |
Y |
Y |
Y |
Y |
Y |
P |
Y |
P |
|
P |
Y |
Explorer 4.5 |
Y |
|
Y |
Y |
P |
|
|
|
|
Y |
Y |
Netscape 6 |
Y |
Y |
Y |
Y |
Y |
P |
Y |
Y |
P |
Y |
Y |
Navigator 4.72 |
Y |
|
Y |
Y |
Y |
P |
|
|
|
|
Y |
Opera 5pre |
Y |
Y |
Y |
Y |
Y |
Y |
Y |
P |
P |
Y |
Y |
Opera 3 |
Y |
Y |
Y |
Y |
Y |
Y |
P |
|
|
Y |
Y |
Icab 2.4pre |
Y |
Y |
Y |
Y |
|
|
|
|
|
Y |
Y |
Linux |
|||||||||||
Netscape 6 |
Y |
Y |
Y |
Y |
Y |
P |
Y |
Y |
P |
Y |
Y |
Mozilla |
Y |
Y |
Y |
Y |
Y |
P |
Y |
Y |
P |
Y |
Y |
Navigator 4.74 |
Y |
Y |
Y |
Y |
Y |
P |
P |
P |
|
|
Y |
Amaya |
Y |
Y |
Y |
|
Y |
Y |
|
|
|
|
|
Opera 5 |
Y |
Y |
Y |
Y |
Y |
P |
Y |
P |
P |
Y |
Y |
Opera 3 |
Y |
Y |
Y |
Y |
Y |
|
|
|
|
|
Y |
UNIX |
|||||||||||
Explorer 5.0 |
Y |
Y |
Y |
Y |
P |
P |
P |
P |
|
Y |
P |
Navigator 6 |
Y |
Y |
Y |
Y |
Y |
P |
Y |
Y |
P |
Y |
Y |
Navigator 4.7 |
Y |
Y |
Y |
Y |
Y |
P |
|
P |
|
|
Y |
Key: Support for a technology is denoted by a letter Y. Partial support is denoted by a letter P.
Source: http://www.qodox.com/browser/, March 10, 2002.