What Not to Do in Web Design

[splash page for my geocities site]

I first learned how to make HTML web pages by reading the source of websites I commonly visited. Now looking back at some of the webpages I made, I learned some pretty bad habits. If you instead want to learn good html coding, Web Platform Docs is a good place to start.

First of all, do not leave the name your files “Untitled”, or worst, naming them with unhelpful names like “thing”, “stuff”, “New Document(2)”, “unsorted”, or “egldqynpx”. Years after when you eventually go back to these untitled files, you will not be able to tell what's in these files. Can you tell what the difference between files “untitled_1” and “untitled_2” in a folder named “New Folder(5)” is? You will spend so much time opening every file to just to preview the contents. You might even depend on fragile file system sorting, like Mac file positioning or time stamps, that may be lost as the files are transferred from one hard drive to another.

Do not use h1-h6 tags merely for font size. They are critical for document outlines. I doubt you mean that the entire blog post is actually a header. If you need to explicitly set the font size like a broken WYSIWYG editor, then type something like <p style="font-size:1.5em; font-weight: bold;">this</p>. For a similar reason, don't use tables as a flexing layout tool. Tables are for the kind data that you can paste into a spreadsheet program. The fact that there can be nested block text (and more tables) inside a table cell is beyond me.

Never assume that adding a name attribute to html element will make it a global javascript variable. That was bad behavior in IE6. The proper legacy way to deal with named form and image elements are document.forms["form_name"].elements.["element_name"], and document.images["image_name"]. Still, there's better javascript practices then that such as document.getElementById("element_id").

Then there are general atheistic and media format issues such as; splash pages that ask for DSL or Dial-Up, being written for specific browsers, blink and marquee tags, random MIDI music, dithered GIF images instead of clean PNG ones, images that should be text, and using flash especially for the whole page.