Opera 10 Shows Why Browser Detection is Wrong
Published on December 20th, 2008 in Computer Software
The next version of Opera Software’s flagship desktop browser, Opera 10 Alpha 1, was released recently for testing by developers and other members of the public. Opera Software has a long and proud history of producing development versions of their products that are far superior in quality than many other software applications’ own betas (and in many cases finished products). Opera uses a three stage development cycle that along with its quality control and assurance process sets the company and its products apart from the competition. These three stages are:
- Alpha Release - test the browser engine (usually the equal of any well-polished beta)
- Beta Release - test new features (usually equal to most release-candidates if not final versions)
- Final Release - make the browser available for download only when ready
As with any software development process, there are bound to be bugs, issues, and other unforseen problems that need to be addressed before the final product is delivered. Opera Software is no exception, and Opera 10 Alpha 1 proves this right off the bat. You see, a lot of Web sites employ what is called a “browser detection” or “browser sniffing” script to identify your browser and only “let you in” if your browser matches a list of browsers and versions the script knows about. Web developers have been using this technique for over a decade now (even though it hasn’t been needed for at least eight years), and in this time they haven’t had to worry about double digit browser versions (they did however come close with Netscape Navigator 9, but that was the final version of that particular browser to be released and by that time nobody used Netscape anymore to begin with).
So what does this have to do with browser sniffing?
In the roughly 15 years the public Internet has existed, not a single Web professional has had to worry about how many digits a browser version has. Sound familiar? Well, if you remember the Y2K fiasco, then it probably does - and this time it should scare you. Unlike the FUD surrounding Y2K with doomsday scenarios that predicted airplanes and satellites falling out of the sky, nuclear reactors melting down in catastrophic failures that would make Chernobyl look like a non-event, and your life savings being wiped out in an instant if you didn’t close your bank accounts, cash in your stocks and max out your credit cards before midnight on December 31, 1999… you’ll simply be denied access to the Web sites you’re trying to visit. Instead of seeing the Web site you wanted to use (such as your email account or your bank’s Web site), you would end up staring at something like this:
(Note for those with images disabled or not supported: this is the text that appears in the “browser upgrade notice” image above.)
Upgrade your web browser
We recommend that you upgrade your Web browser so you can get the most out of Windows Live Hotmail. Upgrading should only take a few minutes. To get started, choose one of the browsers below:
- Microsoft Internet Explorer
- Mozilla Firefox
- Apple Safari
If you don’t want to upgrade right now you can still continue to Windows Live Hotmail, but some parts of it may not work and it may not be displayed properly.
Hey, where did the Web site go?
If you’re wondering what happened to the Hotmail site in theabove screen shot, it’s easy. Hotmail’s browser detection script saw a browser version it was unfamiliar with and told me I had to either “upgrade” or “get a better browser” in order to use the site. Of course, Microsoft was nice enough to allow me to continue using the site if I wanted, but I would be presented with a stripped down version that would probably not even work properly. No thanks, Bill Gates, I’ll pass - and you should too. (For the record, I was using Opera - a browser Microsoft has been known to block in the past.)
Now here’s the kicker. There is absolutely no reason why Opera should be unable to access or use Hotmail.com - its support for industry standards and best practices is years ahead of anything Microsoft Internet Explorer has and is even on par with (if not superior to) Mozilla Firefox and Apple Safari in many respects. Yet Firefox runs perfectly fine, as do both Internet Explorer and Safari. Talk about a real head scratcher (in the interest of fairness I will forgo the usual “geek politics” this one time).
Why did this happen in the first place?
As respected Web developers Andrew Gregory and Hallvord Steen recently noted, browser detection and sniffing scripts only use one digit when looking up your browser’s version number. Any browser with a version number of 10.0 or higher will be incorrectly labeled as version 1.0 - not only will the script then block you from accessing the site but also demand that you either upgrade or switch to what the site developer(s) consider to be “a better browser” (they usually recommend Firefox - look for the affiliate link at the bottom of your browser when you point your mouse cursor over the link to see why; yeah, they’re suggesting it because they’re obviously paid for each click).
Unless you’re running an older version (such as Internet Explorer 6 or Firefox 1.3), chances are you won’t have to “upgrade” or “get a better browser” in order to use your favorite Web sites as long as the Web developer(s) responsible for the Web site know how to build a Web site the right way (and judging from the fact that 90% of Web sites aren’t built to current industry standards in the first place, it’d be safe to say that many in fact do not).
Opera 10 proves this. Fortunately this issue was discovered early during the development and testing cycle, and many Web professionals will spend their time updating their browser detection scripts to patch the problem before forgetting about it like they tend to do. Thinking that “the problem has been solved” they’ll go back to maintaining and developing Web sites using the obsolete techniques they should have abandoned nearly a decade ago instead of learning how to build Web sites the right way. And you will be among the first to suffer for it.
Browser Detection is Not Only Wrong, but Stupid.
If I didn’t know any better, I’d say many Web designers and developers have a burr up their backsides about which browsers to support. I do know, however, that they choose to support either two or three browsers - Internet Explorer, Firefox, and maybe (sometimes) Safari. The problem with that is there are more than two or three browsers for people to choose from. In fact, there are literally hundreds of them; it’s no wonder that Web professionals feel overwhelmed when it comes to choosing which browsers to support.
The good news is that almost all of these browsers run on four major layout, or “rendering” engines; a core component of each browser that is responsible for laying out Web pages on the screen. They are, in no particular order:
- Trident (Internet Explorer only - proprietary)
- Gecko (Netscape, Firefox, Flock, Galeon, and others - open source)
- Presto (Opera and some mobile browsers based on Opera - proprietary)
- WebKit (Safari, Chrome, and others, soon to be joined by Epiphany - open source)
There are other layout engines, but I’m not going to list them since the browsers that use them have such a small user base (usually a fraction of a single percent each) that they’re not worth considering.
And this means what, exactly?
The point I’m trying to make is it’s not only unnecessary for a Web site to identify what browser you are using before “letting you in” but it shouldn’t have to lecture you on which one to use if your browser doesn’t match any of the ones on its “invitation list”. The modern Web is built upon a platform of accessibility for everyone and inter-operability with any device. If you think I’m crazy or stupid, let me put it to you this way. It should not matter if you use Internet Explorer, Firefox, Flock, Opera, Safari, Chrome, the browser on your Blackberry, PDA or cell phone - or even your TV or Nintendo Wii - to go online; you deserve to be able to access and use your favorite Web sites without any hassle or fuss whatsoever.
So if Web sites shouldn’t detect browsers, then what should they do?
Instead of detecting browsers, Web sites should detect features. Feature detection has been around for years and is also guaranteed not to break when a new browser or browser version is introduced. It’s also very easy - if a browser supports a particular feature, then the site should let the browser use it. If it doesn’t, then give the browser something it can handle while still being usable. There have been entire books written on the subject, so I won’t go into them here. That and books tend to get stale after a year or two, so it would be wrong for me to recommend a book that will be obsolete in 12-24 months anyway.
If you’re a Web designer or developer…
Web professionals should also learn how to build Web sites the right way so they work anywhere without any complications. Rather than focusing on testing and supporting two or three browsers, we (as members of what I am proud to consider one of the best industries to ever work in) should instead focus on the four layout engines outlined above, and choose minimum versions of each engine’s main browser to support. For me, that is Internet Explorer 5.01 (hey, I like to brag, but to be fair, IE 6 is a better target), Firefox 2, Opera 9, and Safari 3. Get those squared away and in almost all cases, the other browsers that use the four engines will look and behave the same way.
We should also learn how to code our Web sites using the least amount of code possible while separating our HTML (or XHTML), CSS, and JavaScript from each other. As the old saying goes, the less code that you use, the less there is to break. We should also validate the code we use and ensure that the Web sites we make work properly across all four of the major layout engines. The best way to do this is not to test in one browser (usually Firefox) and hack in Internet Explorer, but to test in each browser as we go along section by section and feature by feature. By doing this we will be debugging as we work, instead of waiting until the end and possibly having to start over from scratch because we missed a bug early on that could easily have been identified, isolated, and corrected. This will not only save us time and frustration, but will also save our clients a significant amount of money while delivering a far superior product than what we would otherwise be creating.
Speaking of quality, three other key areas we should endeavour to concentrate on are accessibility, information architecture and usability. Making our Web sites more accessible to everyone (and not just those with disabilities) and easier to use will allow the people to (legitimately) use our Web sites any way they want from anywhere they want without any problems whatsoever. I don’t think I need to tell you this can result in higher conversions, sales and advertising payouts for us and our clients - I’m pretty sure you already know that.
If you’re looking to hire a Web designer or developer…
Companies, organizations and individuals looking to hire a Web professional need to look for the same qualifications and skills I outlined above. It’s that easy. If a Web professional is creating Web sites using nothing but nested layout tables, embedded style sheets and JavaScript code, or otherwise choosing to support one or two browsers while griping about Internet Explorer (or worse, supporting Internet Explorer while complaining about the other browsers), doesn’t care about making Web sites that everyone can use and is only interested in getting as much money transferred from your bank account to theirs, then thank the individual or agency for their time and show them the door.
And if you’re currently stuck with one of these old-school developers, I strongly recommend you start looking for someone to replace or (preferably) retrain them. I won’t “toot my own horn” here (that’s not the purpose of this article), but if you really want to talk to me privately about this, you can contact me right here.
- Previous Post: A Bohemian Christmas Rhapsody Video
- Next Post: What are YOUR 2009 New Years’ Resolutions?
December 20th, 2008 10:38 PM
Hi Dan, thanks for the interesting read, as a late-comer to this industry I am totally appalled at the lack of adherence to a common format or set of rules, and struggle to accept the belligerence of major players. Yes, there seems to be a W3C guideline but why does Microsoft seem to ignore it?
Let me first say that I am no developer, potentially a great designer but my memory isn’t good enough for me to ever be a good coder, but as I understand the situation, if the web development community had one set of design rules life would be a breeze for us all.
Maybe I’m biased toward Apple as that is the system I have chosen to use but it appears to me that while Microsoft had well over 90% of the Browser Market they attempted to create a monopoly by having web-site customers demand that developers ignore the W3C recommendations in favour of pandering to IE’s whims. Then came Firefox.
My previous work experience involved working in group environments where we would all say “No” to any employer who tried to force us to work against our principles. This ethic has largely disappeared recently, where we all seem grovel for our money and do exactly as we’re told.
Long live civil disobedience and pity help the world if we have slipped so far down the incline of blind acceptance. We could decide on a day, perhaps an anniversary of the day the web was born, to disable browser hacks, down tools and publicly denounce non-compliant browsers. Force the big players to fall into line and give the web back to the people.
Why Dan, should we pander to the whims and fancies of arrogant corporations if it means doing so much extra work and forcing costs on to the end users. Why can’t we expect the corporations to work to an agreed set of rules.
In my ignorance I have decided to quote one price for web-site developed to conform to W3C recommendations, and extra charges apply if I have to mess around with hacks to get the site to display correctly in non-compliant browsers. Most clients are shocked that it is IE that presents the most problems.
I hope not to sound arrogant as new-comers can often see things in an over-simplified way, but to me it is very simple. While we as developers agree to do the crazy things these corporations demand, they will continue to try to make up their own rules and we will be the idiots looking foolish while trying to cope with the resulting extra work.
December 21st, 2008 3:42 AM
Bah hum bug … it is what it is - nice post Dan. Opera is a great browser!!
Would be nice if they all could get along though…but if that happened, what to complain about ??
December 21st, 2008 3:48 AM
Hi Geoff,
I don’t think Microsoft is ignoring it; instead there appears to be something akin to a corporate turf war going on inside the company. From what I’ve been able to gather, the IE Team (headed by Chris Wilson) has been pushing for advancements in standards and complete support for HTML 4.01 and CSS 2.1 before tackling XHTML (and I don’t mean served as HTML either, but a real XML markup language), SVG, JavaScript and other evolving (not to mention emerging) standards. Naturally this would cause a lot of corporate intranets and applications that were built around Internet Explorer to break.
Of course, that would be akin to a doomsday scenario for management - which depends on its corporate customers (a majority of them being large companies if I remember correctly) having working applications. Part of the problem is most of the code that went into the programs that hook into IE 6 were never written properly to begin with - they’re slow, bloated, and sure as hell buggier than a plague of locusts descending on a farmer’s fields right before the harvest.
The other part of the problem is that these programs are about a decade old - if not older, and Microsoft’s clients are rather hesitant to upgrade (the largest group of customers that refuse to upgrade to Windows Vista are not the Microsoft haters and Linux hippies, but companies that rely on Windows to stay in business). And that was before the economy started to slide into the recession/depression.
So that leaves Microsoft stuck between a rock and a hard place. It appears that management has the upper hand at the moment, but the Internet Explorer Team has made significant progress; first Internet Explorer 7 with its improved HTML and CSS support, and now IE 8 finishing where IE 7 left off. I have heard that the JavaScript support for IE 8 is still not quite up to snuff, but given that I hardly ever work with JavaScript, that honestly doesn’t bother me quite as much.
And therein lies the problem - we don’t have a set of rules. Everyone does their own thing. HTML and CSS are treated a lot like Perl in that respect. There are a lot of “right ways” to do something, and since the browsers are so forgiving in how they handle errors, they never seem to take the time to learn how to develop their sites the correct way.
Ironically, I have Microsoft to thank for me being as good as I am. I literally cut my teeth on that browser over the years; rather than just give up and “code for Firefox; hack for IE” I chose to learn what was causing IE’s problems and find ways around them. By doing that, I was able to create an HTML/CSS framework that works just as well in IE 5.01 as it does in IE 8, Firefox 3, Opera 9, and Safari 3 - without having to resort to hacks except when I have to use them to provide equivilent functionality (such as :hover or PNG-24 alpha-transparency support in IE 6) in older versions of Internet Explorer.
But don’t worry, I’m not going to keep that knowledge to myself. Knowledge after all is meant to be shared, and I’ll be doing a lot of that (and more) on Minimal Markup once the design is finished and the site launches. (Perhaps we could work together on it - I’m not a designer, but I do have a layout in mind. All the site needs is a color scheme, a logo, and some layout graphics. Feel free to e-mail me if you’re interested.)
There’s no bias at all. In fact, the company was nearly broken up by the United States Department of Justice before they decided it would be best to back off at the last minute. By then it was too late for Netscape Communications (Microsoft’s primary competitor in the browser market at the time). Fortunately the Mozilla Foundation took off and released the Firefox browser with an agressive marketing campaign. (Not that it would have mattered to me - I’m an Opera user.)
Nowadays we have the Mozilla Foundation, Opera Software ASA, Apple Computers, and even Google, not to mention the KHTML project (which is responsible for the Konqueror browser on Linux) and other open source initiatives. Despite the greater competition though, there are still only four major browsers to test against (I listed them earlier).
I wouldn’t have said no. Instead, I would have sold them on the value of doing things my way. Such as informing a client that the higher prices are justified by the unique approach (you) take to developing Web sites that reduce the hosting, maintenance and redesign costs by as much as 80%, or that the built-in (free of charge) accessibility features and search engine optimized code can increase their traffic and sales by as much as 150% or more.
When you start throwing hard numbers out at clients like that - and show them how they can not only save money down the road, but make even more on top of it, then they’ll be more likely to take what you say seriously. Of course, you have to have the numbers to back it up, or else it won’t work.
I doubt that would accomplish anything other than to upset a lot of regular Web users. Imagine if this were to actually happen. For most people, the Internet is “the big blue E” on their computer. They don’t know about other browsers like Firefox, Opera and Safari. For these people, removing the hacks, patches (I refuse to call them fixes) and workarounds will cause their Web sites to break - and seeing it happen all over the Web would lead them to believe that the Internet is broken.
What we need to do instead is educate, educate and educate some more. For those who think that it hasn’t worked, and that the efforts to date have been less than futile, take a look at where we are now. We have HTML 4.01 and XHTML 1.0; we have ECMAScript, we have CSS 2.1 and SVG, and XML 1.0. And developers are using them. True, there are still those who are resistant to change, but by the time they finally come around, it may finally be “too little too late” for them since there will be more standards-adhering developers and designers than there are holdouts and they will eventually get the jobs the “old timers” currently hold.
I don’t pander to corporations. I merely found a way around them while still adhering to the rules. It doesn’t take a lot of work once you’re familiar with the process of standards-based design and development. Only the learning curve involves spending the time to do the extra work involved. Besides, for the most part, they do work within the same set of rules. Some just do so more than others is all - but they do all at least adhere to the basics. Which is a lot better than not adhering to anything at all.
I personally believe that’s the wrong way to go about it. Educating the client is one thing, but charging separate prices is another ball game entirely. What problems do you routinely encounter when working with Internet Explorer?
Arrogant? Not at all. It just sounds like you’re frustrated over how Internet Explorer and the other browsers act, is all. To be fair to Internet Explorer though, it’s not the only browser with problems. Firefox for example flat out IGNORES entire sections of the HTML specification, and its CSS support for styling legends is worse than IE’s CSS support for styling fieldsets. And then you have sites that deliberately block Opera from even accessing them just because the 30 million people who use the browser are “not a large enough percentage” to be worth catering to.
December 21st, 2008 7:01 AM
WOW +
Thanks Dan, for the effort you have made to help me out here. I now feel much better informed. You have given me plenty of food for thought and filled in a few gaps with fact.
I like Opera too but find myself using Safari 99% of the time. You guessed it, I don’t use Opera as my main browser because too many web-sites go “what the heck, this is too hard for me”. I love the way Opera supports Torrents and Zooming. These features should be standard issue in all browsers.
I will get back to you regarding Minimal Markup. What a great name for the site, I feel it’s sure to be a winner.
Geoff Bunker, Australia.
December 23rd, 2008 11:54 AM
Amen brutha. Preach it!
Goeff, your attitude (frustration) is quite common out there! I’m suprised how much more frustrated I get at FF than I do at IE (I think because the hacks are easy, can be few if you know how to write well, and are pretty well documented, while FF’s are buried in bugzillas).
Bah, I dislike zooming!
Though I guess I don’t mind it being on my browser, so long as I can change from regular zoom to Text zoom.
Still waiting for Minimal Markup
It’s bookmarked still 
December 23rd, 2008 10:26 PM
I like the zoom feature - but I hate it when designers and developers ignore it. All I see on many sites are horizontal scroll bars when I zoom in and it really irks me.
December 24th, 2008 1:39 AM
ZOOM, ZOOM, ZOOM….
I’m running a MacBook Pro with the 1920×1200 pixel 17″ display so things look pretty small compared to most other screens.
Zooming text to a readable size often means blowing it out of the intended area of the page, thus zooming the entire content is the only way to go.
I’m giving Opera another go, see if they ignore us now that it’s 30,000,001 users!
December 28th, 2008 1:36 PM
The only reason that I could see value in browser detection is to display a certain browser-friendly template. Otherwise, it’s pretty silly.
It just goes to show the importance for browsers to meet established standards.
January 8th, 2009 4:56 AM
Shea, there is another use for browser detection - providing equivilent functionality for older versions of Internet Explorer. However this would have to be done within a controlled environment which requires the use of conditional comments to pull off successfully. Otherwise the browser detection scripts could unintentionally run in other browsers, especially Opera and Konqueror.
(Off-topic: Is that a black lab in your Gravatar?)
January 29th, 2009 11:56 AM
You bring up an interesting point. The four main browsers I code for are typicaly ie7, firefox, opera, anc chrome. Of course I still check for major flaws in ie8 beta. Same with ie6. The reason I don’t code for ie6 is that someone on sitepoint gave me some food for thought earlier this month. It is too much of a hassle to code for ie6. Just because people use it, doesn’t mean they have to have an equal viewing experience in that browser like they would in the other browsers I code for. They still have the content, they still have majority of the design correct, only broken in a few spots. I see no reason to spend extra days hacking and coding workarounds for ie6 when I can just (not ignore it) but selectively choose what to fix in ie6.
~eric
February 27th, 2009 12:03 AM
I agree with Eric. Why should we as web developers have to do work arounds for certain browsers when the developers of those browsers should have fixed the problems themselves? I know not everyone is going to agree with me on this. However it is the browsers developers that started the problem, they should fix it or see their browser die.
One note on Opera. For the most part I agree it is a good browser. However I was disappointed with the Opera browser that was released with the Wii. I felt they sold themselves short there and it could have been Nintendo’s fault but if that was the case they should have told them where to go.
March 1st, 2009 7:38 PM
Yes. It is a good browser, and as Dan says it renders just as well as Firefox which means I don’t care if I have to take 2 minutes to check out the site. It is not like Opera will break anything major with my designs..
March 9th, 2009 8:46 AM
An Opera Tale
I set up electronic banking on my checking account. (This is with a fairly small bank in the US.) I went to login with Opera. I couldn’t get logged in. There was no specific error message. I logged in with IE and Firefox OK. I set Opera to identify as FF or IE but it still didn’t work. No matter what I tried in Opera, it didn’t work.
I sent a tech support request to the bank web site via e-mail. I got a reply from a guy who said “Oh yeah, Opera! I love Opera. I’ll fix the problem so you can use Opera. We will support Opera.” Then I logged onto the bank with Opera. I didn’t need to set an identity (not that it had ever made a difference on this site.) It worked. I logged in, and everything on the site was working great in Opera.
A month or two later, I went back and logged in with Opera to the same site. We were back to where we started. Opera failed to login. Again, there was no error message. It just wouldn’t work. At this point, I decided to not send tech support e-mail because I don’t see what the point is.
On that one web site, I can’t use Opera.
March 9th, 2009 8:53 AM
Just for clarity’s sake. Here is the current list:
Rendering engine: browsers
Gecko: Firefox, Seamonkey
Trident: IE4, IE5, IE6, IE7, IE8
KHTML: Konqueror
Webkit: Safari, Chrome
Presto: Opera
http://en.wikipedia.org/wiki/Comparison_of_layout_engines