» Common Traits of Bad Web Design :: Positive Space Blog

Lately I have been writing a number of articles that I would consider to be more critical thinking based, so I thought that it may be interesting to do more of an opinion piece. In the past the article I wrote about bad blog design was successful, so I felt covering web design in general could be helpful as well. It is important to note that in this article I am referring to “web design” as the whole process of creating a site, not just the visual aspect.

10. Liquid Content Columns

Liquid content columns rarely work without setting minimum and maximum widths. Unfortunately it seems that most times in which a site spans to fit the available space results in extremely long lines of type and proportionally small images.

9. Re-listing Every Page in the Footer

This may be a way to help search engine crawlers find their way around your site, however there are other ways that aren’t so cluttered and ugly. A sitemap page is a great alternative that only takes one link in the footer. If you are doing this because you have a flash navigation or JavaScript based navigation then see #5.

8. Repeating Navigational Elements

No doubt you have seen this before. Instead of taking the time to do proper site planning and information architecture, the navigation is a mix of extremely long sub pages or pages found in multiple places in the navigation. Both of these scenarios lead to navigation systems that are confusing for users and near impossible to make sense of.

7. Not Styling Form Elements

Form elements are some of the hardest things to style consistently across browsers. Learning how to design forms within the constraints of the browser goes a long way towards maintaining a consistent user experience. Plus, nothing stands out more than the default look of plain submit buttons in a well thought out design.

6. Using Images for Large Blocks of Text

Knowing how to design around the typographic limitations of the web is something that takes experience and experimentation to do effectively. Using images for large areas of text in order to utilize different fonts should not be done because of the negative effects it has on SEO and accessibility issues.

5. A Non Degradable Navigation

If your navigation requires JavaScript to work, or is flash based it must degrade to plain html to ensure that users without these technologies can still navigate the site, and search engines can follow your links. If you must use flash for navigational elements, make sure that you use JavaScipt to place it on the page and that plain links are replaced by it.

4. Pointless Flash Intros

There isn’t really much to say about this. Its 2008, forget the Flash intro its lame and is generally accepted as a way to negatively impact search rankings.

3. Poor Contrast Between Background Textures/Graphics and Type

Print is a wonderful world where contrast never changes, once a piece is printed that is the final result. On the web differences in monitors mean variations in contrast. If type is not substantially separated from its background, legibility can become a serious issue.

2. Not Designing for Vertical Expansion

This is one of my personal most hated bad web design decisions. This problem can surface in a number of ways such as an iframe, columns that appear like they should be the same length but aren’t, or just plain broken column structures. This problem is one of the worst because it portrays the fact that the designer does not have a full understanding of how to design for the web.

1. Bad Typography

