Worst HTML Mistakes, pt 1

HTML is good at what it’s designed for, but it is used in some really horrible ways. Here are some things you should avoid:

  • Use FrontPage/Microsoft Word to create websites
    • Both of these applications generate¬†horrendous¬†HTML, which doesn’t comply with official W3C standards, doesn’t work in most non-Microsoft browsers, and is excessively bloated
  • Use browser specific, non standard tags (<marquee>)
    • Sites that claim they work best in a specific browser are a clear indication of a poor quality developer
  • Use the blink tag or CSS style
    • These are never recommended due to accessibility concerns (for users with disabilities)
  • Use tables for layouts
    • Tables are designed for tabular data, not for creating the entire layout of a site. They’ll lead to bloat, difficult to maintain content
    • Table based layouts don’t work well with accessibility software such as screenreaders
  • Use excessive divs
    • I’ve seen sites with nested divs a hundred levels deep. This is a clear indication of a poorly thought out structure
  • Break images up because you think 100 small images load faster than 10 big images
    • The more HTTP requests, the slower it is
    • Use sprites for icons and buttons (Sprites are larger images that contain a bunch of smaller images)
  • Capitalizing your tag names/attributes
    • The correct syntax is <strong> not <Strong> and definitely not <STRONG>

Here are some things you should do

  • Validate your code to make sure it is valid (validator.w3.org/check?url= should be memorized)
  • Your code should be accessible (Provide alternatives for image/flash/javascript content)
  • Test your site in Internet Explorer (Use compatibility mode to test in older versions of IE, by pressing F12), Firefox, Opera, and Google Chrome.

Leave a Reply