Seven Deadly Sins of HTML
Submitted by Syscrusher on Mon, 2005/06/06 - 23:51.
I've helped a number of people learn to write HTML, and over the years I've seen that most people make the same mistakes -- in design or in coding. Here's my "top seven" list of what I consider to be the worst habits.
- Treating the Web like paper. When you publish on paper, you create a
master version of your document and then precisely replicate it for publication. No one
can change the look and feel of your documents. But a web browser can be any size, any
shape, and style, and the best you can hope for is to control the basic structure and flow
of your document. If you try to manage precise page positions, you will only end up a
frustrated author with web pages that don't work well on many people's browsers.
- Forgetting that your web site is not your hard disk. Did you ever visit
a site that seems to have a lot of dead links, even to its own pages? Have you seen pages
where none of the images seem to load? In many cases, the problem is that the
author used absolute links for his or her PC's hard disk. It is actually possible to put
things like <a href="C:\myfiles\mydoc.html"> into your HTML code. But the
link is seen by your guest's browser as pointing to their C: drive, not to yours!
Your guest isn't using your PC, so as far as he or she is concerned that file does not
exist. Your pages appear to work fine on your own computer, but every one of them fails on
the web.
- Breaking copyright law. Just because you find something on the Internet
doesn't mean that you can use it without permission. Be especially careful of corporate
logos, artwork, and photographs. Even if you say something nice about a company's product,
they will not take kindly to your inclusion of their logo on your pages because you are
not licensed to use their identity.
- Trying to use HTML to create image thumbnails. If you want a small
version of a photograph, which is a clickable link to the full-size image, you need to
create these two files separately on the server. Using the width and height
attributes of the <img> tag causes the full-sized image to be downloaded to the
browser and then scaled to fit. If you have twenty of these on a page, no one
with a modem connection will ever wait for your page to finish loading.
- Using a 1x1 pixel image to make a solid background color. Oh, the agony
of it! Normally a tiled background consists of an image of (for example) 20x20 or 40x40
pixels, or something like that. So the browser takes these 400 or 1600 pixels and uses the
display hardware to replicate them across and down the page. But each replication takes a
little bit of work by the computer. The 40x40 example might take four or five hundred
operations on a typical screen -- not a big deal for today's fast hardware. But if you
want a solid color and use a single-pixel image to achieve it, the computer has to stop
and draw that tiny image once for every pixel on the screen. Instead of five hundred
operations you have over a million on some high-resolution screens! I saw this done on a
corporate web site one time and the background color took over 30 seconds to draw on a
fairly fast computer. Ouch! Instead of this atrocity, why not just specify the desired
color in the bgcolor attribute of the <body> tag?
- Improperly nesting tags. If you begin tag one and then begin tag two,
you must end tag two before you end tag one. In other words, the inner tag must be
completely within the outer tag. This applies to all tags, no matter how deeply they are
nested tag within tag within tag. If you break this rule, your page is extremely likely to
have problems, at least on some browsers.
- Terminally cute or ever-so-artistic pages. Unless you are running an
art gallery, graphic arts consulting firm, or children's web site, use some restraint with
your colors and images. Is it more important to you to make "a statement" that
you are chic and cool, or is it more important that your guests learn the topic you are
teaching, agree with your political views, or purchase your product? Those fancy pages
with huge images also take a long time to download, and you won't "make a
statement" if no one has the patience to wait for your page. You don't have to give
up your creativity to make a good web site, but don't hit people over the head with it.
|