Since the early days of the Internet, one of the problems that has plagued web developers is compatibility: a website that displays perfectly on one browser may be full of errors on another. Compatibility errors may include fonts displaying slightly differently, pieces of code displaying when they should be hidden, extra white space, images showing up in the wrong place, or even website errors that cause the browser to crash. The World Wide Web Consortium (W3C) was formed way back in 1994 to establish coding standards, and has been urging browsers to become standards-compliant ever since—an uphill battle.

These days, compatibility issues tend to fall into three categories: cross-browser, different versions of a browser, and mobile vs. desktop.

Cross-Browser Compatibility

With the more recent proliferation of web browsers, browser compatibility has become an even more important issue. According to Ars Technica, as of October 2011, Internet Explorer has a 49.59% market share, Firefox has 21.20%, Google Chrome has 16.60% and Safari has 8.72%, with various smaller browsers rounding out the rest. Designing a website that looks the same across all of those browsers can be challenging.

The simplest way to determine whether your website is working across various browsers is to run a cross-browser compatibility check. Browsershots is a free service that takes screen shots of a desired URL from multiple versions of several browsers. Adobe BrowserLab allows side-by-side or layered browser views to easily identify inconsistencies.

Compatibility Across Versions

All of the major browsers have been increasing their standards compliance with each new version released; the newest versions of Internet Explorer, Firefox, Chrome and Safari have all passed the Acid3 Test, widely considered to be the gold standard of compatibility.

Unfortunately, many people don’t bother to update their browsers very often. This is not a terribly large problem for Firefox, Chrome or Safari users, since even older versions of those browsers are fairly standards-compliant, and users of these browsers tend to update pretty frequently.

The issue is mostly with Internet Explorer. Although versions 8 and 9 of IE are fairly good in terms of compatibility, earlier versions were notoriously incompliant with browser standards, and 25.4% of IE users are still on versions 6 and 7 (that’s 13.38% of total desktop users).

The benefit of ensuring compatibility among antiquated versions of any browser is largely dependent on the online search prowess of your target market. However, it is worthwhile to note that a gap will always exist between advances in browser technology and consumer adoption. One way to bridge this gap is to include browser update links on your website while informing visitors of its version compatibility.

Mobile Browsing vs. Desktop Browsing

Morgan Stanley estimates that mobile web browsing will overtake desktop browsing by 2015. As more and more people buy smartphones, the mobile browsing experience is becoming a very important consideration for web designers. We have already noted the importance of having a mobile website to enhance user experience, improve SEO and drive sales. Another good reason to have a mobile website is to eliminate browser compatibility errors.

One of the most noticeable browser errors on mobile devices is that Adobe Flash videos will not work on iPhones or iPads. Apple purposely set out to eliminate Flash in favor of HTML5—“Flash is a spaghetti-ball piece of technology that has lousy performance and really bad security problems,” Steve Jobs told biographer Walter Isaacson—and it seems to be working; Adobe recently decided to stop developing Flash for mobile platforms.

In the meantime, many websites have Flash videos that don’t work on iPhone, iPad, and iPod Touch devices. Considering that 54.65% of mobile web use originates from Apple iOS products, making sure your website works well on Apple mobile devices is a good idea.

Zen Den is available to help you identify and fix browser compatibility issues. If you want to make sure your website looks great to everyone who visits, contact us for a consultation.