Major Website Mistakes Improve your site

[BigmanB 0]

I have made some of these mistakes myself so I want to pass on what is have learned to help others create easy website for the viewers. These are not in any order. This is my first tutorial so feel free to add comments. TY, Enjoy

 

1) URL/E-mail Names

 

This goes on the theme of trust really. Many small business like to set shops up on service providers like Xisto, geocites,yahoo. Those sites will usually supply you with a subdomain name like yoursite.serviceprovider.com. Instead of having a service provided name you should have a regular domain name like yoursite.com. I know I would rather buy or visit someones site that has a regular domain name than a subdomain name of a company.

 

2) Slow Site Pages

 

No one like to wait all day waiting for thier favorite site to load. I your site take more than 20 seconds to load over a 28.8K modem, you run the risk of losing visitors. The easiest way to make your site faster is by optimizing your pictures with programs like Photoshop. The size of individual graphics should be no more than 10K.

 

3) Banners

 

Although banners can bring great loads of traffic to your site too many of them may be as hassle. It is ok to have one banner but if you have two or three your site will begin to look cheap and too busy. Just slow it down and organize your site.

 

4) Background Noise

 

You may think adding things in the background to spruce up the design is good but that may not always be the truth. Many site have wild crazy distracting background designs. These are bad because it is interfering the message your site is trying to project to the viewer. It may also give them a headache.

 

5) Look The Same

 

Make sure your site looks the same on Netscape as it does on Internet Explorer. Many other browers are very similar to these two. Mozilla is an exsample, it is like Netscape. Test yours on both before going public.

 

6) Easy Navigation

 

Make your site easy to navigate. Some web site formats are far too confusing, have dead-end pages, and have sections that are like mazes. When isitors get lost they get mad and may cause a lost sales/traffic. Make sure that every page on your site is linked back to your homepage and contact information page.

 

7) Bad Searchs Engines

 

The literal search engines reduce usability in that they're unable to handle typos, plurals, hyphens, and other variants of the query terms. New searches should be able to handle these problems becuase they are hard for the young and old.

 

8) Not Changing the Color of Visited Links

 

Knowing where you have been on a website is alway good. No more back tracking. If you change the colors of the visited links from the unvisited links you can easily solve this problem. These benefits will help users to tell the difference between visited and unvisited links because the site shows them in different colors.

 

9) Opening New Browser Windows

 

No one likes to play astroids while browsing on the internet. New windows that pop up out of the ordinary can become very annoying. Web developers open new windows on hopes that it keeps users on their site, but realistically the strategy is self-defeating. Don't pollute my screen with any more windows, thanks.

 

10) Not Answering Users' Questions

 

Don't ignore your visitors. This will reduce the traffic to your site becuase of an unanswered question. The biggest problem is not listing a price or description of something. That will make your viewer go insane.

[Coach 0]

This is my first tutorial so feel free to add comments.

Bigman,I don't have to much experience, so I wil contribute with some research I have made

Spelling Mistakes

Face it, we all make spelling mistakes sometimes when we type. That is why it has become a problem. Normally we leave that burden to Microsoft Word Spell Checker, but here, the web editor you use may not know you have made a spelling or grammar mistake. Proof-Read every page.

Bleeding Technology

Flash, Java is cool. Shockwave, cooler. Director, awesome! They are good, but it brings a host of disadvantages to a site using it -

•Can't be indexed by search engines - Especially sites that are fully based on flash, search engines will have trouble indexing them with the exception of Google, but it still pays to have a non-flash section

•Big download == Long Wait - If you are using a flash movie as a splash image, do make sure you have a "Skip Introduction" outside the flash in HTML source, NOT in the movie itself, as it will bar users without flash from entering.

Use technologies only if you really need to, like a Java Applet to encrypt login details.

Thumbnail Preview

A common mistake many new designers make is that they place 800 x 600 image in a webpage resized to 32 x 32. By doing this, the visitor has to download the whole 800 x 600 image, just to view the 32 x 32 image fully.

There are free programs out there that allow you to save a smaller version of the image. Use the smaller image to link to the bigger one and you cut down the time the visitor has to wait for your page to load.

 

Dynamic Animation

New designers just love to place those falling snow flakes, a piece of text/image that goes after the mouse pointer or "Page Transitions" on every page (using it on a single page is okay). Use them at a few pages during special occasions, like the homepage, otherwise, avoid them,

 

Background Music

Another cool thing new designers love to do. The visitor is enjoying a piece of The Reason by Hoobastank and suddenly The Final Countdown plays in a webpage drowning the song. IE allows users to stop the music by pressing the Stop button but many do not know it. The worst thing that can happen is when a separate MIDI file is placed on every page.

