According to a global, web-based survey by Interbrand, the Google website had the most impact on people's lives in 2002. Google beat established brands such as Coke and Apple, illustrating how differently you build websites and, with it, brands on the web. It's less about how a website looks than how it works.
A website must have a strong visual image. Marketing and advertising agencies have dedicated themselves to this basic premise. This section details all there is to know about how to create and design a successful website for maximum customer base and sales.
To promote a service or a product through a website is to promote mood, color, and feeling. This must occur quickly and repeatedly. Successful websites must take a very unique approach, as Google (and before it, Yahoo!) illustrates. A paid service on the web is a brand that exists primarily online -- helps people do things. First and foremost, it's functional.
Every time a reader succeeds in executing a task on the web site, your product or service reputation is enhanced. Every time a reader is frustrated by the site, the product’s reputation is diminished.
Tools and approaches that make marketers and advertisers succeed offline are often drawbacks on the web. The compelling image is slow to download and frustrates the impatient scan reader. The catch phrase is of little use to a reader hungry for information.
Google is a success because it does a great job helping people find the content they are looking for. Google built a successful brand with an anti-marketing, antiadvertising approach. Its home page is bare, minimal but most of all utterly functional.
Yahoo! built its brand in a very similar way. Yahoo! remains the number one destination for millions worldwide. Its home page is much more cluttered than Google's, but it's cluttered with links. It's about helping you to get to a destination quickly; helping you do things.
The conception about flashy homepages has changed. When you arrive on a home page and are met with a fancy Flash intro, you are no longer impressed. Waiting for a large image to download, your frustration would grow. Your potential customers visit your website looking for something unique and important. Anything that slows them down is an annoyance. You should portray your product with accurate, well-written, up-to-date content. Many marketers and advertisers still don't understand the web.
Build It for Speed - It's a fact of modern life - people are in a hurry. This means that you have between 10 and 30 seconds to capture your potential customer's attention. To minimize your load time, keep graphics small. Compress them where possible. Use flashy technology (JavaScript, Flash, Streaming Audio/Video, animation) sparingly and only if it is important to your presentation.
Target Your Market - Know who your market is and make certain that your site caters to their needs. It is critical that your site reflect the values of your potential customers. Is your market mostly business professionals? If so, the site must be clean and professional. Is your product aimed mostly at teenagers and young adults? Then your site could be more informal and relaxed. The key here is to know your market and build the site to their preferences.
Focus the Site - Make certain your web site is focused on the goal, selling your product or service. A site offering many unrelated products is not necessarily unfocused, but this is often the case. If your business does offer many products, dedicate a unique page for each instead of trying to sell them all from one page.
Credibility Is Crucial - The most professionally designed site won't sell if your customers don't believe in you. A clear privacy statement is one way to build your credibility. Provide a prominent link to your privacy statement from every page on the site as well as from any location where you are asking your visitors for personal information. Provide legitimate contact information online.
Navigation should be simple - Make site navigation easy and intuitive. Simple and smooth navigation adds to the convenience of the visitors. Add powerful search and catalog features. Often, a lot of visitors do not have the patience to navigate through the whole website to find what they are looking for.
Consistency is the key - Make sure the site is consistent in look, feel and design. Nothing is more jarring and disturbing to a customer than feeling as if they have just gone to another site. Keep colors and themes uniform throughout the site.
Content is King - Good content sells a product. Ask yourself the following questions. Does your copy convey the message you wish to get across to your visitors? Is it compelling? Does it lead your visitor through the sales process? Have others review, critique and edit your copy to ensure it is delivering the intended message. Always double-check your spelling and grammar.
Pages should be based on a grid, with space allocated for navigation, headers and footers, body text and whatever other elements that will be repeated throughout the site. This sketch will serve as a pattern for the site's appearance and should not change very much, if at all, from page to page.
Taking this approach means you can essentially have your site designed by creating a single page that can be reused, with perhaps minor modifications, as a template for all the other pages in your site. You need to consider how the various content types of different parts of the site will be accommodated within the design and be sure that it meets the needs of all sections.
Consistency is at the heart of good web site design and this applies not just to layout but also to every aspect of a site. If there are major shifts in the appearance or color of any part of a site it will be assumed by the user to have a meaning. This is fine if you are using it to highlight information or to indicate that the user is in a different part of the site; it can be very confusing otherwise.
Besides consistency in color, positional consistency is important. Navigation bars, navigation text, location indicators, logos, footer information and so on should be in the same place on each page. The width of margins, the positioning of images within articles, the size of photographs, the amount of space around text and images, the positioning and style of captions for images and so on should also be consistent. All pages should be well connected and navigation should be quick and simple.
The best websites today use a single template for all the pages of a section on the website or for the entire website, if the number of pages are few. The use of ‘Frames’, however, is passé. Using a template offers the consistency to your site and helps to build a brand image of your site. The template includes the graphic design and header of your page including the main menu bars. Content is thus positioned separately from the template.
Use of a cascading style-sheet for displaying the content is another useful mechanism to ensure consistency on all pages. The style-sheet stipulates the content layout, use of font and spaces, presentation of paragraph titles, margins on the page and other parameters.
When designing the site layout keep in mind the following points:Visitors
In the majority of cases they want information and they want it now. How beautiful your site is will not be as relevant to them as long as it loads fast, has consistent layout and makes it easy to the user to evaluate its usefulness to them.
Search EnginesWhen you are designing the layout always ask yourself what impact anything you plan to add to your site will have on the experience of your visitors and the capacity of search engines to efficiently index your pages. Add pages in order so that navigation through the website is consistent and progressive. Further details on search engine optimization are given in the section on promoting your site.
Always add a Site MapA site map is just a simple list of web pages on your site. It gives your visitors a quick guide to what can be found there plus it's very useful to the search engine spiders. You can also use it to keep track of your site and see its structure and content all in one place. If your website is without a Site Map, there is every possibility that some of your visitors might leave your website within 10 seconds failing to find what they were looking for.
Navigation StructureThe aim of a web site's navigation is simply to allow users to get to the content they require. For sites that have a large number of sections and web pages (and information sites can be one of these) the navigation plan has to be properly researched and designed. You have to consider different types of visitors and simulate the most common steps they would take to find what they want on your site and the navigation plan has to optimize this movement. For example the steps required from searching a catalog of items, selecting from the catalog, adding them to a shopping cart, proceeding to check out, to entering the payment particulars is a specific sequence that should be facilitated by the navigation system. If the sequence is haphazard, it could lead to frustration or the user may miss an important step and you would have an aborted sale.
To find their way about, users need to know two things:• Where they are now
• How to go elsewhere
Navigation does not exist in isolation; good site organization is a prerequisite for a coherent navigation system.
Location indicators let users know where they are in the site at the moment. It needs to be borne in mind that users coming from outside your site can enter at any page, not necessarily on a 'main' page. They need to be able to orientate themselves.
Equally it is important that users navigating around your site have a clear idea of where they are both in absolute terms and in relation to other content.Location information should appear on every page of the site, in the same place and in the same style. Location indicators should tell the user precisely where they are and this should be clear even to a user who has entered the site at an internal page. The location indicator should be identifiable for what it is and make sense in the context of other navigation.
In simple sites a page banner - text or graphic - naming the page will be sufficient. For this to work the page name should also appear in the main navigation so that it is relevant within the overall structure of the site.
Color can be used. For example a different color background, contrast color or sidebar in each part of the site. To be really effective the color change should be reflected in the navigation.
Using ‘breadcrumbs’ on every page is a good idea. Breadcrumbs show you a series of hierarchical links that you have used to go from page to page within a section. Using breadcrumbs is like leaving a trail of the path you have followed. The breadcrumbs appear at the top of the content section, just below the main navigation template. Each element in the breadcrumb is a link to that section or subsection. This helps in avoiding a series of back buttons allowing the user to directly go back to the main section page or another sub section. More importantly, it always shows the context of the page that is being viewed and how it belongs to a section or sub-section.
Navigation controls are the main navigation links; they allow users to move around the site. Whether they comprise images or text they should be predictably located in the same place, and with the same appearance, on each page.
These have several purposes:• To allow users to move about within the site
• To tell users what information is available at the link
• To work with location indicators to orientate users
• Leads to obvious content - users have a good idea what they will find if they click
• Is consistent with other navigation controls
• Is predictable in its style and location on the page
Having broken your content into categories you need a link to each category in the main navigation bar. Some categories will be a single page; others will be whole directories of pages. It helps to think of sections with a lot of content as mini sites, each with its own home page to which the main navigation link goes and which can be used to further orientate the user. Each section can also have its own subsidiary navigation if it contains multiple pages.
Note that links to other sites should NEVER appear in the main navigation controls.• If a user gets lost then a drop down box, search function or a site map provides an opportunity for them to quickly re-orientate themselves or get back to a familiar page
• A site map page can provide more detail about what is in each section of the site than a navigation bar can• Secondary navigation provides a quick way for users to get to content at a deep level, especially in areas of the site where there is a lot of content
• Most, if not all, sites will benefit from the inclusion of some form of secondary navigation.
• Communicating to your visitors with colors, background and text
In how many different ways does your website communicate to your visitors? One of them is determined by the choice of colors, background and text you use. During site creation, it is very easy to fall into the trap of “if I can, I will” thinking. This method of thinking is very dangerous. The premise is if I can create a site with 256 differently colored words, backgrounds and graphics, I will. Your site may look great, but what will you accomplish? The disadvantage in creating a single site with dozens of different colors is color compatibility between different operating systems, monitors and browsers. If the browser of your visitor cannot show an exact color from your website, it will choose the closest or mix the nearest two colors. This is called dithering. The result can be something you did not want or expect.
The best way to avoid dithering is to optimize your site colors. The best way to optimize your colors is to use the colors in a 216-color palette. By designing a site with this in mind, your site will appear, as it should to all of your visitors.
Colors evoke a broad array of emotions, and influence decision-making process every day. By using these nonverbal clues to your advantage, you can influence how your visitors feel about your site.
Use colors that are not too jazzy and flashy but are easy on the eyes. Your site should be as simple as possible – not all shiny and gaudy. Ensure that your chosen color scheme can be over-ridden by the user's browser settings. Some people have eye conditions that mean they can read only black on white, while others can read only yellow on black - if your design is flexible, everyone will be able to read it.
Choose a background that is a single, solid color. If possible, avoid loud textures, patterns or images. The choice of background and foreground colors is not as important as the contrast between the background and the text. A simple way to check this is to take a screen shot of your proposed page and use a graphic editor to convert this into a gray scale image - by removing color from the image you will be better able to judge if the level of contrast between background and foreground colors is sufficient.
Apart from the color, your text font and format also play an important part in communicating with your visitors. Here are some tips pertaining to the text format to be used for your website.
Avoid, if possible, the use of graphics in place of actual text. Text size and color can be changed by the user's browser settings, but a graphic is fixed, and can't be changed in this way.
Avoid large blocks of italic text - this can appear 'wobbly' on screen, and is difficult for many people to read.
You don't have to use large font size on your page. Standard (medium) size text is fine - visitors to your site can adjust the text size to suit their needs by altering their browser settings. However, ensure that you use relative font sizes in your code, not absolute font sizes. Some browsers can't over-ride absolute font sizes.
Don't underline large blocks of text. Some people find underlined text difficult to read. In addition, since underlining usually indicates hyperlinked text, it can be confusing for users if it is used where no link exists.
Capitalization of whole sentences should be avoided, as many people find it difficult to read sentences written in capitals, and THEY COME ACROSS AS IF THEY ARE BEING SHOUTED AT VERY LOUDLY!!!
Use headings appropriately. Don't use headings simply to increase text size. Some browsers can present the user with an overview of a web page based on the headings and sub-headings - this doesn't work if headings have been used inappropriately, or not used when they should be.
There is no mystery to usability. It simply involves creating a site, which is accessible to the majority of people, is easy to use and get around and delivers on its promises. You can have a site that meets the most important standards of usability by planning it well and always keeping the end user in mind. Remember that web sites should not be designed for their owners - they should be designed for their users.
Problems with usability could be said to stem from just two sources: the site itself and the user. In fact the site is always at fault; if a user, however experienced or inexperienced, has problems navigating, getting information or understanding the site.
While websites have become far more complex, web users have become less rather than more experienced as more and more people go online. It is a mistake to think that the majority of users will be web or even computer savvy and will understand subtle clues about content. Most will not.
Help users achieve a goal, usually to find something, such as information, or obtain something, such as a book.
• Make it easy for them to achieve that goal
• Make it possible to achieve the goal quickly
• Make achieving that goal a pleasant experience
A site will be generally usable if:
• The content is good and relevant
• The content is easy to find
• The content can be found quickly
• The page is pleasant to look at and cleanly designed
A site with good content, regardless of its subject, is one that provides products or information that is useful or beneficial to users. A good usable site will make it clear what information or content is available and at what price AND what is not available. A good usable site should define clearly all subscription packages offered.
Good navigation, precise location indicators, secondary navigation, clear linked text and a well organized structure all contribute to making information easy to find for a wide range of different users. This is discussed earlier.
Bearing in mind that many users are inexperienced, it may be necessary to include explanations of things you consider self-explanatory. For example, an inexperienced user may need an explanation of how to use a drop down menu.
1. Speed of page loading
This requires, in particular, attention to images to ensure they are properly optimized and do not excessively delay load time. It may also mean breaking up long articles and ensuring that important content is at the top of the page where it will load first.
2. Speed of Access to content This is where the much-vaunted 3-click rule comes in - no important content should be more than 3 clicks from the home page. Some standards even say that it should be no more than two clicks.
One helpful way to speed access to content is to consider each type of user, select the content that they are most likely to be interested in and create links from the home page to one piece of content for each group. This will get them quickly to the appropriate part of the site.
Cleanly designed pages are pleasant to look at and easy to read. It is almost impossible to make a site with an image shown as a tiled background usable - the whole thing is too distracting and confusing. It takes no great design skills to create clean pages; it just requires thought and adherence to the principle that when it comes to design, less usually is more.
Most paid membership websites are limited to online access and information download rather than selling products. There should be clear download instructions. In case of information download, it is crucial that you show a download bar and the download status. Many websites offer huge files for download but while the user is downloading he/she has no idea of the status of the download or the speed of the download. This is very frustrating especially in the case of larger files and often you’d see users canceling the download midway and leaving the website. Your website should also state the size of the file in kilobytes and the estimated time of download for a user having a 56K modem, DSL, Cable and so on.
However, identifying problems with usability for your site need be no more complicated than asking a few (honest) friends to act as guinea pigs on your site and, if possible, watching them silently as they do this. Watching users try to find information at your site can be both instructive and quite surprising.
Remember that if at any stage you feel the urge to intervene and explain, then you have identified a usability problem.List of the most common usability problems:
• The site does not state its purpose clearly
• Java applets, huge images, banner ads or flashy elements slow down loading; 10 seconds is about as long as the average user will wait for a page.
• Poor navigation, too little navigation, too much navigation and, not uncommonly, no navigation at all
• Bad design leading to poor readability
• Discomfort due to ugly design or inconsistent design. Almost always because a designer overestimated their skills.
• Irrelevance of content - for example the business site that includes biographies and photos of each of the board members. Happy egos on the board; bored users!
• Complexity or excessive originality of design, which requires users to learn how it works in order to use it.• Inaccessibility because the site cannot be used by browsers used by people with disabilities
Make your website interactive. Add feedback forms as well as email forms that allow your prospective customers to ask you any questions they might have pertaining to a product. Personalization of your website is another key element that can lead to customer delight and can increase your sales. Personalization technology provides you the analytic tools to facilitate cross selling and up selling when the customer is buying online.
It tries to restore to the online business the magic of personalized attention that is one of the chief reasons why most people still prefer in-store purchase. You can use personalization to match your customer with the right products through either rules-based or customer analytics based processing. Thus as your software stores customer information and preferences, it can help categorize them into groups. At the same time, observations over time can suggest products to crosssell and up-sell. Thus when a person buys a subscription to a fitness site, exercise equipment is also offered. Amazon pioneered personalization on the net – when you a buy a book, it shows you other books in the similar genre saying “people who bought this book also bought these”, inducing you to buy more. A consumer survey from the Personalization Consortium found that 56 percent of respondents say they are more likely to purchase from a site that allows personalization, and 63 percent are more likely to register at a site that allows it.
Personalization can lead to customer delight and can increase your sales.You can do without the services of a web designer to build a website. With the right tool and a little bit of practice, it is possible to create a website that tells your story successfully.
Although you don’t need expensive tools, using an HTML editor with at least the following is highly recommended:• visual help for syntax (colouring, indentation and markup options)
• syntax checking for pages and across the site
• link checking for pages and across the site
• spell checking for pages and across the site
• repeat edits within pages and across the site
• translation for special characters
• relative file paths, line numbering and spell checking
There are many tools available to the layman for designing websites. Microsoft FrontPage is by far the easiest product to use for designing websites. If you are familiar with Microsoft products, you’ll be fairly comfortable with the user interface and should have no trouble getting started. Microsoft FrontPage generally comes as part of the Microsoft Windows operating system package.
Macromedia Dreamweaver is another good website building tool. Dreamweaver is known to be a much more robust and effective website building tool compared to FrontPage. However, it is more complex than FrontPage. Macromedia Dreamweaver costs around $400. Remember that you will need some time to learn to use these tools and reach some level of proficiency. There are several other tools available from other vendors including Adobe.
While you can design and build a site yourself using the above tools, remember that your site is your business establishment. If your site is just a single section with a sign up and a download section, maybe you can venture to try your hand at building your site. In all other cases, leave it to a professional web designer or a firm with the experience. There are far too many aspects of the