Display Unobtrusive Message for IE Users?

[Neillithan]

Hi, I have been designing my website to look good in Firefox. I've discovered that my website displays poorly in IE 7 and 8. I was wondering if there is a Javascript code that I can insert into the head of my website that would display a non obtrusive message at the top

of my site that only IE users will see. I am looking to put like a thin horizontal bar at the top of the page with an X in the corner that you can close out of.

The message would say something along the lines of:

This website displays best in a modern browser like Firefox, Opera, Google Chrome or Safari.

Then so that the message does not come back every time they go to a different page, perhaps it would remember when they close the message.

Does anybody know if there is an easy solution for this?

I have already implemented a message that says my website is completely unsupported on IE6. I didn't bother making it unobtrusive because the website is literally completely unusable in ie6.

Any help would be very appreciated. :)

Thanks,

-Neil

[sweetsam]

Well you could use styles that target IE to display the messages. You could use JavaScript in combination with cookies to display the message once and then keep it hidden thereafter. Are you sure you want to ignore IE7&8 users which is a significant number.

[Cupcakes]

Have you tried looking around online already? There are plenty that have been made for this same purpose.

Either way:

http://css-tricks.com/ie-6-blocker-script/

http://code.google.com/p/ie6-upgrade-warning/

Just edit them to include versions 7 and 8 as well as only showing an unobtrusive message versus what they would show now :).

[Neillithan]

Have you tried looking around online already? There are plenty that have been made for this same purpose.

Either way:

http://css-tricks.co...blocker-script/

http://code.google.c...pgrade-warning/

Just edit them to include versions 7 and 8 as well as only showing an unobtrusive message versus what they would show now :).

I actually adapted the "IE 6 Blocker Script" so that it displays in the top left corner for IE7/8 users, but I haven't figured out how to make a close button.

I will try your second suggestion, except without IE as an option. I really absolutely do not plan to design my website for IE, so suggesting they update their IE to a version that still won't even display my site properly would be misleading.

Thanks for your suggestions. :)

-Neil

[Cupcakes]

I will try your second suggestion, except without IE as an option. I really absolutely do not plan to design my website for IE, so suggesting they update their IE to a version that still won't even display my site properly would be misleading.

Which is why I stated that you edit it. I didn't state to utilize it as is--the functionality you wanted is there, just not how it is presented. :)

Could always take a look and see if this is what will do the trick for you:

http://www.webmasterworld.com/javascript/3003082.htm

Found that after a quick search for "close div +cookie."

[Solid Knight]

This is rather easy. Detect the browser (plenty of articles on how) then display a DIV or whatever if the browser matches IE. Look at some Javascript tutorials on how to close elements. This is rather trivial.

It is pointless as visitors with IE are going to go away and never come back if your site's design is unusable or visually appalling. Few people will ever change their browser for just one site.

[tablet_user]

This is rather easy. Detect the browser (plenty of articles on how) then display a DIV or whatever if the browser matches IE. Look at some Javascript tutorials on how to close elements. This is rather trivial.

That being said, its kind of pointless as visitors with IE are just going to go away and never come back if your site's design is unusable to visually appalling. Few people will ever change their browser for just one site.

Just reading him asking i lost complete interest in his site and i didnt even visit it or know what it is lol

[RoomKid]

If you're familiar with Javascript, have a look at my sites code:

http://old.manmohanjit.com/style/2009

$('#i-dont-like-ie p span.close').click(
 function() {
  $.cookie("hideIEmessage", "yes");
  $('#i-dont-like-ie').animate({ height: 'hide', opacity: 'hide' }, 'fast');
 }
);

You'll need to use jQuery and the jQuery cookie plugin.

This is the HTML code including some PHP code:

<?php if($_COOKIE['hideIEmessage'] != yes && isset($_SERVER['HTTP_USER_AGENT']) && strpos($_SERVER['HTTP_USER_AGENT'], 'MSIE')) { ?>
            <div id="i-dont-like-ie" class="error-note span-24 last">
                <p>
                    Get <a href="http://getfirefox.com/">Firefox</a>. <span class="close"> (Close)</span>
                </p>
            </div>
<?php } ?>