If you must use a MIDI music on a website, put the code on a frame (like a navigation frame bar) and allow the visitor to stop it by providing player controls. This way, the music continuously plays throughout the visit and the visitor has a choice of stopping it.

 

Limiting the length of one page

Avoid placing all your website content on one page unless the content concentrates on one topic. This causes long pages, and as the bar on the scroller grows smaller, users get more discouraged at the content they have to read and being fast scrolling.

Unless it is something an user is expecting, like an article, story, game walkthrough. Use anchor links for navigation of the page.

 

Animated Images

Animation is usually used in webpage to get attention, NOT for decoration. Hey, I'm not watching a movie here. Decorations should be static as they can be distracting.For example, advertisements are animated to get attention. So only use it for that purpose. This includes backgrounds, links and any other stuff that can be placed on the page.

 

Font Colour

Always make sure your text is readable without the user having to strain his eyes. There's nothing worse than to get a dark gray text on a black background with images disabled.

Test your page with different monitors. Some people prefer dark monitors, while others want bright images. The text on the image on the right may be easy to read on a small scale, but on one whole page, it'll cause a strain on the eye.

 

Screen Size Width

Design your site for the minimum - 800 x 600. Some people prefer going lower which is 640 x 480. Visitors are not used to scrolling horizontally on a 1024 x 768 designed website. To cater for higher resolution users, use percentage values in tables.

 

Font Usage

Use a common font in your pages. If the visitor does not have the font, the browser will render the page using its default fonts. This is an important aspect of readability in web design. Specify multiple fonts like "FancyFont, Arial, Verdana " so that the browser will use Arial if it doesn't have FancyFont.

 

Navigation Bar

Every page should have an effective website navigation bar, either on the top or on the left. Avoid being the special one and placing the navigation bar on the right. Placing links on both sides are fine, but keep the left/top pane for main links.

 

Image Download

Optimise your site images so that they load as fast as possible on the visitor's monitor. There are tons of software which do this you, free ones included.

 

Title, Meta and Keyword tags

Some websites could have made it higher if they had thought about replacing those "Untitled Documents" titles with more meaningful ones. Placing Meta and keyword tags also help search engines to index your site.

 

Image Alt Text

Provide the alt text of an image whenever possible. You don't have to provide this for all your images, only those meaningful ones. For example, the image links on the navigation pointing to Home could use "Click to go Home" as the alt tag.

Besides, it helps the disabled and those people who disable images or use text browsers when surfing.

 

Splash Images

This point was highlighted above, and is being said again on a more general context - Put a separate "Enter Site" link OUTSIDE the flash move/shockwave/applet application so that the user can click it to enter the site quickly.

This way, if the visitor has ActiveX/plug-ins disabled, he can still enter the site. Not only that, search engines can better index your page.

 

Feedback Link

Always provide a feedback/contact form, or at least an email address with a clear link to it. Keep in mind that there is a major percent of surfers who use web-based email such as Hotmail or Yahoo! and they will not be able to use your e-mail based form unless it uses a server side based script.

 

Title Naming

Never forget to give your page a title. There are countless number of pages still on the web that use the standard title "Untitled Document".

Also avoid use "Welcome to XXX website", the two words are better used in search engines. Remove "Welcome to" and add more important keywords as many search engines give higher priority to page titles.

 

File Naming

Most servers nowadays support spaces in filenames, but avoid doing so. Always use a lowercase filename and folder name without any special symbols(including spaces) in them. Windows based HTTP servers usually are not case sensitive but Unix servers (which is most common) are.

 

Text Spacing

Never pile a block of text all in one big paragraph. Try to shorten it to 3-6 lines per paragraph and visitors will have an easier time reading the text. Also, don't use the whole width of the screen for one line of text. Keep it to about 75-90% of the screen.

 

Frames

Frames have generally been frowned upon by the web design community. Personally, I like frames, but only if they are used as they are meant to be used. 2 frames are okay, 3 frames are fine, but touching the limit. More than that and it is overkill.

Pages in frames are hard to bookmark as only the parent frame is bookmarked. Take a look at a New Zealand Splendour - a site that uses 3 frames effectively.

 

Paging

Some designers like to break long documents into multiple pages and provide page number links at the bottom.

If it is a FAQ or a long document a user is expecting, provide all information on a single page, as many users are accustomed to using the keyboard arrow keys to scroll down and clicking on the "next page" link means moving their fingers back to the mouse, navigating to the link, clicking it and back to the arrow keys.

 

