I've been working for a marketing Agency for the best part of a year now, and one of the things that always rear's its head in a digital project is the compatibility of designs in multiple browsers.
We have all encountered differences in design compatibility and functionality due to the browser vendor and version number, but the usual course of action is try and code solutions that address the differences in browsers in an effort to make them look and work in the same way.
This article examines why that is the case, and I put forward the argument that by doing this you are spending valuable project time trying to ensure the same user experience on different browsers, when it may be a much better idea to use that same development time coding to the strengths of each of those browsers, to create a more rich user experience instead of a more generic one.
Most of us have at some point been in the position of finishing a project, only to look at it in a couple of different browsers and notice that something isn't quite right. In some case elements are slightly out of alignment, in other more extreme cases elements have 'div dropped' out of place altogether.
This is mainly due to how different browsers interpret the DOM, and how they interact with things like positioning, margins, padding and spacing in general. The historical trend here is to redevelop your CSS so that it works in the offending browser, or alternately add in comment tags to allow browser specific CSS files to essential force that browser into line.
<link rel="stylesheet"ie6.css" media="screen" />
Why do you want to make the experience the same in every browser?
Why downgrade users who DO have browsers capable of handling newer scripting languages that CAN deliver a 'Rich' experience. By omitting the newer richer features of modern browsers you are creating a weaker experience for everyone. Your policy of backwards compatibility is hamstringing the user experiences of people who can enjoy an all singling and dancing web experience.
Working in a Marketing Agency it is easy to see sometimes that clients view web design in the same way as leaflet and other types of hard-copy design. They have a vision of what they want something to look like, and they try as rigidly as possible to make it look exactly like their vision. A lot of clients simply cannot process the idea that you cannot guarantee how a user views your site. A favourite shock tactic of mine is to view their site in front of them, then turn off all style sheets and custom fonts. The look of horror on their faces is very telling, and it gets across the point very well.
Don't create a rigid site design – create a fluid user experience
Rather than spending time redesigning your site to fit around older browsers (it is mainly older browsers that are the issue) why not spend that time enhancing the 'Rich' features of the newer browsers? Rather than trying to create exactly the same experience in every possible browser, why not play to the strengths of the compliant browsers. Maximise the user experiences that 'Rich' enabled visitors can have, rather than enforcing a lower grade experience for everyone. Remember what you are creating is a uniquely interactive experience for each visitor, not a simple viewing of a rigid paper design, but online.
Its controversial broaching subjects like this with clients and it can take quite a bit of persuasion to make them see things differently sometimes. I'm sure that if you can make them see that 'lowest common denominator' development is a very backwards way of thinking, and you are very unlikely to ever deliver a project with any WOW factor, they can be swayed.