:)

[Tha Bloo Monkee]

Are you sure you want to ignore IE7&8 users which is a significant number.

+1

I'm sure plenty of businesses and schools still have XP running with IE6, I don't know what kind of site you have but even dismissing IE6 may not be the best idea (but like I said, it really does depend on the kind of site you have...).

[Rudnartim]

Outside of that obnoxious pop-up, your site displayed fine to me.

[TechFreak:)]

I'm sure plenty of businesses and schools still have XP running with IE6, I don't know what kind of site you have but even dismissing IE6 may not be the best idea (but like I said, it really does depend on the kind of site you have...).

Even Youtbe dismissed IE6 support. People with IE6 are just unlucky.

[primexx]

It is pointless as visitors with IE are going to go away and never come back if your site's design is unusable or visually appalling. Few people will ever change their browser for just one site.

that's why it's important for everyone to do it in unison, eventually they'll get the point that archaic browsers can't expect to fully participate in the web.

I'm sure plenty of businesses and schools still have XP running with IE6, I don't know what kind of site you have but even dismissing IE6 may not be the best idea (but like I said, it really does depend on the kind of site you have...).

ie6 has hindered progress for long enough, even microsoft is campaigning to kill it. unless you're developing something with a specific ie6 audience, there's absolutely no reason to support a 10 year old browser anymore.

[Neillithan]

Which is why I stated that you edit it. I didn't state to utilize it as is--the functionality you wanted is there, just not how it is presented. :)

Could always take a look and see if this is what will do the trick for you:

http://www.webmasterworld.com/javascript/3003082.htm

Found that after a quick search for "close div +cookie."

You misinterpreted. I was not complaining, I was merely stating that I was going to do that.

Sorry if what I said sounded defiant, I truly didn't intend for it to be interpreted like that.

Also, at this point I'm just experimenting. I haven't decided what I plan to do yet. ATM I am booted into XP which still has crappy old IE6 installed. I know IE7 displays like crap and I haven't yet tested what my site displays like in IE8. I have only briefly seen my site rendered in IE8 and that was a couple months ago and I have changed my site's design somewhat since then.

Truthfully, I am not trying to alienate IE users or harp people to get one browser over another. I just do not want visitors to think my site looks the way it does when the real problem is their non web standards adhering browser.

I will probably remove the message for IE8 users but keep it for IE6/7 users.

So far one person who replied in this thread sounded really offended by the message to the point that he doesn't even want to visit my site. lol. I find that both hilarious and sad. I'm not advocating a single browser, I'm simply expressing my discontent with having to design my site multiple times so that it views correctly in the worlds most unabiding browser.

[TechFreak:)]

IE7 and IE8 usually render pages equally so there is no reason to not support them both.

[-=Outlaw=-]

umm you said "This website displays best in a modern browser like Firefox, Opera, Google Chrome or Safari." well isnt IE8 a modern browser lol. anyways, if you insert that in im sure it will make some of the visitors not want to come back. making the site work in all browsers shouldnt be that hard. i made few websites and they all look almost the same in all browsers. only thing i put on my sites is that people need to upgrade their browser if they have IE6 and IE7 on some of my sites.

[Singh400]

By all means target IE6. It is after all nearly 10 years old, and even the average joe should know better. But targeting IE7 & IE8 is just mean lol.

[AnthonySterling]

...or you could, er, work to fix the incompatibilities? *shock horror* :p

[XerXis]

how about you make it work in ie8 and ie7 ;) it really is not that hard

[Cupcakes]

By all means target IE6. It is after all nearly 10 years old, and even the average joe should know better. But targeting IE7 & IE8 is just mean lol.

Just mean? All he said was that he wants to have an unobtrusive message stating that it looks best in various browsers. He's not saying he's going to tell people to change their browser and/or block their access...

