Achieving Browser Neutrality

In today’s segmented browser market, achieving a unified look across platforms is as complicated as ever.

What does it mean to be “Browser Neutral”?

Browser Neutrality is the term used to describe a website or web application that looks and acts the same when viewed in any web browser.

Internet Explorer. Firefox. Chrome. Safari. Opera. With so many choices in the web browsers, the market has become segmented. No single web browser currently owns more than a 25% market share.

As a web developer, it is important to make sure your website or application is consistent regardless of the platform on which the user is viewing it. This poses a significant technical challenge.

Diagnosing Problems

How do we know if our webpage is going to look the way we want in all browsers? There is only one sure fire way to find out – testing, testing, testing!

Developers should test code across a number of different browsers fairly often during the development cycle. Waiting until development is done is often a huge mistake. Often a developer will work on web content, testing in only a single browser as they go. Then, when they have finished, they load up the website in a different browser only to find inconsistencies. At this point, fixing those problems can require reworking pieces of code that could have been done differently from the start had the differences been noticed sooner.

In this way, browser neutrality is similar to other programming problems such as software bugs and misunderstood requirements – early diagnosis is the key to saving time and effort later on.

We found problems! What now?

Although there is a set of standards that browsers attempt to adhere to, implementations often differ and sometimes there are quirks. This is particularly true when dealing with CSS (Cascading Style Sheets). CSS is used to stylize a web page through the use of reusable “style classes”. These classes contain a number of properties which describe how a particular element should look in the web browser. Occasionally, browsers will differ in their presentation of these properties. For example, there are often differences in padding and margin properties across different browsers.

But fear not. There are steps developers can take to assure that these differing implementations still present a unified user experience across all browsers. Options include using multiple style sheets to account for different browsers or using browser-specific tokens in style classes themselves to have certain properties target only a specific browser.

Who cares if it looks different!

Achieving browser neutrality is not a primary goal of every website or web application.

At development onset, it is important to set the expectations for the project. If a unified look, down to the pixel, is important, developers need to keep that in mind from the start and test often, particularly for pages with complex graphical details. Other times, minor differences in look and feel may not be an issue because all users will be using a specific browser (often the case in a corporate setting) or the function of the application, not the form, is the primary concern.

Statistics on Browser market share can be found at the following links:
https://marketshare.hitslink.com/browser-market-share.aspx?qprid=2#
https://gs.statcounter.com/#browser_version-ww-monthly-200904-201005