Unfortunately the web has a number of technical reasons why creating rock solid typography can become an issue. Often times little thought is given to the subtle details such as proper leading, type “color,” or line length (See #10). This lack of detail, and the difficulty involved with setting up a consistent baseline can lead to sites that have just plain sloppy type.

There are plenty more, but these are some of the bad web design decisions that really bug me. If you have some that drive you nuts, why not share them in the comments below?

09/28

ADD A COMMENT

31 Comments

Share This Page: Stumble It! // Del.icio.us // Float It! // Digg It! // Reddit

31 Responses to “Common Traits of Bad Web Design”

target ict
September 29th, 2008 at 3:08 am

good article, agreed that pointless flash intros get overused
Richard, Peacock Carter
September 29th, 2008 at 4:55 am

Similar to #3, I’ve noticed quite a few designers who will set a background image in a div, and a fore-colour, but not bother with a background colour, meaning text often has no contrast if the image doesn’t load.
Phil Thompson
September 29th, 2008 at 5:17 am

Agreed on all points.

#2 drives me insane.
Harry Roberts
September 29th, 2008 at 5:24 am

My current #1 ‘bad trait’ is sites that can be reached though http://www.site.com, but not through site.com. I *never* type http://www. before a URL because you shouldn’t need to.
elcodigodebarras
September 29th, 2008 at 7:27 am

Agreed with your post completly.
Now in the internet 2.0 you got 15 seconds for keeping the visitor interest…15 seconds…
Splash pages, typographic with no contrast colors, long inneccesary scrolls, No 404 error pages…
60Four
September 29th, 2008 at 7:57 am

Number 7 is somewhat suspect. Those “plain submit buttons” are what users typically expect to see. Customizing form controls (esp. buttons) is fine, so long as it’s very clear that they ARE those controls. Otherwise you have a usability problem.
Tim
September 29th, 2008 at 9:03 am

Agree we 60Four. Also - Did you notice that you are using a “plain” submit button for your comments?
Murphy
September 29th, 2008 at 9:54 am

I agree with all of them except #9. I was initially skeptical of its use in practice until I tried it on my employers’s corporate site, and saw the click-maps. LOTS of people used them. I’d call that worth having. Furthermore, it’s not much different than the links you’ve got listed below. They’re simply more contextual.
Zinni
September 29th, 2008 at 10:39 am

Tim,

I have a long list of updates I have been collecting for this site, and believe me changing the styles of the submit buttons is one of them. I originally thought that they were close enough to the color palette of the site to use, but I have since changed my mind.

I think it is possible to change the appearance of form buttons, but agree that care should be taken to make sure they still appear as buttons.

Thanks for all your great comments guys!
Sizzle Creative Manchester
September 29th, 2008 at 11:04 am

Long flash intro’s drive me crazy.
Drahony
September 30th, 2008 at 3:46 am

I agree, Typography is so often forgotten about in web design. So few take notice of its impact on their visitors and the experience it provide. Reading is ment to be a pleasure not a nightmare.
Integritylance - Freelance
September 30th, 2008 at 12:34 pm

If people are using flash, I think it should be used like Salt.. a little goes a long way.
Jin
September 30th, 2008 at 3:27 pm

Flash has its place. There are online user experiences can’t be achieved by mere html/css.

As for flash intro, I think it’s appropriate for artists’ site to set a tone and mood. Of course a “skip intro” link should be available.

Jin’s latest post: Findings 9.26.08
Sam
October 1st, 2008 at 7:55 am

it’s debatable, but using tables?
Andrew Kelsall
October 1st, 2008 at 9:01 am

Like Jin said, I suppose flash DOES have its place, but personally, I detest flash sites. If I see some suped-up flash intro, I just close the tab, Period.

Over the years searching the web, I’ve developed quite an aversion to flash sites. Many flash developers insist on including animations where they’re not needed, and slow, sluggish navigaion-nightmare sites…
Matt
October 1st, 2008 at 2:32 pm

Nice little list, and I agree with almost all of them, except really #7. If form styles are the sites only concern then they are doing good by me. I would say it is much more important to have valid content than anything else. You can have the neatest looking design going, but if it doesn’t validate…what is the point?

Matt’s latest post: Web Standards can make you rich!
Doug S.
October 1st, 2008 at 3:50 pm

Most of these I agree with to some degree, even though I think some of them have exceptions.

But #9 is one I completely disagree with. Apple’s website has one that is fantastic and extremely useful, for instance. It’s a practice that is actually growing more and more prevalent as time goes on because more than just helping site crawlers it helps users quickly navigate a large website.
Richard
October 2nd, 2008 at 7:48 am

A good list, but I completely disagree with 7 and 6.

7: Form input controls are UI specific, if you’re using windows they should look like windows input, mac likewise. I’ve seen too many websites that yes look good, but are completely unusable for the majority of visitors because they dont know what to do, or how to do it.

6: If a font isnt widespread whats wrong with using a [h2] and display: none; background: …;
Zinni
October 2nd, 2008 at 9:43 am

Richard,

in #6 I am referring to paragraphs of text, not headings. What you are describing is an acceptable practice, however I would not use display: none; it is considered better practice to use a negative text-indent to hide the text. Some screen reader technologies cannot interpret the display: none; text…
Bill Biwer
October 3rd, 2008 at 11:15 am

Wonderful post. Gotta love the clients who’s pushing the 60 second movie intro to their website.
Sam
October 13th, 2008 at 12:32 am

I saw a few examples of these things on suckdesign.com.
Svetainiu kurimas
October 15th, 2008 at 2:37 pm

Over the years searching the web, I’ve developed quite an aversion to flash sites. Many flash developers insist on including animations where they’re not needed, and slow, sluggish navigaion-nightmare sites…

br

svetainiu kurimas
shawn
October 25th, 2008 at 7:23 am

this site made me hate my citizenship http://www.pinoyexchange.com/

can someone enumerate the bad design practices used in this site?