Internet Explorer 7 Tips For Webmasters

January 31, 2007

By: Andrea Butterworth of BraveNet.com

In this Andrea discusses Microsoft’s release of Internet Explorer 7, and takes a look at some of the fixes, new features, as well as some tips on transitioning your web site to work as intended in both IE6 and IE7.

Internet Explorer 7 - what’s the deal?

As most of you probably know…IE7 was released on Oct 18th of 2006. It is delivered as a forced update that comes in through your windows updater. Why is this update significant? Internet Explorer has had a history of poor CSS support and poor compliance with W3C standards, meaning that in order to achieve some CSS effects it was necessary to implement ‘hacks’ that would not pass validation with the W3C. It was long anticipated that a new version of this browser would address many of these issues. While the Microsoft developers network (MSDN) states that they have implemented a lot of fixes and new feature support, they admit that IE7 still does not provide complete compliance. One of the problems of making so many changes to this browser is that now pages that worked in IE6 are broken in IE7. We are going to discuss the changes to IE7, how to transition your pages from IE6 to IE7 and a few other bits and bobs.

What is different in IE7?

MSDN states that there have been over 200 changes released with this version of their browser including fixes and new features.

The following bugs have been addressed:

  • Peekaboo Bug
  • Internet Explorer and Expanding Box Problem
  • Quirky Percentages
  • Line-height bug
  • Border Chaos
  • Disappearing List-Background bug
  • Guillotine Bug
  • Unscrollable Content bug
  • Duplicate Characters Bug
  • IE and Italics
  • Doubled Float-Margin bug
  • Duplicate Indent bug
  • Three pixel text jog
  • Creeping Text bug
  • Missing First letter bug
  • Phantom box bug

To view more specific details on these bugs visit the MSDN blog at: http://blogs.msdn.com/ie/archive/2006/08/22/712830.aspx

You will also find a comprehensive list of other bug fixes, new implementations, and features from CSS2.1.

Now that IE7 is out my pages are broken:

First of all let’s just make sure that we don’t shoot ourselves in the foot. Don’t throw out your stylesheets! Some people haven’t been upgraded to IE7 yet or may be blocking the upgrade. Since you already went to all of the trouble of finding work-arounds for those bugs, keep your stylesheets and use this code to display the correct stylesheet depending on which browser your visitor is using.

One easy way to detect if the user is browsing with anything less than IE7 is by using IE conditional comments.

[code lang="php"] < !DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd" > < html > < head > < title >My web page title< /title > < link rel="stylesheet" type="text/css" href="your_normal_styles.css" mce_href="your_normal_styles.css" / > < !-- Will only be read by IE versions less then IE 7-- > < !--[if lt IE 7] > < link rel="stylesheet" type="text/css" href="your_IE6_styles.css" mce_href="your_IE6_styles.css" / > < ![endif]-- > [/code]Only IE will recognize this ( etc …). All other browsers will read this as a comment and ignore it. 

Hopefully, as a good developer, you developed for more browsers than just Internet Explorer. If this is the case, your transition should be much less painful as any hacks you have employed were probably for IE6 and you can simply move them to a stylesheet that loads only when that browser is visiting your site.

Visit the MSDN page on “Cascading Style Sheet Compatibility in Internet Explorer 7” and scroll down to see some other ways of transitioning your pages.

A couple of other tips on using IE7

It’s a problem. Microsoft’s IE7 forced update replaces IE6 completely so how do you ensure that your pages will work in IE6 if you can’t use it?

There are several ways to do this.

If you haven’t already installed IE7 use tech-recipes.com instructions to stop the one from overwriting the other. Another option is to install a stand alone version of IE6.

Note: Running a stand alone version of IE6 is not just that. Some functionality may be lost. For example some people note the inability to use cookies with the stand alone version.

The method recommended by the MSDN is to run IE6 via a virtual environment and they are providing a free download package of this for developers. Here’s the catch… for some reason Microsoft has decided to “time bomb” the virtual environment for April 1 which means that it will no longer work after that date. In addition people have reported that it is resource heavy and may slow down your machine.

To make a decision on what to do and how to do it, try reading Running IE7 and IE6 at the same time: Windows and Mac, the comments at the bottom are informative as well.

A general tip on getting used to the new browser -> visit the quick reference guide for keyboard shortcuts and other useful information on IE7.

Good luck everyone!

Comments

Got something to say?

You must be logged in to post a comment.