Design System

British Columbia Government Design System for Digital Services

Last Updated: September 8, 2021

Designing for Different Browsers and Devices

Not all browsers will render web pages in the same way. There are often visible differences in the ways that different browsers handle technologies like CSS, HTML and JavaScript.

Services don’t have to look perfect in every browser, but they should always be accessible. Users must be able to access and use all the information and features they need, regardless of which browser they use, to a reasonable degree.

Compatibility Testing

Test that your service works in the browsers used by your intended audience.

These lists represent usage statistics from for non-government users. These statistics represents about 98% of users.

Browser% of UsersYearly Change (%)
IE 115.6-3.3
Operating system% of UsersYearly Change (%)
Mac OS X12.5+10.4

Usage statistics for one-year April 2, 2019 to April 2, 2020

Building services that government workers use

There are many internal government users still using IE 7 and other legacy browsers or operating systems.

If internal government workers are your key users rather than the general public, make sure you understand their browsers and operating systems. Look at your analytics data and check which browsers and operating systems your users are using.

Design for your audience

When designing your service, you should analyse your users’ choice of:

  • operating systems
  • browsers
  • browser versions
  • screen size/resolutions
  • choice of mobile device

If evidence shows that your users have specific needs or extra support requirements, you should design for these needs.

Adapt to changing behaviour: do user research and monitor analytics

Decisions about compatibility can’t be something you specify at the start of your project and then forget about. Digital services need to reflect and adapt to the changing digital behaviour of their users.

Do this by researching your users and checking statistics on a regular basis.

New products and platforms might not appear in any data, but it makes sense for you to test against them if they’re likely to be popular. For example, 1,007 users accessed using their Sony PlayStation.

You also have to work out when to stop supporting a product or system if its popularity is declining.

Inform users of unsupported browsers

If your website or application doesn’t support IE, you can create a page telling users their browser is no longer supported. Below is some content and graphics that you can use for that page.

(H1) Hmm…looks like your browser isn’t supported

(Paragraph text) You seem to be using an unsupported browser.

To get the best experience using our site, download the latest version of any of the following browsers:

  • Google Chrome
  • Mozilla Firefox
  • Microsoft Edge
  • Apple Safari


  • Create an Issue

Design System

  • home
  • disclaimer
  • privacy
  • accessibility
  • copyright
  • contact us
  • Government Of BC