Wrong Web Design
Learn how NOT to build your website...
You will learn the things you should avoid when building a website. Let me make myself clear, this topic will not teach you to create a site-of-the-year, many other resources do that already. Google the words “professional web design” and you will find tons of information.
This topic is your checklist to prevent you from using any possible wrong applied design methods which you should avoid or get rid of it (and why).
If you already have a website, then use this as your guide to check how your site is build. If you recognize any techniques you have implemented too, then don’t wait too long to make changes to your design. Bad web design can hurt your rankings, and can also result in a high bounce rate.
Site Navigation
Site navigation is the most important part of your site's architecture. It is the virtual guide for your visitor (and crawlers) to show how your site is structured. A visitor always wants to know 'where' he is, 'where' he can go, and 'where' he has been. Still too many sites use bad techniques or bad navigation usability that results in getting lost on your site.
Some Don't To Avoid:
Use only images for navigation
Crawlers can’t read images, they only can read text. So if you only use images for navigation, then crawlers can’t index (follow links) your web pages. But if you insist to use images for navigation, don’t forget to put tool tips (alt and title attribute) ‘behind’ the images and put at least a text navigation at the bottom of your page.
If you are using text-based navigation, then use descriptive (for human eyes) keywords in your anchor text. Also for your internal pages. This gives the visitor extra help to where a link is leading. It also will give you extra (internal) page rank credit.
Use only Javascript for navigation
Suppose a visitor has disabled the use of Javascript in his browser (sometimes they do that for security reasons), where can he go? And for crawler reasons, Javascript navigation is hard to read for some crawlers.
Use long nested drop down navigation
Ever been on a site with a very sensitive drop down menu you hardly can hit with you mouse? Visitors hate these things. Trying to point a sub item in a drop down menu and then you miss and the drop down closes again. You navigation should not be a computer game of skill. Especially older people do not have the same ‘mouse skills’ as experienced computer gamers.
Do not use keywords in the anchor text
Its very important to use keyword rich anchor text in your text links. Not only for search engines, but also for human beings. Use clear understandable anchor text to show the visitor where he will be send to.
Do not spread navigation on too many different spots
Sometimes I see web sites with navigation on top, on the left and on the right, all together. It takes a lot of time to understand to which areas in your website I can go. Remember that a visitor first ‘scans’ the page he is landing on. In a few seconds the visitor tries to determine if he is at the right place or not. Too much navigation will confuse him and will quickly leave your site.
Not showing the visitor in which part of the website he is
If you have a large site with main topics and sub topics, then always show the visitor where he is. Like using bread crumbs. DMOZ.org is a very good example of using bread crumbs for large sites.
Linking into the middle of web pages
If you have a large page with content, then linking within that page is useful. Many sites use that technique but forget to show a link or symbol to go back from where he came from. Just look at the green arrow that points ‘up’ in this page. And if you use an image for this, do not forget to use a descriptive ‘alt attribute’.
Disabling the ‘back’ button of a browser
I have seen a lot of sites who do this. The back button is one of the most used navigation button when browsing through a site. Every one knows that he always can get back one step when using this button. So, never disable this button. And if for technical reasons the back button can return in errors on the previous page, then place a customized ‘go back’ link on a prominent spot on the page.
Wrong use of meta and title tags
There are many meta tags you can use between the ‘head’ section of a website. The most important are the TITLE tag and the meta ‘description’. The title tag is the main element that identifies your website. It is often showed as the main link on the SERPS of search engines.
Still you often see that websites are not even using the title tag. It shows something like ‘home’ or ‘index’. Use your title tag to identify the specific page. Use your strongest keywords of that page, but don’t stuff it. I have seen titles like: “cheap computers, discount computers, best computers”. You can imagine that search engines don’t like this. But it also doesn’t look very professional if a visitor sees a link like this in the SERP.
The meta ‘description’ is very important to describe the content of the page. Most of the times this description (or part of it) will show up in the SERP below the link. Use very descriptive text, it gives the visitor a reason to click on your link or not!
There are many more meta tags, like the keyword meta tag, the author tag, the copyright tag, classification tag, rating tag. These tags have no significant added value for your website’s visitors or search engines. However, some ‘smart’ guys are using these tags for stuffing it with keywords. Believe me, by doing this you will do a lot of harm to your website. You even can get penalized for this practice.
Use of graphics
I have seen sites that use graphics that takes 1/3 of their entire homepage. And they also put text on these graphics. This is really killing your website. You certainly will have a ranking problem and visitors who try to select the text on your graphic (for what reason) get confused.
Many websites use graphics for extra functionality of their pages or emphasize the topic of a page. Many of them do not reduce the size of these graphics. Sometimes I see sites using photo’s for decoration which are 400kb or even 1mb large (which can result in a click-away), while you can reduce these to roughly 35kb.
