How much browser support matters? When should we care?

Probably we do care about browser support more than we could think of sometimes. In all applications and websites that we build it is an essential factor without a doubt.

In my opinion there are seperate sections that we should care about browser support: Development and Production.

browsers in one shot

Development phase

Surely there are projects that we work on as a demo or just in case of creating a portfolio or to simple tests. They never go to production and deployment.

Therefor this is a perfect place to try every new skills that we want to check out. For example the most important ones are grid system and CSS variables or custom properties. Also focus-within property or new HTML elements like dialog. Browser support will not affect your application in this case.

Trying new things will not harm in any way and it will help to see how we possibly could build an application if we could use everything available in our palate. So the answer here is try everything and don’t worry about browser support at all.

Production phase

But what about production? My answer is it depends. There are variety of parameters you need to check and examine while building something for production. First and foremost are the target users.

Target users

All we do is about user experiences. Definitely we want then to have a great experience while using our app or browsing our website.

How much browser support needed?

Therefor we might think we need to only use well supported techniques and properties and elements. But I do not agree with that.

Having a good browser support is enough to make something ready to be used in production. Meaning there is no need for 100% support for everything which is not possible. In that case we are forced to stop coding forever.

I do believe that a good browser support means you should cover your target users first. Of course if you have to support IE9 because the organisation you are building the app for are using it then you should care about IE9. 

But if you need to have a good support then you need to well support major browsers in desktop and phone. How well? It depends on the type of your application and those properties or elements you need there.

Grid and FlexBox

As an example using FlexBox is a must these days. Bu it wasn’t a few years back as it wasn’t well supported. But now here is the support around 92% globally:

FlexBox in

But grid system does not have the same support. It has around 84% global support:

grid in

Does this mean we should not use it in production and  wait for 100% support?Absolutely not. Because it has a good support in all major browsers and that is well enough. And using it more and more will force other minor browsers to catch up supporting it. This is how a new technology evolves and grows. The more we use them the better they will be used and developed.

Therefor even in production we need to take some further steps and try out things that we have always wanted maybe with some backups.

For example while defining CSS variables we can define a duplicate at the same line just in case if the browser didn’t support it. But we should use CSS custom properties as they add huge benefits to out code.And the browsers will thank us for that at the end.

Thank you for reading.

© 2020
Azadeh Faramarzi

This site is created and maintined by Azadeh Faramarzi , A passionate developer, sport and code lover who loves to share and write when she has some time.