I’m currently designing a website interface for a personal project. Things are at the preliminary stages, but I’ve already stumbled across the one reason I hate working with web pages in terms of design …
Internet Explorer simply does not adhere to web standards.
What this means is that I can plan a layout for the website, code it according to industry standards, and test it in Firefox. It will look like this.
Please understand that this is a preliminary design. Ignore the colours and layout as I’m using them to rough out my ideas. In all likelihood things will change dramatically as I build the site up. But at this point it is good to take a look at the basic structure of the site.
I then decide I should test it in Internet Explorer too, simply because I know everyone doesn’t use Firefox. Why that is I do not know, but I know the majority of people are still using Internet Explorer. OK, and here is how the page is rendered by I.E.
The exact same code, but with totally different results. Now I need to go and figure out if there are any known tricks I can use in order to make I.E. pretend it is standards compliant. I really hope I.E. 7’s CSS support is vastly improved when it comes out.
Many web sites seem to be coded specifically for IE, so that they don’t render properly in a browser that actually complies with the standards. Basically, if 70-95% of people (depending on the stats you see) use IE, Microsoft can set their own standards, and web page designers would have to comply with THOSE if they don’t want 70-95% of people on the net to ignore their site. I use Firefox, but sometimes have to use IE because critical parts of a site don’t even appear in Firefox.
Golden rule with IE – you have to use tables. MS loves them and are available in use for all their products. Define your CSS rules within the table spaces and you should be good.