Should Internet Explorer 6 (IE6) be supported?
Despite the fact that most developers think that the only reason why I would want to support IE6 is to torture them, the fact is that IE6 is still widely used. It is true that consumers should upgrade to a newer browser for a number of reasons, but analysis of my clients’ websites still consistently shows a need to support IE6.
I have found that testing websites for IE6 compatibility is a bit of a pain because IE6 is not designed to run on a machine that is running IE8. In the past, I’ve typically been able to get an additional, older computer that was running IE6 for testing purposes. However, I’m finding that it’s more difficult for me to find an IE6 machine than it used to be.
Fortunately, I have found 2 free tools that Microsoft provides to make testing websites on IE6 easier: Microsoft Expression SuperPreview and the Internet Explorer Application Compatibility VPC Image. In this post, I’ll write about SuperPreview, and I’ll cover the VPC image in a future post.
What is Microsoft Expression Web SuperPreview for Windows Internet Explorer?
Microsoft’s brief description of this free tool is:
Expression Web SuperPreview for Internet Explorer is a visual debugging tool that makes it easier to migrate your web sites from Internet Explorer 6 to Internet Explorer 7 or 8.
Clearly, Microsoft is focusing on how the tool helps you bring old web sites into the future (or into the present). However, I found that it’s also a good tool for testing and debugging how a new site works in IE6.
I have not yet had the opportunity to use the tool on a project, but I did download it and try it out.
The free download is available here. The download and install were very straight-forward. When I first opened the application, it was very clear how to compare a website on IE6 to one on IE8. Here is the screenshot:
Of course, the first site that I had to try was my own company’s website. It takes a little time for the pages to render after typing in the website address and pressing enter. It turns out that Catapult’s site is not rendered well on IE6. The main image is pushed below content that is on the right hand side of the page. This is a problem that I have seen on many sites during compatibility testing.
It’s very easy to identify problems with how a page renders between IE6 and IE8. You can scroll around the page using either set of scrollbars, and both images move in sync. In addition, if you hover over an object in one image, you can see the corresponding area outlined in the other image. In fact, if you click the "DOM" tag in the bottom right and click on the object, you see additional information about the object, which is useful for debugging.
I also noticed that there’s a feature called "Browser Size" in the lower right hand corner. This should be very useful for testing and debugging. Invariably, websites seem to be built on machines with very high resolution, which seems to be the preferred resolution for developers and designers. However, the folks doing User Acceptance Testing (UAT) often end up with very low resolution and complain that the site looks terrible. This feature should help developers see what the users are seeing without needed to change the resolution of their monitor.
The tool also allows you to zoom in or out and has several modes for viewing the screen renderings including "Overlay Layout". (Did I mention that this tool is free?)
Drawbacks to SuperPreview
Although Microsoft Expressions Web SuperPreview is very useful, it does not allow for full browser compatibility testing. The forms are non-functional renderings of the pages. So, even though the tool is great for identifying and debugging static, visual problems, it cannot be used to test anything dynamic. This includes the functionality of login screens, forms that collect data, dropdown fields, or anything else interactive. Because of this, it also cannot be used to test any pages that require a login for access. Of course, you can still use SuperPreview to test those pages in a development environment, which is great for debugging and finding bugs early. However, those pages will be more difficult to test for a tester who typically is not viewing pages in a development environment.
If you get a paid version of Microsoft Expressions Web SuperPreview, you can add Mozilla Firefox 3.6, Mozilla Firefox 3.5, and Mozilla Firefox 3.0 to the list of browsers available for comparison. In addition, there is currently a SuperPreview Online Service Beta that supports IE9 Beta and Safari 5 for Mac. It looks like there are a lot of other cool features available in the paid version. However, that’s beyond the scope of the free IE6 testing tool that I was looking for.
Other Tools for Testing Browser Compatibility?
I’d like to know if you have found any additional ways of testing your website in IE6 or any other browser. The two solutions that I’ve found from Microsoft should help, but I still haven’t found a really good way to test Safari on Mac short of having a physical Mac computer with Safari. This is often not practical. I look forward to hearing about your experiences.