Web Development Blog

OK, so you spend the whole day trying to get this huge project out of the way, but just as you are about to finish up, you decide to run it through all the other browsers to make sure that your work is up to standard and that the maximum amount of Internet users can view your site as it was intended…

Firefox works perfectly, as does IE7, Opera and Safari - all except IE6… *sigh* I truly hate the fact that there are still people using Internet Explorer 6!

I think the problem is that a lot of these people don’t realize that there are newer browsers available and there is nobody to inform them. The fact that we keep tweaking for IE6 (and older) only helps for one thing: keeping these people in the dark ages!

What I propose to do is simple: we just start adding a notification block to the top of pages when they are being opened by Internet Explorer 6 or earlier. This is also a lot easier than it sounds.

The first thing we need to do is to create a stylesheet that will only be read by IE6 or earlier and Microsoft actually provided for this to be doable when they added conditional comments to their browsers. We will call this stylesheet “oldie.css” and we call this in the header of our page, wrapped in the conditional comments like this:

<!–[if lte IE 6]><link rel=”stylesheet” href=”[stylesheet folder]/oldie.css” type=”text/css” media=”screen” /><![endif]–>

This basically means: If the browser is lower or equal to Internet Explorer 6, load “oldie.css”

Ok now that we have the browser-specific stylesheet in place we can make it work for us.

You can now create a container at the top of your page with some sort of message in it, telling your visitors to go get a newer browser to stop seeing the notification.

Now this is where the browser-specific stylesheet comes into play. In the normal stylesheet we will set the display value of the container to “display: none;” and in “oldie.css” we will set it to “display: block;” causing only people using Internet Explorer 6 or earlier to see this container.

Here is a zip file with all the files you will need, You are most welcome to use this on your site: Download

(If you access superevil.za.net with IE6 or earlier, you will see this element in action!)

Just as an extra note, I think that we should continue (at least for now) with tweaking our sites to work on older browsers, but if enough people start doing this we will create the awareness we need to phase out IE6 completely.

Over and Out!

UPDATE: James from MentallyRetired had a very similiar idea.

Hello there, my name is Gerhard, and welcome to my new web dev blog.

I decided to start this blog because I am a full time HTML/CSS/Javascript guy that feels like I can use my spare time (however little that might be) to make notes that might help guys and girls who are new to this whole thing.

I might also sometimes simply use this blog as a place to post links to other sites I found useful. The idea is to have a big pot full of web coding goodness.

But let me tell you a bit about myself…

• I’ve been working in this industry for about 3 years now.
• I’m a little bit of a code snob. (There is only one way and that’s the right way.)
• I am not perfect, so if I do make a mistake, tell me, scream at me… I will fix it and give credit where it’s due.
• I like design, even though I’m not particularly good at it.
• I code in a text-only application… No Dreamweaver here (In my opinion Dreamweaver coders just can’t be taken seriously, but yes… that’s just me).
• I have the capacity to run out of topics sooner or later, so if you have something you want me to write about, drop me a mail… who knows… I might just write about that.
• And yes, the axe is stuck in her ass… the poor girl!

So, that was the first entry of many more to come..

Over and out!