Category: ECMAScript

For many web developers, browser sniffing has become almost routine. Have you ever noticed that short list of “supported web browsers”?

While browser sniffing may seem like a good idea at first, you may be setting yourself up for problems later.

The biggest problem with browser sniffing is that it is usually relied on far too heavily to even consider removing later. The inner workings of a site can be based (unknowingly sometimes) around working specifically for specified web browsers and nothing more.

One poor use of browser sniffing that I came across today was for EyeWearSelect.com and it just so happens to be an easy fix.

On one of the EyeWearSelect pages, they show a thumbnail preview of a pair of glasses. Below the image is a link entitled “Click to Enlarge”, which uses some javascript to show you a larger picture in a pop-up window. Here’s how they begin the pop-up script..

if (parseInt(navigator.appVersion.charAt(0))>=4){
var isNN=(navigator.appName=="Netscape")?1:0;
var isIE=(navigator.appName.indexOf("Microsoft")!=-1)?1:0;}

Basically, the script says…true or false…this is Netscape? Also, true or false…this is Microsoft (Internet Explorer)? ..but what if you’re not using Netscape or Internet Explorer? What if you’re using Opera? or Konqueror?

If you’re using a browser that doesn’t match Netscape or Internet Explorer, then the future checks for isNN and isIE will never match and your browser will be “incompatible” with the scripts. In this case, the incompatibility is that the author never made it possible for those that are compatible.

A simple fix for this would be to change that bit of code to the following, which would basically check for Internet Explorer and then treat all others differently..

if (parseInt(navigator.appVersion.charAt(0))>=4){
var isIE=(navigator.appName.indexOf("Microsoft")!=-1)?1:0;
var isNN=!isIE;}

They won’t always be this easy for developers to correct, but this script could actually be cleaned up much more than just that.

In most cases, browser sniffing isn’t needed. The more efficient method to follow is capability testing.

If your code requires a web browser with capabilities that others (or not all web browsers) have, then you can use browser sniffing which is a form of hard coding the compatible web browsers…or you can test the browser’s capabilities and see if the javascript that you need to use will be supported.

By using the second method, you make your script much friendlier to the future of both the web and it’s browsers. You will also save yourself some work by not having to update the script each time you want to support another browser that would already be capable of using your script if it weren’t blocked in the first place. 😉

If you run compatibility tests and find that a certain feature will not be available, that’s the time to announce that the user should update their browser or use a different one all together.

Of all of the times that I’ve seen browser sniffing, only a couple have every been properly used. One of those was a browser sniffer that would display instructions and images explaining how to download and save a file to your computer. The images were of course specific to the browser that I was using for a more useful set of instructions.

If you should happen to come across a web site that suggests that your browser is not compatible, fire off an email and let them know that you would appreciate more accurate scripting and detection for your web browser let them know that you would appreciate more accurate scripting!