How to warn IE6 users
First of all, do not dump support for Internet Explorer 6, that is not the intention of this article. The point is to, where possible, ensure that your site works in IE6. But where it’s not possible, or you would have to spend too much time and energy on writing “hacks” to make it work, you can apply a warning/information to consider upgrading IE or to use another browser.
What not to do
The point is to encourage the user to upgrade, not to force an upgrade (telling how dumb the user is by using IE6). If a site is already works as it should in IE6, or if you could invest very little time in getting it working, it’s better if you don’t include a warning at all. At least you could try to integrate the IE7 JavaScript library, available from code.google.com/p/ie7-js, or by overriding some of the CSS via an IE6-specific style sheet. The image below shows Joe Levi’s one-line upgrade method, “scaring” people to upgrade by pretending an OS alert, but encouragement is better than underhand methods.
When to warn
If you get too “hung-up” in hating IE6, and decide to block access to all IE6 users, you can be pretty sure that they will never return, regardless of what browser they later end up with. The choice must always always rest with the user, they have to be in control of making the decision. And if they don’t want to upgrade, that’s down to them and it’s their loss. However, with the right approach, you can encourage them by explaining the benefits of switching or upgrading their browser, you’re more likely to get a positive result this way. The image below is from Travellerspoint, and it looks nice.
Be kind
Applying the warning
It only takes a few lines of html code to apply the IE6 warning. You need to make use of conditional comments to apply it to your website. The code below is one way of doing it. It wraps a conditional comment around the relevant code block:
<!--[if lt IE 7]> <div id="ie6warningbox"> [Place your warning text here] </div> <![endif]--> |
Modern, compliant browsers will just ignore this block of code. But versions of IE below version 7 will read it and treat it as html. So, if this was read by an IE6 browser, it would generate the html placed in the block, but if it was by IE7 or IE8, it would ignore it.
So, the conclusion would be: Keep it simple, keep it polite, and reassure and assist IE6 users, rather than showing them the finger.
![[BlogBookmark]](http://www.csstemplatesweb.com/wp-content/plugins/bookmarkify/blogbookmark.png)
![[Facebook]](http://www.csstemplatesweb.com/wp-content/plugins/bookmarkify/facebook.png)
![[Google]](http://www.csstemplatesweb.com/wp-content/plugins/bookmarkify/google.png)
![[Reddit]](http://www.csstemplatesweb.com/wp-content/plugins/bookmarkify/reddit.png)
![[StumbleUpon]](http://www.csstemplatesweb.com/wp-content/plugins/bookmarkify/stumbleupon.png)
![[Technorati]](http://www.csstemplatesweb.com/wp-content/plugins/bookmarkify/technorati.png)
![[Twitter]](http://www.csstemplatesweb.com/wp-content/plugins/bookmarkify/twitter.png)
![[Windows Live]](http://www.csstemplatesweb.com/wp-content/plugins/bookmarkify/windowslive.png)
![[Yahoo!]](http://www.csstemplatesweb.com/wp-content/plugins/bookmarkify/yahoo.png)
A favourite icon, called favicon, is the small icon that is displayed in the browser address bar, and it will also show in your bookmarks. It is a lot easier for the user to find the bookmark of your site, if you have created a favicon, and attached it to your website. If you look in your browser bar right now, you can see a pink little graphic square, this is the favicon of this site, making it easy to remember that you may have visited this site earlier. In short: using a favicon will improve the overall look of your website. So, how do we create a favicon? The favicon of this site is made in Adobe Photoshop.