That's good practice if you ask me.

@Neillithan -- Forget about the people who are gung-ho to tell you "just fix it, it's not hard" or various other inane, rude messages.

Do what you want to do with your site because ultimately that's all that matters. :)

[Neillithan]

I just checked to see what my website looks like in IE8 and it looks like complete ass. The entire right hand column is missing, the background textures are misaligned. The only thing I've done that's out of the ordinary is use the experimental -moz-border-radius and -webkit-border-radius for chrome/safari compatibility. It won't hurt if people don't see rounded corners. Everything else is relatively normal CSS.

Forgive me when I say this, but IE8 is garbage.

Just mean? All he said was that he wants to have an unobtrusive message stating that it looks best in various browsers. He's not saying he's going to tell people to change their browser and/or block their access...

That's good practice if you ask me.

@Neillithan -- Forget about the people who are gung-ho to tell you "just fix it, it's not hard" or various other inane, rude messages.

Do what you want to do with your site because ultimately that's all that matters. :)

Thank you. :) Like I said, I'm just experimenting. As of right now, you should see the big annoying "choose your browser" overlay. I'm probably going to remove it and just settle for the other method of unobtrusively displaying a message at the top of the page. I just haven't figured out how to make it go away with a close button and stay hidden for the browser session. I'm not very talented when it comes to this stuff. Generally speaking, if you thought otherwise, you've been mislead.

[cork1958]

I just checked to see what my website looks like in IE8 and it looks like complete ass. The entire right hand column is missing, the background textures are misaligned. The only thing I've done that's out of the ordinary is use the experimental -moz-border-radius and -webkit-border-radius for chrome/safari compatibility. It won't hurt if people don't see rounded corners. Everything else is relatively normal CSS.

Forgive me when I say this, but IE8 is garbage.

Thank you. :) Like I said, I'm just experimenting. As of right now, you should see the big annoying "choose your browser" overlay. I'm probably going to remove it and just settle for the other method of unobtrusively displaying a message at the top of the page. I just haven't figured out how to make it go away with a close button and stay hidden for the browser session. I'm not very talented when it comes to this stuff. Generally speaking, if you thought otherwise, you've been mislead.

That's your opinion of IE8, but personally, not many people will be visiting your site with your disregard of IE.

Personally, Firefox is garbage!!

Edit:

At the moment, your site doesn't seem to be working to well with Opera 10.54 either. Part of that may be because clicking your link in your sig from here opens a new window but your page loads here also, meaning I have 2 instances of your site open at once.

Speaking of which, what's with Neowin opening new windows all the time anymore? Stupid!!

[Neillithan]

That's your opinion of IE8, but personally, not many people will be visiting your site with your disregard of IE.

Personally, Firefox is garbage!!

Less than 20% of my site's visitors are IE users.

I would gladly cut them loose except as I have mentioned, I plan not to do that. I just won't design my site FOR IE.

[Berserk87]

I see a couple flaws in IE 8, but it dosn't make the page unusable, and they should be really easy to fix.

[Cupcakes]

@cork1958 - No need for a browser war here. It's user preference, so "personally" any browser can be garbage.

[AnthonySterling]

That's good practice if you ask me.

Personally, if we're offering up opinions, I'd say it's the *worst* practice, why build something on a distributed platform that doesn't work, distributed.

Do what you want to do with your site because ultimately that's all that matters. :)

Again, I disagree. If the only user was the OP sure, but the site(hopefully) will have other users. Trust me, it's a slipperly slope forgetting about the users when building an application/website. The OP may indeed find, that they unintentionally only end up being the only user after all.

Stick to standards, then stick some more. You'll find it much easier to find fixes/workarounds for standards which any given browser requires due to it's failings. Why? Because *everyone* needs them.

Good luck!

Anthony.

[Plarkster]

Have a look at http://www.ie6nomore.com/ and just alter the IE version and reword it how you want.