Call Today

Mon – Fri, 8am to 5pm

Build Consistent Websites For Everyone

by | Jul 25, 2012 | Articles, CSS3, Tutorials, Web Design | 0 comments

Build Consistent Websites

Build Consistent Websites For Everyone

I have been reading some high-impact articles lately about web design, set backs, and our limitations when designing for the web, especially on how to build consistent websites across all browsers. I have heard both sides of the argument, and I have come up with a practical solution that makes sense to most people. Not heard what all the trouble is over? Here is a brief explanation of what the debate is all about.

The Debacle

Many web designers and developers feel that certain browsers hold us back in development. We try and try and try to build consistent websites for all of our users across all browsers, but the truth is, that this is extremely hard to achieve. We design our sites to look beautiful in Firefox, Safari and Chrome, but when it is all said and done, it breaks in Internet Explorer, or older versions of browsers just can’t display what we have coded correctly, or even how we intended it to be rendered. This has been an issue for a long time, and I am as big of an advocate as anyone for all browsers to be compliant and consistent. That may be something that happens down the road, but for now we have to deal with browsers interpreting things differently. If you are wondering what features work in which browsers, you can view different charts here.

The Debate

The big debate comes from the how to handle the situation. Some designers say that we should forget browsers that aren’t compliant, and that the users that use those browsers will either have to upgrade or choose a different browser. Others say that we should only use effects that render the same in all browsers. The idea is that if a feature doesn’t work in every browser, not to use it at all and approach your design in a different way.

Why Does it Matter?

The problem with leaving browsers out is fairly obvious. If you only design for the latest browsers, then the older ones are left out in the cold. I hate to burst your bubble, but not everyone updates and upgrades their browser at the drop of a hat. The honest truth is that most people don’t care what browser they are using as long as it works well and that it is fast.

On the other hand, the problem with only using styles or properties that are consistent within all browsers is that you end up limiting yourself to what you can do. You essentially are stifling your creativity and killing your business. Also, this is a pretty hard route to follow, because certain browsers still render things unexpectedly. For example, if you don’t specify for images to have no border, most browsers, such as Firefox and Chrome won’t display one, but if you don’t specify that your images don’t have borders, some older browsers will show a blue border around all of your images.

A Practical Solution

So what do we do? It sounds like we are stuck between a rock and a hard place, but I have a simple solution that is actually a practical approach to designing for the web. Start out building your designs to look consistent across modern browsers first, such as Chrome, Firefox, and Safari, and then go back and code workarounds for effects that don’t display properly in older browsers or ones that have trouble displaying things consistently like the three that I mentioned. This will ensure that we build consistent websites for our clients. Notice I said consistent, but not identical. Most features work across all of the modern browsers, but not exactly the same. Sometimes we have to specify certain CSS for specific browsers. That is okay, because that is part of our job. It just comes with the territory. It can make it harder for newcomers to learn, but that is just part of the fun of learning web design and development.

The reason I am recommending this approach is that we can still have our creativity and look beautiful on the most modern browsers, and then we can go back and at least make them look great. They may not have the same illustrious features as the modern browsers do, but at least they will all work and look good. We will still be able to build consistent websites, just some features won’t display in older browsers.

No Excuses

A lot of designers and developers are saying “but I don’t want to have to code for inconsistency. I want everything to look the same no matter what OS or browser that they are using.” I don’t know where you’ve been r what fantasy land you came from, but you have no control over how any of these browsers are built, and you have no control over what browses your viewers are using. The best you can do is work with what you have. There is no excuse for not supporting a browser. True, it might not look exactly the same or display the pristine, shiny new effects that you wanted it to, but at least they can view the content and get the information that they need. That is the whole point in the first place. Organize the content, make is user-friendly, and fairly consistent to as many people as you can.

Don’t Forget Your Purpose

Many web designers and developers have lost sight of what the mission and the overall goal is. They want their job to be easy, so they can simply code and be done. It just doesn’t work that way. You will always have to test across different browsers and implement workarounds for certain ones, such as Internet Explorer. IE 9 has done a great job of catching up, and is leaps and bounds over 8, 7, and 6, but they still have a long way to go. It is our job to bridge the gap for the time being, and make the web as enjoyable for everyone as possible, and to make our clients’ sites look as good as we can, as consistently as we can, across the many platforms that are available. Our main goal is to build consistent websites for everyone.

Divi WordPress Theme