Below is a sample of a code snippet I’ve used in different forms to achieve a better website experience for more visitors.  When I have time, I try to unlock more and improve more, after using Google Analytics to see what segment of visitors deserve more attention.  You need to  prioritize, but when so many visitors are on iPhones and iPads, you really need to test your website on Safari on those devices.  Often, Chrome and Safari seem to agree a lot when it comes to displaying web pages, but sometimes you need to fix those few differences — often the most important things like navigation buttons or your header logo will look displaced, or worse, not even show up.

You may find you need to just clear a div after others have floats, you may find you need to delve deeper and isolate IE 9 or Chrome for certain issues, both with CSS, content, OR behavioral code (like JavaScript or JQuery.)

Here is an example of a simple “browser sniffer” script in JavaScript.  Of course, you would replace the “alert” commands and put your real action based on the conditions, but it should be enough to get you started.

<script type="text/javascript">

var browserInfo = navigator.userAgent.toLowerCase();

if (browserInfo.indexOf(‘safari’) != -1) {

if (browserInfo.indexOf(‘chrome’) > -1) {       alert(“Chrome″);     } else {       alert(“Safari″);     }

}

</script>

Since web browsers are different, shouldn’t you expect your website will look different on different browsers?

Yes.  Safari will often show your beloved gradients you put on your website upside down.  Don’t worry, it’s not you.  It’s happened to plenty of people and there are plenty of explanations like “Safari doesn’t understand gradient angles in CSS.”  But Internet Explorer 10, FireFox and Chrome does?  Yes, it will happen to you, I’m sure you’ve discovered that it is IMPOSSIBLE that your website will display exactly the same in every browser in the world on every different computer system.

Some reasons are really good and the flexible and proactive (sometimes reactive) browser market has also empowered web users to allow them to have access to tools to improve their web experience.  The reasoning goes, just like you can’t make sure your website visitors don’t wear glasses, you should be happy those who need to wear glasses are wearing them so they can actually read and appreciate your website.  The same goes for browsers and their openness to user customization.  Many people with poor eyesight will zoom your text out.  What about those who can’t see?  There are accessibility tools to help the blind use the web and these are all good things.

So, it’s challenging to keep up with all the new browsers and CSS3, HTML5, ICANN standards, and it will continue to become more complex.  Things will accelerate, so be happy that we’re all using the web and have tools available that will allow us to improve not only visitors to our website and their experience, but our own experiences on the web.  It’s a good thing Google, Bing and Yahoo are always trying to improve their search results for us, it’s evolution of something that still has so much more potential to unleash.  Also, it’s not easy, so some people won’t have the stomach or the attention to detail, this is a growing niche market as a web developer.  Don’t under value the need to fill a niche in a world where everyone’s jumping in!