Proprietary Documents

Adobe Portable Document Format is very popular when formatting and text needs to be preserved but keep it to that purpose alone. PDF is a big file format and takes up much more space than a regular HTML file. Microsoft Word documents are smaller, but still considerably bigger.

Whenever possible, provide a HTML version of the document with the formatting stripped as much as possible to keep the space level down. Users just want quick access to the content of the document, and if they want a better version for printing, they'll get the PDF version.

 

Here more information on same topic:

PDF Files for Online Reading

Users hate coming across a PDF file while browsing, because it breaks their flow.

PDF is great for printing and for distributing manuals and other big documents that need to be printed. Reserve it for this purpose and convert any information that needs to be browsed or read on the screen into real web pages.

Non-Scannable Text

A wall of text is deadly for an interactive experience. Intimidating. Boring. Painful to read.

 

Write for online, not print. To draw users into the text and support scannability, use well-documented tricks:

• subheads

• bulleted lists

• highlighted keywords

• short paragraphs

• the inverted pyramid

• a simple writing style, and

• de-fluffed language devoid of marketese.

 

Fixed Font Size

CSS style sheets unfortunately give websites the power to disable a Web browser's "change font size" button and specify a fixed font size. About 95% of the time, this fixed size is tiny, reducing readability significantly for most people over the age of 40.

Respect the user's preferences and let them resize text as needed. Also, specify font sizes in relative terms -- not as an absolute number of pixels.

Page Titles With Low Search Engine Visibility

Search is the most important way users discover websites. Search is also one of the most important ways users find their way around individual websites. The humble page title is your main tool to attract new visitors from search listings and to help your existing users to locate the specific pages that they need.

 

The page title is contained within the HTML <title> tag and is almost always used as the clickable headline for listings on search engine result pages (SERP). Search engines typically show the first 66 characters or so of the title, so it's truly microcontent.

 

Page titles are also used as the default entry in the Favorites when users bookmark a site. For your homepage, begin the with the company name, followed by a brief description of the site. Don't start with words like "The" or "Welcome to" unless you want to be alphabetized under "T" or "W."

 

For other pages than the homepage, start the title with a few of the most salient information-carrying words that describe the specifics of what users will find on that page. Since the page title is used as the window title in the browser, it's also used as the label for that window in the taskbar under Windows, meaning that advanced users will move between multiple windows under the guidance of the first one or two words of each page title. If all your page titles start with the same words, you have severely reduced usability for your multi-windowing users.

Taglines on homepages are a related subject: they also need to be short and quickly communicate the purpose of the site.

 

Anything That Looks Like an Advertisement

Selective attention is very powerful, and Web users have learned to stop paying attention to any ads that get in the way of their goal-driven navigation. (The main exception being text-only search-engine ads.)

 

Unfortunately, users also ignore legitimate design elements that look like prevalent forms of advertising. After all, when you ignore something, you don't study it in detail to find out what it is.

 

Therefore, it is best to avoid any designs that look like advertisements. The exact implications of this guideline will vary with new forms of ads; currently follow these rules:

• banner blindness means that users never fixate their eyes on anything that looks like a banner ad due to shape or position on the page

• animation avoidance makes users ignore areas with blinking or flashing text or other aggressive animations

• pop-up purges mean that users close pop-up windoids before they have even fully rendered; sometimes with great viciousness (a sort of getting-back-at-GeoCities triumph).

Violating Design Conventions

Consistency is one of the most powerful usability principles: when things always behave the same, users don't have to worry about what will happen. Instead, they know what will happen based on earlier experience. Every time you release an apple over Sir Isaac Newton, it will drop on his head. That's good.

 

The more users' expectations prove right, the more they will feel in control of the system and the more they will like it. And the more the system breaks users' expectations, the more they will feel insecure. Oops, maybe if I let go of this apple, it will turn into a tomato and jump a mile into the sky.

 

Jakob's Law of the Web User Experience states that "users spend most of their time on other websites."

 

This means that they form their expectations for your site based on what's commonly done on most other site. If you deviate, your site will be harder to use and users will leave.

Keep enjoying

[solankyno1 0]

This is really very very helpful tutorial for beginners in the website creation field. The things discussed here are not very hard to implement, we only need some care towards these mistakes. I have also make some of these mistakes at first and I feel embarassing when the visitors of my website has told me about them.

[Brian1405241474 0]

Dont' feel too embarrassed (unless you did something really stupid) You should be glad people care enough about your site to give you feed back. And thats another thing: If you are new to web design (and even if you 're not) giving your users a place to give feed back it always nice. You can use a guestbook, forums, or just an email link.

