Welcome to The HTML Hell Page
"Hell is other websmiths." — Jean-Paul Sartre,
updated
You Know You're In Design Hell When You
See...
- blinking text
- Blinking text makes it nearly impossible to pay attention to
anything else on the page. It reduces 87% of all surfers to a helpless
state of fixated brain-lock, much like that of a rabbit caught in the
headlights of an oncoming semi. This is not good. If you abuse the
blink tag, you deserve to be shot. Clue: if you use the
blink tag, you're abusing it. (User Friendly has an apposite
comment on this.)
- gratuitous animation
- With animations you get all the wonderful injuries of the
blink tag with the added insult of the graphics download time.
People who abuse these should have flip books rammed into every
bodily orifice until they figure out that a two- or three-frame
graphics loop is even less pleasant than that.
- marquees
- So, maybe you think the blink tag and cheesy animations are the
worst abuse half-bright websmiths can perpetrate on your retinas?
Naaahhhhh. For those times when too much is just not enough, the
Great Satan of Redmond has given us <MARQUEE>, which allows
you to create animated scrolling marquees at the drop of an angle
bracket. This bastard cousin of the blink tag can cause vertigo and
seizures in susceptible individuals, reducing them to exactly that
state of drooling lobotomized idiocy that's such an essential
prerequisite to purchasing Microsoft products. Coincidence? We
think not.
- garish backgrounds
- The very next time we stumble across a page composed by
somebody who thinks it's cool to use leaping flames or a big moire
pattern or seven shades of hot pink swirly as a background, we
swear we are going to reach right through the screen and rip out
that festering puke's throat. If there's a worse promoter of
eyestrain and migraines than the blink tag, this is it.
- unreadable text/background combinations
- The world is full of clowns who think their text pages look
better in clown makeup, clashing colors galore (your typical
garish-background idiot also pulls this one a lot). The magic words
these losers need to learn are "luminance contrast". Your color
sense is between you and the Gods of Bad Taste, but if you don't
stick to either light text on dark backgrounds or the reverse, you
will drive away surfers who like to be able to read without
suffering eye-burn.
- brushscript headings
- Brushscript headings are rude. Unless, that is, you think every
single surfer hitting your page truly craves the opportunity to
hang out long enough to watch toenails grow while a brushscript GIF
downloads just to display a heading you could have uttered in a
nice, tasteful, fast font.
- "Best viewed with..."
- Ah, yes, "Best viewed with..." — surest sign of an
incompetent web designer (unless it's one of the parody buttons from
the Viewable with Any
Browser campaign). This kind of lameness is not just bad taste, it
makes the site actually unusable for the large numbers of surfers who
happen to be using something other than the designer's favorite
browser. Unfortunately, the sort of people who do "Best viewed
with..." is also usually way too stupid to get the point if you try to
explain that HTML is supposed to be about device-independence —
so pull them by the guilt-strings and point out that blind people surf
too. If that doesn't work, club them to death with a chair leg or
something. No court would convict.
- "resize your browser to..." instructions
- Right. As if we wanted our browsers to take up that big a chunk
of screen real estate. But what's really annoying is that
invariably these bozos get it wrong. Like, their browser has an
8-pixel offset, ours eats 20, and they forgot to allow for scroll
bars so they're off by at least 30 pixels anyway and the display
graphics are complete garbage.
- large fixed-size tables
- This one is often brought to you by the same idiots who so love
"resize your browser to..." instructions. Hello? Hello? Would
somebody explain to me how it escapes these people that the world
is inhabited by lots of people with different sized
displays, and that tables flow for a reason? Sigh...
- unnecessary border spacing
- In this particularly moronic variant of large fixed-size
tables, the designer puts the entire web page in a table
and pads the edges with empty columns of a fixed width. Duh. This
is a sure sign that he or she is one of those pathetic
desktop-publishing weenies who thinks HTML is a page description
language. Hanging's too good for them...
- Pointless use of <small> or <font
size=>
- If we wanted our text to be unreadably tiny, we'd have told our
browser to display it that way. This one mugs viewers with 20" and 21"
screens particularly hard; since most fonts are scaled for 72dpi
they're already 30% smaller than they ought to be at 100dpi. Anybody
who use these tags for running text should be compressed by 30%
themselves, slowly, and preferably in a machine with big nasty
spikes.
- masturbation with Javascript
- There is a large class of Javascript annoyances perpetrated by
people whose ability to do cutting and pasting exceeds their
negligible sense of taste. Of these, one of the most common is the
script that scrolls text in the Netscape status line. To all the
disadvantages of <MARQUEE> this one adds the fact that you
can't see where links go any more. Better than that, pages with 25K
of Javascript followed by < 5K of actual content; these pages,
of course, are invariably hosted on slow servers so you can
experience the pleasure of waiting for Javascript to load just so
you can see a cutesy animated menu bar or something equivalently
useless. In general, any page whose source has more Javascript than
content should be sent to the recycle bin.
- unnecessary use of Java
- There is one thing worse than your average garden-variety idiot
web designer, and that is the half-clever idiot who loves to ring
in all the latest technology without stopping to think about its
side-effects. One notorious Fortune 100 website, when it detects a
Netscape browser, assumes you must be able to support a fancy Java
search applet — and if you have Java turned off for security
reasons, you can't search the site, because the perfectly adequate
CGI search you'd get if you were using Lynx has been disabled.
Moral: Keep It Simple, Stupid!
- pop-up windows
- Some particularly irritating designers have discovered the
magic formula that causes your browser to spawn a new window when
you click on a link — or worse, ways to make pop-up windows appear
even if all you're trying to do is exit their wretched hive of
scum and villainy as rapidly as you can find the Back button. Stay
in your own window, dammit! The Web is supposed to be about
viewer control; designers who persist in rudely grabbing
pieces of the viewer's screenspace without permission deserve to be
lashed with knouts.
- menus made entirely from image maps
- Clue: lots of people use text-only browsers like lynx, either
because they want to (for speed) or because they have to (visual
impairment, or lack of a graphics display). An entire page that
shows up only as "[ISMAP]-[IMAGE]" is useless. Designers who can't
be bothered to at least provide a link to an alternate text menu
are, at the very least, guilty of laziness and thoughtlessness.
Huge image-maps are bad even for graphical browsers; they're
slow-loading and needlessly frustrate users. And a frustrated user
is a gone user.
- sound and video that launches without prompting
- About those embedded videos that just suddenly start playing
by default, without bothering to ask you if you want them to
be played? No. If you have ads on your site, fine, but if my loudspeakers
suddenly start yelling about how I can win a ONE THOUSAND DOLLAR GIFT
CARD if I just TAKE THIS SURVEY NOW you can take it to the bank that I
would sooner lick sores at a leper colony than answer your survey or
ever do any business with you. And here's a hint to everyone who runs
porn sites: most people who watch porn do not want the sounds
of people having sex broadcast to everyone within a thirty-foot
radius.
- CSS that sets fixed-size fonts dimensioned in pixels
- This is the idiot web designer's favorite way to make a site unreadable
on a monitor with a finer dot pitch than the one he/she happened to use. Guess
what happens when you set a 10 or 11px font on a 72dpi monitor and it gets
viewed on a 120dpi monitor? That's right, instant eyestrain and another
user cursing your name. This problem is going to get worse as displays
get larger and finer-grained.
- CSS that changes the hotlink colors
- Isn't it fun when you surf to a page and your eyes stall out
trying to figure out which piece of text are hotlinks? That underlined
blue and purple are valuable navigational cues in the Web jungle. If
the page has multi-colored links or links that are not easily
distinguishable, then this is another case where overriding the
browser's settings should be punishable by intimate acquaintance with
a flensing knife.
- Forcing one of background and text colour, but not both.
- Suppose I like my pages to default to green text on a black
background? (Yes, I actually got email from a reader who does this!)
If you set your text colour to black, but don't set the background
color, the site will be unreadable. If you set your background color
to white (or worse still, orange — this has happened too!) but
do not set the text color, I will develop eyestrain and wish a plague
of creeping horrors on you. It is not wise to assume that the viewer
has not fiddled with the default settings on their browser; either set
both colours or neither.
- background MIDI, Flash, Shockwave, and other abominations
- Background music takes forever to load, and isn't portable.
Flash and Shockwave take forever to load, aren't portable, and are
proprietary formats that lock you into a single vendor. When you
insult your viewers with crap like this, don't expect them back.
You Know You're In Content Hell When
You See...
- hit counters
- "You are the 2,317th visitor to this page." Yeah, like we care.
On the search-enabled it takes no effort at all to find
and bounce off every page on the planet with a reference to (say)
credenzas or toe jam. In this brave new world, hit counters are
nothing but a particularly moronic form of ego display, impressing
only the lemming-minded. They may tell you how many people got
suckered into landing on a glitzy splash page, but they won't even
hint how many muttered "losers!" and surfed out again faster than
you can say "mouse click". To add injury to insult, hit counters
screw up page caching, heaping more load on the Internet's
wires.
- guestbooks
- If we have something to say to you, we'll send you mail. Having
a guestbook is lame and only demonstrates that the designer is not
thinking about what happens when you nudge people to write
something, anything. Of course, 95% or more of what guestbooks
collect is inane drivel.
- stale links
- Stale links are lame. People who have lots of stale links are
lamers. OK, everybody has a pointer vaporize on them once in a
while — but haven't you noticed that stale links generally show up
on a page in swarms, like cockroaches? That's because people with
good web pages use them and hack them and fix broken
pointers quickly so they're unlikely to have more than a few at a
time busted. A page with lots of stale links yells "My author is a
lazy, out-of-it loser with the attitude of a slumlord running a
cockroach palace."
- pages forever under construction
- Surfers learn quickly that for every ten "under construction"
signs that go up, maybe two will ever come down before the
heat-death of the Universe. This is stupid. HTML is not rocket
science and prototyping pages is not a slow process. Anybody who
can't find the time to clean the construction signs off their pages
should yank them and take up a hobby better matched to their
abilities, like (say) drooling, or staring at the wall.
You Know You're In Style Hell When You
See...
- pointless vanity pages
- If we had a nickel for every home page we've seen that's a
yawn-inducing variation on "Hi, here's me and here's a cute picture
of my dog/cat/boyfriend/girlfriend" we could retire to Aruba with a
bevy of supermodels tomorrow. Clue: if you don't have
something to say, shut up. And keep it off the Web; life is too
short for boredom.
- angst and pretentiousness
- We were originally going to vent our spleen at black
backgrounds, until we realized that black is not the problem. It's
the three overlapping populations of losers that compose 99% of the
black backgrounds on the Web that are the problem. These are (a)
cooler-than-thou art fags, (b)
angst-ridden adolescents, and (c) the kind of coffeehouse trendoids
who actually believe subscribing to Wired makes them hip.
Clue: angst and pretentiousness are boring.
People who spew bad poetry and/or make a fetish of writing in
all-smalls and/or traffic in fuzzy images of mediocre avant-garde
art should slit their wrists or join a commune or do anything else
that will keep their self-indulgent sludge off the Web.
- corporate logorrhea
- We've all seen them — corporate pages that start by
downloading some monster logo graphic from hell. And after you've
waited a million or three years for it to finish, the rest of the
page has a ton of gush about how wonderful the company is, maybe
some lame-oid promotion that's just a hook to get you on their
mailing list, and no content at all. Tip for marketroids:
this is not effective, unless your goal is to make the
company look like every other moronic me-too outfit that thinks
having a Web address will make it look like it has some semblance
of a clue. Not!
- advertisements from hell
- Don't you love top of the page ads that are changed every time
the page is accessed? If you're jumping back and forth between a
parent page and a child devoted to a subcategory, you get the
dubious pleasure of waiting for a new ad graphic to load each
time!
- no email address for feedback
- These folks want you to look and listen to them, but they don't
want to hear from you. Isn't it interesting that half the Web pages
of Fortune 500 companies, the big names like McDonald's, won't tell
you what their email address is? Shows you just how much these
gutless wonders really value their customers. Another tip
for marketroids: this sort of thing makes your company look exactly
as arrogant, stupid, and indifferent to its customers as it
actually is. Think of an email feedback address as a sort of
necessary disguise.
- cookie storms
- Lots of web users don't want strangers dropping little turds on
their disk drives so they can be tracked, scanned, collated, and
sold. Lots of users therefore set their browsers to query them
before setting a cookie. Lots of users become extremely annoyed at
pages that flood them with cookie requests. Clue: if the user
rejects your first cookie, he doesn't want a second or a
forty-ninth — cope with this gracefully. Any web designer who
fields pages that generate cookie storms should be disemboweled
with a dull pruning knife pour encourager les autres.
You Know You're In Extension Hell When
You See...
- broken HTML
- A lot of broken HTML gets inflicted on the world because it
happens to get past the brain-damaged `parser' of everyone's
favourite bloatware web browser. The designer gets the perversity
prize if he can provoke radically different behaviour in different
browsers or browser versions.
- Microsoft's `smart quotes'
- Another sure sign of Microsoft brain damage — questionmarks
showing up where single or double quotes ought to be. Here?s an
example, doesn?t it look illiterate? Clue: shut off the so-called
"smart quotes" feature in your Microsoft Word, moron. It generates
Microsoft-specific characters that aren't in the Latin-1 character
set; many browsers (rightly) throw up their hands in horror at
this. There is a
cure.
- unstable extensions
- We just love it when our browser freezes while loading a page,
hangs for a while, and then ignominiously coredumps. When this
happens, you can bet money the page is using a Netbloat extension
nobody ever bothered to debug properly (there are a semi-infinite
number of these). The worst offender is undoubtedly...
- frames
- We used to say "frames are for idiots", back when they tanked
most browsers. Bordered frames still are; they eat up precious
screen space with frame widget cruft. We now grudgingly concede
that borderless frames have their uses — but if you do them, do
them right. Frames that can't be bookmarked still suck,
and links that don't replace the whole page when you jump offsite
suck even worse. Use frames with extreme caution.
Improving your web page
"Okay," I hear you saying, "so you've given me good advice on how
not to screw up. Have you got anything more positive to say? Like,
good things to do and how I can improve my page?" For you,
my friend, I have three words. Content, content, and
content. Give the audience a reason to care. Too
many web pages are like tales told by idiots, full of sound and
fury, signifying nothing. Do you want to be interesting? Then
forget the graphics and the glitz. First and foremost, have
something to say.
Suggestions?
Got your own gripe about poor HTML design? Mail it to us!
Please do not write asking me to review or correct
your web page design. I have enough trouble finding time to maintain
my own web pages, let alone other peoples'. You might be able to
change my mind with lots of money, payable in advance.
Thanks
...to Pete Glasscock for inspiring this page, even though he
subsequently disappeared off the Web. ...to Patrick
Campbell-Preston <patrick@chaos.org.uk> for most of the
Extension Hell section. ...to Rob Novak <rnovak@ibm.net> for
"advertisements from hell". Others have contributed to this page
explicitly asking not to be credited.
Other Good Advice
Horrible Examples of bad technique are listed at Web Pages That Suck.
Jakob Nielsen's column Top Ten Mistakes in
Web Design is very good. The Yale Style
Guide is worth reading.