We’ve all done it, at one point or another. Out of ignorance or out of a need to hurry up and get a page published, questionable design choices slip out onto the Internet.
Most of what I’m going to reference in this article is stuff I’ve done knowingly and willingly, either because I didn’t know any better or because I thought it “looked cool.” (Animated GIFs…oh, so very cool. *cough cough cough*) In either case, I didn’t research my design choices well enough; I should have been going to other people’s websites to see what they were doing, or at least reading web design articles to find out best practices.
To best show off these problematic design choices, I decided to combine them all in a terrific cacophony of web design. I call it…the “Really Bad Page.”. Click the link, and try not to wail with despair.
The Bad Page’s Features
“Times New Roman” font style
Times New Roman, especially in this web 2.0 age, is very “default” and uninteresting on a webpage, since it is the default font when no font is specified in a CSS style. This makes the website look uncared for and un-updated.
All centered text
Centered text does not always “balance out” how your text looks. In this case and in many others I’ve seen across the internet, centered text is just hard to read and looks awkward on the page.
Thick borders around your tables
I used to love how thick-bordered tables looked on a page…but then again, that was back in 2001. 😛 The bordered table might be okay for true tabular data, but not for random information; it now just looks junky.
Animated GIFs (especially for an “Email Me” link)
Animated anything on a page these days tends to make your page look too young and kiddy. It can really de-professionalize a look. (If that ain’t a word yet, I’m making it one, because it works. 😛 )
No padding/margins in your divs
See how the table runs right up against the links? This is caused by no padding or margins used in the divs. Everything within the div expands out as far as it can go, and when there’s no padding there, it just makes your content look messy and harder to read.
Narrow left-aligned layout
Most users are used to seeing wide center-aligned layouts nowadays–itty-bitty left-aligned layouts are a visual shock, and may not display well on larger-resolution monitors (i.e., they will look too small).
Too much white used in the background
I’ve been guilty of this from time to time, but using white as a background color can look too “empty” if there’s not a lot of content on the page, like my sample page.
A JPG, or any image, that’s of this low quality looks unprofessional and makes it hard to tell what the picture’s subject even is. See other examples of low-quality JPGs on SixRevisions, Ransen.com, and PanoHelp.com.
Too-wordy link descriptions
Who wants to click on a link that takes several lines to describe? When you have a lot of words in your link text, it makes it look very messy and unkempt.
2-dimensional and square design
A website isn’t printed on paper, but this design looks like it could be printed out very easily. There’s very little visual interest at all, and no deviation from the invisible straight-sided square/rectangle box.
Next Week: Turning the Look from Newbie to Pro
Next week, we’ll be looking at 10 ways to make your page look professional. Never be tormented by centered Times New Roman text again! 😛