Cross Browser Compatibility

Today a web user has many ways in which to access the web. The most common way is through a desktop or laptop computer. There are currently three main operating systems competing for their share of the market, Windows, Mac OSX and Linux. There are many browsers manufacturers also competing, most of them producing their web browsing software for all three of the major operating systems. Each browser is regularly updated, and the vendors release new versions of their software, but not everone can always upgrade their software immediatley. This means that there are many combinations of operating system/browser and browser version, many of which handled the code with which websites are designed differently. This inevetibly leads to the web designers worst nightmare: cross browser compatibility.

Making a website look and work correctly in as many browsers as possible, is no small task. Many differantly configured computers must be used to test a website accross all of the operating system/browser and browser version combinations, and the majority of web designers do not have access to all these machines. Fortunately, the is a web service that solves these issues: BrowserCam. BrowserCam offers its members the ability to view screen shots of their websites in many operating system/browser and browser version combinations, eleminating the need to purchase many expensive computers, which is simply impossible for freelance web designers like myself. BrowserCam also offer the ability to remotely access these computers, allowing web designers to thouroughly test their websites across the entire range.

Listed below are the screen shots of this portfolio site in all the operating system/browser and browser version combinations that BrowserCam has to offer, organised by the style sheet they apply. All images supplied by BrowserCam, with a screen resolution 1024x768.

Please click on the images to enlarge them.
Please note: due to the resolution at which these images were captured, they are fairly large in dimension and filesize, and may be slow to appear.

Full Compatability

The following screen shots represent a range operating system/browser and browser version comibanations, all of which apply the main styles I have created with few or no defects.

Windows XP

Screenshot: Windows XP, Internet Exlorer 6.0

Operating System: Windows XP

Browser/Version: Internet Exlorer 6.0

Screenshot: Windows XP, Mozilla Firefox 1.0

Operating System: Windows XP

Browser/Version: Mozilla Firefox 1.0

Screenshot: Windows XP, Opera 7.0

Operating System: Windows XP

Browser/Version: Opera 7.0

Screenshot: Windows XP, Mozilla 1.7

Operating System: Windows XP

Browser/Version: Mozilla 1.7

Screenshot: Windows XP, Netscape 7.2

Operating System: Windows XP

Browser/Version: Netscape 7.2


Windows 2000

Screenshot: Windows 2000, Internet Exlorer 6.0

Operating System: Windows 2000

Browser/Version: Internet Exlorer 6.0

Screenshot: Windows 2000, Internet Exlorer 5.5

Operating System: Windows 2000

Browser/Version: Internet Exlorer 5.5

Screenshot: Windows 2000, Mozilla Firefox 1.0

Operating System: Windows 2000

Browser/Version: Mozilla Firefox 1.0

Screenshot: Windows 2000, AOL 9.0

Operating System: Windows 2000

Browser/Version: AOL 9.0

Screenshot: Windows 2000, Opera 7

Operating System: Windows 2000

Browser/Version: Opera 7

Screenshot: Windows 2000, Mozilla 1.7.5

Operating System: Windows 2000

Browser/Version: Mozilla 1.7.5

Screenshot: Windows 2000, Netscape 7.2

Operating System: Windows 2000

Browser/Version: Netscape 7.2

Screenshot: Windows 2000, Netscape 6.2

Operating System: Windows 2000

Browser/Version: Netscape 6.2


Mac OSX 10.3

Screenshot: Mac OSX 10.3, Mozilla 1.6

Operating System: Mac OSX 10.3

Browser/Version: Mozilla 1.6

Screenshot: Mac OSX 10.3, Mozilla 1.6

Operating System: Mac OSX 10.3

Browser/Version: Mozilla 1.6


Red Hat Linux 8.0

Screenshot: Red Hat Linux 8.0, Mozilla Firefox 1.0

Operating System: Red Hat Linux 8.0

Browser/Version: Mozilla Firefox 1.0

Screenshot: Red Hat Linux 8.0, Mozilla 1.7

Operating System: Red Hat Linux 8.0

Browser/Version: Mozilla 1.7

Screenshot: Red Hat Linux 8.0, Netscape 7.2

Operating System: Red Hat Linux 8.0

Browser/Version: Netscape 7.2


Safari

The Mac-only browser Safari has issues with some CSS properties, especially the 'height' property, and as such does not correctly apply the main Gridlight style. With an issue as important as this, I would have liked to have been able to force Safari to apply the Simple style sheet, but unfortunatly the methods by which the style sheets are selected do not work with Safari either, so the default Gridlight style is applied.

Screenshot: Mac OSX 10.3, Safari 1.2

Operating System: Mac OSX 10.3

Browser/Version: Safari 1.2


Opera 6

Unfortunately, Opera 6.x, on PC or Mac also has problems correctly applying all the CSS rules, and like Safari, above, the usual methods of telling the browser to apply an alternative, simple style sheet do not work, and as a result the site does not appear correctly when viewed in Opera 6.x browsers.

Screenshot: Mac 10.3, Opera 6.0

Operating System: Mac 10.3

Browser/Version: Opera 6.0


Reduced Compatability

The following screen shots indicate thise browsers that do not support enough CSS to faithfully render the full Gridlight style sheet, and therfore, through a process of filtering, the Simple style sheet is applied

Screenshot: Windows 2000, Internet Explorer 5.0

Operating System: Windows 2000

Browser/Version: Internet Explorer 5.0

Screenshot: Windows 2000, Netscape 4.78

Operating System: Windows 2000

Browser/Version: Netscape 4.78

Screenshot: Windows 98, Internet Explorer 4.0

Operating System: Windows 98

Browser/Version: Internet Explorer 4.0

Screenshot: Mac OSX 10.3

Operating System: Mac OSX 10.3

Browser/Version: Internet Explorer 5.2

Screenshot: Red Hat Linux 8.0, Konqueror 3.0.5

Operating System: Red Hat Linux 8.0

Browser/Version: Konqueror 3.0.5

Screenshot: Red Hat Linux 8.0, Netscape 4.8

Operating System: Red Hat Linux 8.0

Browser/Version: Netscape 4.8


Last Modified: January 23, 2009, 02:40 pm

You are viewing either a simplified version of the design of this website, or there is no design at all. This is because the browser you are using will not support all the CSS instructions that an up-to-date browser would. I recommend using a modern browser such as Mozilla Firefox to make the most out of the web.