Archive for the ‘HTML’ Category

IE6 Upgrade notification

Friday, March 4th, 2011

I’ve quit designing around IE6 a long time ago. I have a contract that states that if my client needs me to design the site to work in IE6, they pay extra. For the other sites, when I suspect the target audience might use IE6, I wrote a little piece of code. It’s validated in 4.01 Strict HTML and stays out of the way of Google search results (because it’s at the bottom of the page).

Let me know if you’re using it or if you made improvements to it.

Here it is. Put the html right before the </body> tag, and the css at the bottom of your .css file.

<!–[if lt IE 7]>
<div id=”upgrade”>You are using an outdated browser. For a faster, safer surfing experience, please <a href=”http://www.microsoft.com/windows/internet-explorer/default.aspx”>upgrade for free</a>.</div>
<![endif]–>

/*-- IE6 --*/
#upgrade {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	background-color: #ff0;
	}

Tags: ,
Posted in HTML, Windows | No Comments »

Introduction to Typekit

Saturday, December 5th, 2009

I’ve done a screencast on the introduction of Typekit for The Web Squeeze about 2 weeks ago. For those of you who haven’t seen it yet, here it is:

Introduction to Typekit from TheWebSqueeze on Vimeo.

Tags: , , , ,
Posted in Design, HTML, Tutorials | No Comments »

Death to IE6 #2

Wednesday, October 22nd, 2008
IE6 must die.

IE6 must die.

In this post I already told you how much I hate IE6, and I’m not the only one, so I decided to stop squirming around it, and simply stop designing around it, unless a client pays extra.

This might be useful for some of you out there who also want to avoid the agony of IE6. I recently started using this code, and so far it works pretty good.

In the <head> of your HTML:

<!–[if IE 6]>
<style type=”text/css”>
#ie6 {
display: block;
}
</style>

In the <body>, before anything else:

<div id=”ie6″>It seems you’re using an old browser. In order to view this site correctly, we advise you to <a href=”http://www.microsoft.com/windows/products/winfamily/ie/default.mspx”>upgrade your browser</a>, or try the free <a href=”http://www.mozilla.com/firefox”>Mozilla Firefox</a>.
</div> <!– end #ie6 –>

And finally in your .CSS file:

#ie6 {
font: normal 12px Arial, Helvetica, sans-serif;
color: #333333;
background: #FFFF66;
display: none;
}

This way a yellow bar telling people to upgrade their browser shows up when somebody is using IE6. In any other browser it will be hidden.

You can use/edit/redistribute this piece if you like. Any comments are also welcome.

Tags: , , ,
Posted in Design, HTML, Internet | 16 Comments »