The Do’s and Don’ts of Professional Web Design.

This list summarizes my often time controversial positions for everyone to see and attack!

Attacks aside, I felt it was time to come out with a new list of best practices in web design with the aim of making web designers lives a little easier.

:)

THE DO’S AND DON’TS OF PROFESSIONAL WEB DESIGN

  1. Don’t use CSS hacks - they will break in IE7.
  2. Do use IE conditional comments to write CSS code that only IE will see*.
  3. Don’t use XHTML in your web pages because:
    • XHTML is not properly supported in IE6, IE7 and some other browser - this makes up about 80-90% of the browsers being used today.
    • XHTML is restrictive in terms of:
      1. the tag attributes you can use.
      2. it makes DOM / AJAX scripting that much more trouble.
    • Even in a perfect world, XHTML does not provide a significant advantage over HTML 4
  4. Do use HTML 4.01 doctype.
  5. Do use CMS’, Blogs and web templates as much as possible - saves time and money.
  6. Do make your websites accessible.
  7. Do use CSS for page layouts if CSS based layouts are NOT a big headache; otherwise use HTML tables.
  8. Don’t get fooled into believing that Web Standards based websites will have any practical impact on how well your websites and web design will do in the market place. 99% of the world doesn’t care and even worse - most don’t even know what the Web Standards are.
  9. Do break out of the Web Standards if they get in the way of getting the job done - Web Standards are NOT holy scripture.
  10. Don’t nest tags too deeply - nested div’s are just as bad as nested table’s.

Notes:

CSS hacks are often used to hide CSS code from IE so that you can manage the inconsistencies between IE’s broken DOM and better browsers like FireFox.

Hacks in a nutshell: you have one set of CSS rules that work for IE and another (hidden by way of CSS hacks,) for FireFox and other more compliant browsers. Using CSS hacks is a bad idea (that should have never been suggested) because they depend on something that is ‘broken’.

As an alternative, IE conditional comments make sense because they serve the same purpose as the hacks: to allow us to serve IE only code to IE, and not any other browsers. In addition, IE conditional comments are a feature of IE and not something that is broken.

ON DOCTYPES:

People have written long blathering articles on doctypes and on which ones to use. Being a practically minded person (who keeps reminding my long-winded father to ‘get to the point’,) I wanted to give people the quick- skinny on doctypes:

What are doctypes?

The doctype is a little bit of code that tells the browser how to read your web pages - it tells the browser which (of its many) ‘engines’ to use. As you may have guessed, we have several options.

What doctype should we use in our pages? Your Options:

  • HTML 4.01 Strict
  • HTML 4.01 Loose
  • HTML 4.01 Frameset

You can cut-and-paste any one of these:

< !DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

< !DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

< !DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">

-

Just in case it is not clear, you insert only one (of the doctypes) at the top of your web page. So which one should you use? Use the first one: HTML 4.01 Strict

Final comments:

There are other doctypes but they relate to XHTML … and we know that you shouldn’t use XHTML.

Bye for now.

Stefan Mischook (The Web Heretic)

6 Responses to “The Do’s and Don’ts of Professional Web Design.”


  1. 1 Snowy

    Hi, cool. I was breaking my head for the webstandard, but could not rectify errors, though I would like to rectify them some day. I am going to buy your book Creating Killer website.

    I think your blog will enlighten us more than the CSS gurus who are shouting for the standard based designs.

    Nice blog you have here. Thanks!

  2. 2 Stefan Mischook

    Hi,

    Thanks for the kind words.

    About Creating Killer websites: This book was great in its day but I would not suggest you buy it now … it’s too old now. You can find up to date information on this site though ..

    PS: David Siegal wrote Creating Killer websites, I’ve taken over watch of the site for 3 years now.

    Thanks,

    Stef

  3. 3 Jane D

    If the advice in the book is as bad as the advice provided on this page, then I would look elsewhere.

    XHTML is now, and it’s the future - it’s easy to make standard HTML pages XHTML compatible, and provides many more devices with access to your pages, than if they were just standard HTML.

    Regarding the suggested DocType, then the author seems to be in denial. At a minimum you want to be using a transitional XHTML doc-type.

    I could go on about some of the other poor advise, but I would strongly suggest getting a number of other perspectives before adhering to any of the advise provided by the author on this page.

  4. 4 Stefan Mischook

    @Jane D:

    Can you read? XHTML is NOT now, since the vast majority of users on the web today use a browser that simply does not read XHTML - IE6.

    Yes, you should make your HTML pages follow basic XHTML rules like closing tags and keeping the tags in lower case but you should still be using HTML not XHTML.

    The many devices argument does not fly either because of two very important realities:

    1. Very few people use devices other than traditional web browsers - not even close to 1% last time I checked.

    2. Most devices will read HTML if it is well formed.

    You also fail to address another very important point - DOM scripting and thus AJAX is made much more difficult when you use XHTML.

    You’ve been brain washed by the zealots and haven’t really looked at the true facts. I suppose your web pages are riddled with CSS hacks … have fun changing your code when IE7 comes out.

    Oh, and what about your clients … are you going to be calling them to let them know you’re going to be updating their websites for free because you made the mistake of using hacks?

    What do you say of all those authors who said that using hacks was the thing to do … are you emailing them, pointing out how foolish that was?

    NOTE: I was the ONLY one who publicly came out and said that using hacks was a really bad idea because hacks could break things - this is way before the IE7 reality came to light and way before Slashdot screwed up …

    Do know why the famous web standards zealots did not pick up on this, and my stupid lazy self did? Because most of these people are web designers and not experienced web developers (software developers) … any junior programmer would have been taught the basic skills to see the holes in the web standards movement.
    -

    It’s funny to watch web designers thinking of themselves as system architects, when it is clear they have no idea what they’re talking about …

    Why don’t you learn some programming and spend a few years writing software. Then (with luck,) you’ll finally SEE how the whole XHTML argument is silly, as is the culture of hackery developed by your heroes … the blind leading the blind.

  5. 5 rodney

    Wow!!! Stefan u dont sound too happy. I see your point tho’ and I personally think its valid… even as a web DESIGNER… ;)

  6. 6 Stefan Mischook

    Web designers are great, I’m one too! I didn’t want to pull the elitist card (knowing Java etc …), but I’ve been attacked many times regarding my point of view, and I’ve held back … until now.

    I don’t comment on things I really don’t know about; so it gets on my nerves when I hear/read ‘expert’ opinions from questionable sources.

    In the boxing and martial arts world, we would take them into the ring and ‘fix’ things up rather quickly … not something as easily done in the Web world, where people can hide behind semantics.

Leave a Reply