101 Common Web Site Design Mistakes
Posted on 20. Apr, 2009 by Julius.
A lot of people are nowadays starting a new web site, may it just be personal blog or your own ecommerce site. With a growing number of web page we also see a growing number of web site designs.
The main stream of web sites are flawed with mistakes that are easily avoidable. Here is a list of what I found the most important mistakes made by web designers:
- Do Not Sign up Users for Something (newsletters) Without Their Consent
- Create Scannable Text: This is important for readers who do not have time to read your whole article. By using headlines, images, and making part of the text bold and italic the visitor will have an easier time recognizing the important aspects of your article.
- Test the Design
- Avoid Tiny Font
- Text Should be Easy to Read
- Clear Hierarchy: Make important things big and let them stand out. Unimportant aspects of the web site should be rather small.
- Do Not Open Links in a New Window
- Avoid Using Browser-Specific CSS
- Visitors Should Know What Your Web Site is About Within Seconds of Visiting it
- Good Search Function: Most of the default search functions suck, for example WordPress’s search does. Go ahead and implement a better search algorithm as this will also increase your page views.
- Do Not Use Animated GIFs
- Create Easy to Use Navigation
- Do Not Use Java
- No Pop Ups: Pop ups distract users from your content. Poeple do not visit your web site to see pop ups but to see actual content.
- Include a Search Box: Users are so used to searching since the evolution of search engines that they will look for a search function on your site.
- Use an Uncluttered Design
- Do Not Use Too Many Pictures
- Leave Enough White Space
- Do Not Use Meaningless Flash Animations
- Avoid PDF files: Because most browsers require extra software for viewing PDF files, they are generally seen as breaking the user flow. Therefore whenever you have the opportunity mind using PDFs.
- Change the Color of Visited Links
- Make Links Stand out
- Do Not Reinvent Navigation
- Do Not Change the Look and Feel of Every Page
- Loading Pages Fast: This aspect is important as people will be happier if your web site loads faster. Search engines also use it to calculate your ranking.
- Horizontal Scrolling: Having to scroll to the right or left to view more content is not helpful to your fellow visitors.
- Do Not Bury Essential Information Too Deep in the Website
- Use a Unique design
- Do Not Play Music Automatically
- Do Not Write Your Website for Search Engines
- Use Descriptive URLs: Instead of using a URL like http://yourwebsite.com/?p=105 , go ahead and change it to http://yourwebsite.com/article-about-blogging
- Do Not Use Frontpage
- Do Not Link to Banned Web Sites: Linking to banned web sites will be punished by search engines.
- Do Not Violate Design Conventions
- Avoid Website Stats Counter: Why should every visitor be interested in seeing how many people visited your web site? Only advertisers are interested in such things, so just go ahead and create an advertise page instead of using stats counter.
- Do Not Disable Right Click
- Use Valid CSS
- Avoid Splitting Content Into Too Many Pages
- Avoid Using Free Web Hosting
- Do Not Use Shockwave
- Avoid Spelling and Grammar Mistakes: This is probably one of the most embarrassing and easy to avoid mistakes there is in web design.
- Use Valid HTML
- Use a Consistent Layout
- Use Image’s alt and Link’s title Attribute: Alt image attributes are required for the <img> tag, therefore go ahead and use it, otherwise you will end up with invalid HTML. Title and alt attributes are also great for search engine optimization so make sure you use some keywords.
- Do Not Disable the Selection of Text
- Do Not Use Frames
- Avoid Using Free Email Addresses
- Do Not Use Director
- Do Not Put Ads in Your Articles: Advertisement distract users while they are trying to read your content. Make ads stand out at least in articles so visitors know what ads are and what the content.
- Avoid Using Big Pictures for Thumbnails
- Do Not Use Too High Contrast Text Colors
- Do Not Include White Spaces within File Names
- Set a Body Background Color: The reason for this is that not everyone uses white in his browser as the default background color.
- Do Not Center Everything
- Avoid Using Non-Standard Fonts
- Avoid Using Bad Quality Pictures: Sometimes it might make sense to use a picture with a bad quality but most of the time it’s better to use a quality picture and just decrease the image’s size.
- Ask People For Their Opinion about Your Design
- Avoid Using Captchas for Posting Comments
- Do Not Use the Wrong DOCTYPE
- Avoid Browser Sniffing: Trying to attempt to detect the visitors browser and then loading browser specific code is not a good web design practice. It is easier if you just make sure that you create code that looks the same in every browser.
- Do Not Place Full-Screen Ads on Your Web Site
- Avoid Heavy Javascript Dependency
- Do Not Use Images Instead of Text
- Do Not Use Old School HTML such as <font>
- Encode Ampersands & and Other Special Characters
- Do not Require Registration for Comments: Why should people sign up at your web site just to post a comment? A comment is a favor in the visitor’s eye because he is actually investing time, therefore make it easy to comment.
- Do Not Use High Tech Tricks or Scripts on Your Website
- Do Not Use “Under Construction” Signs
- Differentiate Between Visited and Unvisited Links: Your visitors will get confused if you don’t make it obvious which links they have visited and which they haven’t.
- Make Obvious What is Clickable
- Avoid Using Complex Backgrounds Behind Text
- Always Link Back to Your Homepage
- Enough Line Spacing: Nothing is worse than having one line under another without any space in between.
- Avoid Big Forms
- Do Not Make Fields Mandatory Unless They Truly Are
- Support Autofill for Forms
- Provide Contact Information: Contact Information is essential but some people do not think about it. I am astonished myself when I see how many people use the About and Contact page.
- Do Not Use Complex URLs
- Do Not Type All Text in CAPS
- Always Keep Your Visitors in Mind
- Avoid Useless Plug-ins, especially with WordPress: WordPress is a great blogging software but it becomes somewhat heavy when you use a lot of plug-ins. Go ahead and get rid of some, I am sure you can.
- Avoid Starting Title Lines With “Welcome to…”
- Do Not Use the Same Title for Every Page
- Do Not Program the Web Site to Refresh after a Certain Period of Time
- Create Contrast on Your Web Site
- Use HTML and CSS instead of Javascript: There are often times when people think they need to use Javascript. But do you really? Usually there is also a way around which might even improve your users experience because the site still works even if Javascript is turned off.
- Provide Means to Receive Feedback
- Do Not Use Footer-Only Navigation
- Do Not Show Errors to Readers
- Do Not Use the language Attribute in Script Elements <script language=”Javascript 1.1″>…</script>
- Avoid Long Scrolling Pages
- Move Important Things to the Top of the Web Site: Most of the designers usually get it right automatically but some don’t. For example do not put your navigation in the footer of a web site, the navigation is almost the most important part of the web page.
- Avoid Invisible Text
- Do Not Ignore Web Standards
- Avoid Using Jargon or Highly Technical Language
- Do Not Start Videos Automatically: There is a reason for why popular web sites such as Youtube do not start videos automatically, it is rather distracting and users might also miss some of the video’s content while scrolling to it.
- Design Web sites that Are Easy to Customize
- Do Not Promote Yourself Overly
- Use CSS instead of Images when Possible: This is especially important for template and theme designers as there is a way to avoid pictures in your template, at least most of the time.
- Always Link Web Site Logos back to the Homepage
- Do Not Use Fixed CSS Elements: I often find fixed CSS elements very distracting even if they are small. Therefore if you can then try to avoid them.
What would you like to add to the list? What do you think is important?
References and Further Reading:
Related posts:23 Responses to “101 Common Web Site Design Mistakes”
Leave a Reply
About And Break!
Hi, I'm Julius. I first started blogging over two years ago and it's been a rough ride, yet I made it. On And Break I hope to provide you with information that will make your ride more smooth.
Learn more about Julius
Denver Web Designer
21. Apr, 2009
I think the biggest mistake web designers make is not understanding the website’s audience and goals. Regardless of design technique, website designers must make websites that satisfy the needs of the audience and convert on the website owner’s goals.
jules
21. Apr, 2009
your point is very true, there are a lot of web designers who do not get to know the owner of a web site and thus do not know his goals. This ultimately does lead to a web site that is not in line with the owner’s needs.
HOBO(nickname)
22. Apr, 2009
Excellent post though I havent read full but yes, it is useful for makers.
jules
22. Apr, 2009
@Jansi – I am always glad if I can help people.
@Hobo – yeah the post is pretty long but I think you should be able to scan through it in a few minutes.
jansi
22. Apr, 2009
hi!.. thanks for the comment.. its a very interesting website…..
Secret service weapons
04. May, 2009
I made a mistake on another post and many people didn’t get the question. I just wanted to know what risk do I have to take if I’m going as a freelance web and graphic designer. What should I do as a freelancer? Do I charge everything and should I meet my clients in person to get some payment to make sure they are real and not fake orders?
jules
04. May, 2009
Everyone makes mistakes, it’s the way we humans learn. Just admit to your mistake and people won’t be mad about it.
If you want to become a freelancer you of course have to know what you are doing or writing about. You need an expertise in a certain topic.
What should you do as a freelancer? Well it depends, as you said you could create content for other people and earn money through that. But you could also offer a service such as logo design. It really depends on what you would like to do.
I wouldn’t be too picky about the price and charging every minute you spent working on something. Why not set a fix price for a logo design or an article?
Meeting clients in person will be very hard when you get orders through the Internet, it also would add to your price, which the client has to pay.
One way to ensure that you are getting paid is to charge the money upfront so you do not have the issue with fake orders.
Blogger Tips And Tricks
28. Oct, 2009
Very very good article.Thank you.
jules
20. Nov, 2009
thank you. I am glad you like it
Feel free to visit again!
Online Marketing Agency
16. Dec, 2009
I think you need to add being lazy and avoiding testing your site with multiple browsers and multiple operating systems. Not everyone is cursed to a windows box.
jules
16. Dec, 2009
Yeah you are right. Testing is really important. Thanks for the tip.
hrh
17. Feb, 2010
Terrific post. We used it as sort of a test for our website and came up pretty good.
A few specific questions/comments:
—> 7 Do Not Open Links in a New Window
Agree for the website as a whole, but have always been taught that you do want links in a new window for links outside of your site. Your thoughts?
—> 20 Avoid PDF files:
This one I rather disagree with. I don’t think websites should have a whole lot of pdf files, but almost everyone I know had Adobe Acrobat.
—> 36 Do Not Disable Right Click
Agree, however we have right click disabled because we write our own content and have found our text and graphics on other websites. We know this isn’t fullproof even if the right click is disabled, but it sure does cut down on others taking our content and graphics. Other ideas of how to protect our property?
—> 91 Avoid Long Scrolling Pages
Get what you mean here but seems to contradict #38 (Avoid Splitting Content Into Too Many Pages). Most polls we’ve had say viewers wouled rather have a long scrolling page rather than clicking multiple pages for the same content.
Appreciate your blog. Keep up the good work!
jules
17. Feb, 2010
Well you mentioned some very good points there.
Do not Open Links in a New Window – It’s partly true. Of course there are a lot of web sites that do open links in a new window. For example with advertisement I would encourage it to open in a new window. But in the content itself I actually wouldn’t. People are already so used to being able to open up a link in a new tab themselves that it’s no longer a necessity to open links in a new window.
Avoid PDF Files – Well the reason for mentioning it is that it completely ruins the flow of interaction. Most browsers do have PDF readers built-in so it’s not such a big issue anymore. But I wouldn’t encourage people to pack their articles in PDF files instead of directly posting them on a blog. You know what I mean?
Do Not Disable Right Click – What is your web site about? I mean sometimes it is useful to disable it but seriously just disabling it in order to keep readers from copying it is in my opinion a wasted opportunity. Instead you could encourage them to spread your content (they would of course need to link to your article and web site). This would give you the added benefit of a far bigger backlink structure, which in turn would cause you to get more traffic.
Avoid Long Scrolling Pages – You are right it does contradict #38. What I simply wanted to say is that if your content is too long you might be able to seperate it into two different posts. I actually love long articles and I personally hate web sites that split the content into too many pages. All I am saying is that you need to find a balance.
I hope this helped and I am glad you enjoyed the content of my blog.
Nuno Barreto
02. Mar, 2010
Very good advice!
Tomorrow I will check all the points and compare them with my website.
Thanks!
jules
03. Mar, 2010
I hope you will. I’d love to see you here again.
James King
11. Mar, 2010
Who uses Director? I haven’t used that since 2003, I was trained to use Director in CD-ROM production, but we all use Flash now.
Do you have a background in web design as well?
jules
12. Mar, 2010
To be honest James I don’t. But I am doing some web design for some friends of mine but it’s not really that good. Just the basics. You are into web design right?
I have actually never used Director. But since you are an expert in web design what would you change about this blog? All the stuff I have changed was done manually
James King
15. Mar, 2010
Hi Jules,
I like your blog. Its simple, easy to use and not over to top.
There are things I wouldn’t change but only add to.
This gives me an idea for a blog post.
jules
15. Mar, 2010
I love blogging and conversations simply because they always give you ideas of what you could write about soon
What would you add James? What could I change?
James King
15. Mar, 2010
I will write a blog post on my blog that is suited to you and other bloggers on how to improve their blog.
Because it will be a useful resource for all bloggers. Plus it is good to share.
jules
16. Mar, 2010
Alright, I will check your blog soon
I am excited to see what you have come up with 
Brandon Connell
06. Jun, 2010
#1 really bugged me last week. It wasn’t really a newsletter though. They signed a petition using my email address. The worst part was that I totally disagreed with what the petition was based on. This resulted in me reporting them to authorities.
Julius
07. Jun, 2010
I would be totally pissed if that would have happened to me. I mean how can you sign up someone for things that he doesn’t even support. Did you get your name deleted from that petition?
Nice blog btw. and thanks for the comment Brandon.