[Tobias 0]

Good tutorial. I've made a few of those mistakes before, so don't feel bad. I'm sure that everyone makes them, and I still catch myself making some of those mistakes. The important thing is to learn from them and to correct them when they happen. This tutorial also helped me realize a few mistakes I currently missed.Another thing that can be fixed is time it takes your page to load. Tables can be slow in the loading process. If at all possible, maybe learn CSS, because they load quicker then tables.Thanks again for the help.

[mzwebfreak 0]

One BIG problem I've come across when checking sites for various things is the AnNoYiNg HaBiT people have of doing that kinda type, especially when you see in on the ENTIRE SITE!!! But yeah, that and definitely, as was mentioned earlier, don't embed the music on the site. I've seen way too many sites where the layout and navigation is great and well thought out and it's got this annoying song playing in the background on every page.

[TotalLamer 0]

Two HUGE web design mistakes are using large numbers of animated GIFs and making horrifically colored webpages (i.e. neon colors that hurt to look at and/or read against, especially when the font is equally garish). Also, using small, difficult to read font (especially when the font color doesn't contrast well with the backround color) and resizable hovering links that get HUGE (i.e. the link is regular sized, but when your mouse hovers over it BOOM! it supersizes.)

[finaldesign1405241487 0]

Yeah, I agree with all this. A huge mistake is to use noncompatible collors, like that neon green on white background or black backgr. There are soo many nice colors but people seems to use that ugly default colors always...

[concreteguy07 0]

You hit me hard there man! har har. I was like that when i was working on my first pages. Moving texts over here and moving images over there making the visitor dizzy

[EdgeXC 0]

I did all that stuff on my very first site as well... marqueeing text, animated GIF's as the buttons, glowing text... thought it all made it look cooler I guess. Now that I've learned that stuff is annoying and just basically makes the visitor not want to visit your site for updates because it is low quality and annoys them. Stick to the simple stuff, like this forum's colors... nice complimenting blues with white and black text that is easy to read.Guess everyone kind of goes through that phase when they first start.

[plot 0]

Wow! Thanks alot this really helped me notice alot of things with my site, and i thank you, im improving it right now and i really never would have noticed any of it without read this post so i thank you a ton

[mzwebfreak 0]

I did all that stuff on my very first site as well... marqueeing text, animated GIF's as the buttons, glowing text... thought it all made it look cooler I guess.  Now that I've learned that stuff is annoying and just basically makes the visitor not want to visit your site for updates because it is low quality and annoys them.  Stick to the simple stuff, like this forum's colors... nice complimenting blues with white and black text that is easy to read.

 

Guess everyone kind of goes through that phase when they first start.

1064321582[/snapback]

Oh yes, I actually found a copy of some of my first pages (from Angelfire pagebuilder *shudder*) and boy were they TACKY! One thing that I felt would be good to mention is that if you're going to use backgrounds, keep the same one for the entire site if at all possible. That was one thing I remember that I had done on my first site is have different backgrounds on practically every page since angelfire had this big background gallery that was kinda cool. That, and keep the text to a managable size. We don't need pages full of text

THIS BIG

ya know?

[Sarah81 0]

You've given EXCELLENT advice here! Great job!Even though I don't sell anything or whatever on my site (it's just where I go to post my rants and such), I still try to keep it as simple as possible. That's mainly for my benefit so I don't have to spend half an hour trying to figure out where I'm supposed to put new stuff and all that good stuff. But it also helps anyone who actually visits my site (yeah, right - like I have visitors, hehe).P.S. I particularly liked your advice about changing (un)visited link colors. Most browsers do it by default, but some users change settings and don't remember how to get them back. And besides which, I don't like purple that much anyway (default VLINK color) anyway. *grins*

[ZeroHawk 0]

Not bad. I personally don't make those mistakes, even though I'm a newbie at html. Here are my tips:-Can't afford a .com, .net, .uk or whatever domain? Try .tk or .co.nr - their absolutely free.-If you use frames, I don't recommend making them re-sizable. Me and my friends find it annoying and unprofessional.-Keep it simple. At first, don't make your design over complicated. Don't use animations or bright and dazzling colors. Make your page focus on the content, not the design.

[Retaining 0]

Those are good suggestions. Some other things I've noticed on pages that are really annoying include sites where the style of the pages/navigation menus changes a lot from page to page and where people overuse animated GIFs/Flash/blinking text/Javascript/etc. Just because it's cool and you can use it doesn't necessarily mean you should use it.