What is Cross-Browser Compatibility and Why Does it Matter?

Frequently Used Browsers

Cross-browser compatibility is a fancy way of saying that your website should look and function well across the major browsers – Chrome, Firefox, Safari, Internet Explorer and more.

Better browsers, better web design techniques

Web browsers have improved quite a bit over the last 10 years, and as a result, so have the techniques available to web designers to create beautiful modern designs. We can now easily employ rounded corners, shadows, gradients, or custom fonts in our designs using HTML5 and CSS3. This is both an opportunity and a challenge. It is now more important than ever to understand how your website displays across the wide spectrum of browsers available.

Wait, aren’t all browsers the same?

Heck no!

When we design a website, we convert the Photoshop file into a web ready format by ‘coding’ it. Browsers read and render this code slightly (or very) differently from each other.  Some, usually older, browser versions don’t support those same technologies that allow us to create modern designs on newer browsers.  As a result, a site visitor may have a different experience depending on the browser and version they are using. This means we not only need need to consider the devices our customers are using, but also the browsers.

Progressive Enhancement

‘What about ancient browsers?’, you ask. Happily, we can now detect which version of a browser the user is viewing your website in, and serve up the styles that are accessible for that browser. This means that we can create a modified experience for browsers that can’t handle the latest CSS3 features, and the user won’t know they’re missing anything. This process is called ‘progressive enhancement’ and it essentially means that you create a basic version of the website with all essential content/functionality, and then enhance it for modern browsers/devices. There are some limitations and some of the latest features are still experimental, but that shouldn’t stop us from enhancing the experience for those users on modern browsers.

Does your site need to be cross-browser compatible?

It’s possible, through intelligent coding, to accommodate very old browsers such as Microsoft Internet Explorer 6 (over 10 years old) all the way to modern browsers such as IE 11 or Google Chrome.

Whether you choose to do extensive cross-browser compatibility adjustments depends in part on who is viewing your site and how important they are to your business. A look at your Google Analytics will tell you what browsers your customers are using.  Next, test your website aesthetics and performance in those browsers to ensure all works well. If you are concerned about the way the site is displaying or functioning, then it’s a good time to consult with a web professional to create an accessibility strategy for less advanced browsers.

story written by Todd Baylis