msie icon

Lamentations for Microsoft Internet Explorer

Browser compatibility is the bane of any web developer's work. Just ask us! My web design work is relatively simple, yet I am still plagued by hours of testing, tweaking, kludging my code, just to get it to look correct in every browser.

Web standards groups such as W3C and Mozilla have done a fantastic job of laying out specifications for a variety of flavors of HTML, CSS, Javascript, etc. Sticking to the strict standards, a page will generally look correct in all browsers except one... Microsoft Internet Explorer (MSIE).

Naturally, the most popular browser (by far) would perform the poorest. 'Makes sense, right? Right??? Fortunately for Microsoft, they needn't concern themselves with web standards any longer, since in a sense, they define the standard. Whatever shortcomings persist in MSIE, web developers everywhere are forced to create MSIE-compatible pages or be out of work. Don't kid yourself about Microsoft's intentions; they are well aware that they don't have to make life easier for their users. Their marketshare creates a guaranteed sale.

This BoxModelHack is an illustrious example of the strain Microsoft places on web developers.

Known problems include:

I'm no doubt forgetting several hundred others at the moment of writing, but I will continue to add to the list (feel free to email me with any further suggestions). On the other hand, all apologies to Microsoft if any of the above problems become out of date.

Some five or ten years ago, I was a pretty big fan of MSIE. Page rendering was quick, location history was cached better, and I got tired of all the krunk that came along with Netscape; mail clients, etc. Microsoft had to produce a quality browser in order to gain near-universal acceptance as the default browser on our computers. They have not continued to improve MSIE simply because there is no competitive advantage in doing so. However, with some of the newer browsers that are available, like Opera and Firefox, there are some valid alternatives to the MSIE monopoly.

One of the largest hurdles, however, will be mainstream adoption of these alternative browsers. Many web users aren't truly aware of the differences in browsers, mostly because web developers are hard at work hiding these differences. Thus, it is the web developers that are in a position to truly influence the spectrum of browsers used by the common web surfer. The web browser should be a means of presenting information to the user, NOT a restriction upon what information can be presented!

My suggestion, and personal plan of attack, is as follows:

  1. Stop dedicating hours of time toward compatibility with specific browsers. Instead, stick to the strictest web standards, and let the browsers perform as they may. However, I personally make it a point to avoid specific problems with any of the browsers. For example, I could routinely use transparent PNG graphics on all my pages, but for the moment I am content to use a more standard format like JPG or GIF.
  2. Tell the users when their browser is going to impair their viewing of the web. I have written a few segments of HTML 4.01/CSS 2.1/Javascript standards-compliant code, which I will describe below. This code is a way of sharply bringing the browser issue to the attention of the user, in the form of a "popup window" (actually a floating div element, to fool popup blockers). Whenever I find that pages I have written are suffering from sub-standard parsing in a particular browser, I tell the user, rather than remove content that I feel is important.

There are two simple segments of code needed to add the MSIE warning to your own page. First, the following reference to the javascript document that will check the browser version and display the mock window:

<script src="http://dtcurrie.net/msie.js" type="text/javascript"/>
			

View the javascript itself here.

The second piece is to have this all activated as the page is loaded. Just add the "onload" attribute to your <body> element:

<body onload="checkBrowser();">

The result is the following, a simple mock window that only marginally obstructs the user, yet is quite clear and grabs his attention. Furthermore, it is noteworthy that this mock window requires no image resources, and will thus not add significant load time to your pages. All that is needed is about 20 lines of HTML/CSS/Javascript. An example of the MSIE notification, implemented:

msie notification screenshot

Many might consider that they would be shooting themselves in the foot if they were to make their site less popular among MSIE users. This may be true for some, but it is likely that development will get easier as more users turn away from MSIE. I hope that web developers everywhere will join me in taking a jab at Microsoft; let their users know that the most popular browser in the world is unacceptable in the 21st century!

top

Valid HTML 4.01! w3c css validator made on a mac
Page layout and design © Daniel Todd Currie 2006-IV-09