18
Sep
15 Common Web Design Mistakes That You Should Avoid
- Content that’s not written for the web i.e., non-scannable text.
- Page titles with low search engine visibility, think key words in a combination that entices.
- Content that looks like an advertisement or content that is an advertisement, I don’t care which books on Amazon you enjoy, they wouldn’t be listed on your site if you weren’t making affiliate money from them.
- In-your-face advertising i.e., blocks of AdSense that push your real content below the fold/scroll.
- Violating design conventions – see CRAP Design.
- Opening new browser windows. Let the users decide, they will come back if your content is good.
- Non-standard links,
hyperlinks should be underlined, hyperlinks should be obvious, there’s no reason to confuse novice users. Alsostrikethroughis being used to indicate a visited link – this is silly and should be avoided as it can be easily confused with corrections which is what strikethrough should be use for. - Over using Flash, Flash requires a plug-in, don’t use it unless it actually provides functionality which you cannot gain through other means.
- Browser incompatibility, check what your pages look like on other browsers.
- Scrolling text, marquees, and constantly running animations.
- Complex URLs, they are not good for search engine hits or usability. Avoid.
- Long scrolling pages, break it up, use excerpts if you have to.
- Poor navigation. Try and find some old content on your site. Is it easy?
- Overly long download times. Use Photoshop or other applications to optimize images for the net. Read points 12 and 8 again.
- Too many animations. They are hard on the eye. If you must use them, use for emphasis.
Even in an ever changing environment, such as the net, you must always consider the user experience before and above everything else.
Tags: Lists, Mistakes, Tips, Web Design
Simon Ward
I created pingable back in 2007. Still loving blogging about Wordpress. Read more about me here. Connect with me via my Google Plus.
Comments (48)
Thanks for the tips!
They’re great!
I agree with them all but 12. It really bugs me when I go to a site to read an article and have to go through more than one page to get it all. Newspaper sites are particularly notorious for this. Always makes me think they’re just trying to get more ads in front of me.
Of course, absurdly long scrolling pages are bad, too. There is a happy medium.
Hi Niall – I agree with what you are saying, I guess I was aiming mostly at those absurdly long pages…i.e. blog front pages that have 15-20 recent posts in full, and a minute after landing on the site the page is still loading. Thanks for the input.
Thanks for the reply, Simon. It’s all about the context, I guess.
Great site by the way, I’ll be checking back often.
All good tips; but I have to point this out:
7. Non-standard links, hyperlinks should be underlined, there’s no reason to confuse novice users.
Interesting that a site which does not underline its links would point this out.
Very good point Brian, they do underline on mouse over and I think it is still clear that they are hyperlinks…but kind of a slip up on my part…the intent of that point is the suggest that it should be clear what words are hyperlinks, and I think it is clear which words are hyperlinks. Thanks for the comment.
Oh you’re absolutely correct–links are quite obvious on this site–I just had to point out that little nugget of irony.
“hyperlinks should be underlined”
This web site’s hyperlinks are not underlined.
It is very ironic.
“Content that’s not written for the web i.e., non-scannable text.”
That depends on the purpose of the text, doesn’t it? Sooner or later, particularly on B2B sites or sites that sell big-ticket items, people want detail, lots of detail. Or, say, news articles or short stories or tutorials or research … so this rule is kind of silly, I think. Maybe it could be a rule for sites targeted at ADHD 20-year-olds?
Hi Lee, I agree that detail is important, however, when I say the content must be scanable, I don’t mean it must be brief, I mean it must be formatted in such a way that makes it easy to scan through and find key information .i.e., sub headings, good structure, and writing with purpose. But I see your point and where you are coming from, I just think it is important to have structure to good Internet writing. Thanks for your input.
Great article.. i will saved it for futures read. Anyway. It is a great if your website if they are categories by headings as it is very useful, it’s like in newspaper.. that there are parts that we have to consider.
Great tips! Some of them were already included in my list and some are kinda new to me. However, I did not understand the second one (“Page titles with low search engine visibility, think key words in a combination that entices”) :S
Anyways, thanks for sharing this info!
Hi Ikki, The page title (or for blogging the article title) should relate to keywords which you are targeting for search engine traffic. .i.e. A heading “My Second Blog Post” is not very useful as it doesn’t say anything about the content. However, a heading “10 ways to improve your typing skills” says a lot about the article, and also has keywords in it…typing skills. I hope that makes sense.
Yes, it makes sense now! Thanks for clearing it up for me
Hi Simon
Perhaps I could another one: Only use a CMS that you can understand and master…
I had bad experience with that formerly when I tried to use something that was just too complex. The result: my pages looked crappy, because I did not know how to make it right…
Mike
Great atricle.
I think the first thing everyone should learn is proper meta tags and keyword use. Then placement and proper tags for images.
Most people never learn the basics and go and make a flashy site that has no chance of success in search engines. Keep it simple have the main content placed above the fold to keep people on the site.
Great points! I think another mistake people sometimes make are color combinations. Some people try to put purple text on a bright pink background. Ouch, so hard on the eyes. I know im not the only one that doesn’t want to highlight the text to be able to read it properly!
Very nice tips and I agree with everyone of them! I am astonished people would make a strikethrough their visited link.
I think over use of flash and open new browser make people leave the most. Some good points most people never even figure out what a good title is.
Nice list. I should know this post earlier
Scrolling text was fancy like 13 years ago.
Great post. I think images and video that slow site down are a big problem. I also see people never use tags for images alot and flash can be a so slow on some sites.
Keep it simple stupid (kiss) is my motto when doing web designs. make sure there is plenty of white space and a good clean nav system is the key.
thanks for posting these mistakes i will keep them in my mind.grest post.
These design tips are very SEO-friendly. You’re right about mentioning that keyword that will be included in the meta should be carefully researched. And yes, using strikethrough in hyperlinks is not user-friendly. What I do with links is that I put bold style in hover. For visited, a somewhat lighter color than the color of the hyperlink.
Overusing flash is something so many do, but I really don’t understand why. Often it doesn’t give visitors any real benefit, and at the end of the day that’s the purpose of the site.
Here’s one– if you have a WordPress blog install one of the site backup plugins, as soon as you set up your theme! This has saved me more than once. (Even if you aren’t using WP, find a way to automate your backups)
I definitely think that paying attention to basic SEO adds extra value to web design – SEO, such as title and site architecture optimisation should be implemented right from the beginning of any web design project
It’s amazing at all the Flash I still see on some sites. If Flash is used on a site it should be minimal. Since it’s not SEO friendly and takes up bandwidth when downloading a site. Faster loading sites are much better and search engine friendly if they don’t have a bunch of Ajax, JavaScript, and Flash.
I got something to add that is also one of the common web design mistakes. Some people are fun of formatting the hyper links to open in new window. Well, it is too distracting to surf a website with all hyper links that will open in new window.
I think the proper way is to leave everything to the reader and those links; for better user experience should not open in new window unless for a special and designed purpose like when you have an MP3 streaming website, and while the visitor is listening to the song , it might click on the link like “song details”, so it should open in new window, so that listening experience will still not be interrupted.
Other than this, all normal links should leave as is, and should NOT open in new window.
The tips you have outlined are really helpful. I agree that if you have to scroll down a page for too long as a reader you can lose interest so breaking up the text is worthwhile.
I tend to put some graphics in or a picture to make things look easier on the eye. Having huge blocks of AdSense is also off putting. You immediately think scam or the site has little relevant or unique content.
Great tips! I bet this is an eye-opener for many folks, me included.
One thing I keep in mind — keep things simple and functional. Keep to a minimal, or eliminate completely, those unnecessary distractions. Content is what it all boils down to.
After reading your site, I have to check again my designs if there’s something wrong and I have to remove excessive animations.Good thing you reminded me of simple yet effective ideas.
great tips, on the long scrolling pages use ajax and or simple js tabs.
When you are able to avoid all of this, then there is a guarantee and assurance that you will be able to create a perfect design.
I keep on wondering why my other page are not working correctly, and I guess they don’t follow your tips! Wow, its time for a makeover.
Another mistake is not making clear about what your website is all about. If your business website does not directly depict the message that you’d like to send to its visitors, then you will not most likely gain profit in your business website. Make sure that your business website has a clear message about what your business is all about. A professional designer from a web design company would be able to help you in creating a compelling website that will ensure that your visitors get a grasp of what your business is all about.
I think a big one is not having a call to action on the homepage. Either a Phone number, quick contact form, or signup button should be clear and present on the front page without having to scroll down. This is KEY in conversions.
Great post! and Great tips! Some of them were already included in my list, thanks for sharing!
I like this post! it is so interesting and informative, thanks for sharing this wonderful tips and keep it up! it is a big help…
Great post! very interesting, and thanks for sharing this good information, keep it up!
I think this is a great article and agree with every point that has been made. I think some of these may seem obvious to some people but these simple mistakes do get made so hopefully with posts like this they might get avoided.
This is a great article.. i will saved this also for futures read.thanks a lot for sharing this wonderful post, keep it up!
“15. Too many animations. They are hard on the eye. If you must use them, use for emphasis.”
Personally I don’t like web pages with too much animations. It’s really distracting. I go to websites to get information and to read. Those animations can sometimes get really annoying.