Everyone knows that browser compatibility is the bane of web developers. If it's not a CSS bug or some DOM incompatibility, it's a plugin version issue (what's that, you say? I'm thinking of something that starts with 'F' and ends with 'lex'….). So help people put their best foot forward with a neat little CSS trick. Drop this HTML into your page, just before the closing body tag:
<div id="betterBrowser" title="get firefox">
Get a better browser.<br />
<a href="http://www.getfirefox.com/">
<img src="static/get_firefox.gif" alt="Get Firefox" /></a>
</div>
And then this CSS in your stylesheet:
#betterBrowser {
position: absolute;
top: 0px;
right: 0px;
margin: 5px;
padding: 5px;
border: 1px solid #999;
background-color: #eee;
text-align: center;
display: block;
}
#betterBrowser[title="get firefox"] {
display: none;
}
Last step is to download the get_firefox.gif file and save it in the appropriate place (updating the HTML as needed).
Voila! Any browser that doesn't support CSS attribute selectors (cough … IE … cough) gets a nice little prompt to get a better browser. No user agent sniffing, just a direct check for broken implementation.
Note that I'm running a slightly tweaked (though equally functional) version on this blog, so don't copy the code from my source.
"Use such-and-such browser" campaigns are so 1999.
No browser is immune from bugs, quirky interpretations of the specs, browser-specific extensions to established standards, crappy support for technology xyz, etc, Firefox included.
Right on. I am SO SICK of seeing "professionally" developed software require IE. It's about time for a little payback.
Why not go for Opera? It's even better and nearly all good things in Firefox were invented by Opera.
(And Fiferfox still isn't supporting inline-block! That really sucks!)
Jeff,
I would disagree. I don't care what browser you use, as long as it's good enough. If you're not using such a browser, I'm going to point you at Firefox, but if you use something else that works right (Opera, Safari, etc.) that's fine with me.
And at the same time, you'll find that my site works just as well in "bad" browsers as good. You'll lose some of the eye candy, but the core design is still sound.
Markus,
Opera still lacks a sufficient market share, at least in the arenas I operate in. It's about "good enough", not perfect. And while I'm a fan of competition, I'm not a fan of intentionally promoting the further fragmentation of the browserspace. Firefox has momentum that I don't see from Opera, and it's already more relevant to me, so I'm going to promote it over Opera, since they're both "good enough" in general.
I happen to particularly disdain the lack of support of attribute selectors in browsers, so that's the feature that I'm picking on. It should be relatively trivial to mod the CSS to pick on whichever feature happens to be your hot button issue.
Markus asked, "Why not go for Opera?"
If you'd like people to use Opera, then please feel free to promote it. I personally don't like Opera. The interface feels "heavy" and foreign to me. Firefox seems lighter and quicker. That's not measured results, just my own observation.
I think people promote Firefox over Opera based on preference rather than merits. Opera may have had some features first, or it may implement said features better, but it hasn't won us over yet. Whatever the case, both browsers beat Internet Explorer by light years, and I think you'd agree that more people using either option over IE would be better.
I think it's all a matter of perspective. I find there to be just as many "bad" things about Firefox as others find with IE. More importantly, Firefox isn't good enough in some areas that are critical to my business and the businesses of my clients. So, for now, IE will continue to get the nod over Firefox when it comes to which browser is "better".
I still say that the "Get Firefox" campaign with the annoying message being thrown in my face on every page view is so 1999. It's your site though, so ultimately your choice. I just thought I'd chime in with a differing view.