While organisations progress further using the newest web technologies and dynamic content, many people remain in the dark about how best to plan their very first website. To take an HTML course as the first step would be a mistake. The best way to plan a website is using a paper and pen, somewhere nice like the beach or in a hammock. This article is designed to step you through the planning phase, and introduce you to the additional steps leading up to publishing your website. You will need paper, pen, some creativity, and a common sense approach to what you are trying to accomplish by having a website.
NOTE: If your website is to be used for a business purpose, we must assume that you have done your research and competitively positioned yourself within a specific marketplace. A quick search on the internet will reveal many articles which discuss this in greater depth.
Step 1: Purpose There is nothing more important than understanding the purpose of your website. Without purpose, you will struggle in the following steps, and the final outcome will be less than satisfactory to be competitive online. Take some time to consider the following questions, documenting your responses so that you may refine these later.
- In ten words or less, what is your sole purpose for publishing a website?
- List the key products or services that your website going to provide.
- Who is your audience? Who do you hope will visit your website?
Step 2: Navigation This is another time when people jump into HTML and start coding. Don’t be unwise, there is more planning to do!
A website contains a number of web pages. Each web page has a purpose for existing. The most important web page is your home page, located at the site root where most people will enter.
On paper, document a list of high level web pages that your site will contain (high level pages are usually the ones that have links on the home page). Leave a couple of lines between each page title, and when you are happy with your list, revisit each item and describe its purpose in one or two sentences. Include your home page as the first item. Additional information about its role is included later in this article.
An example part-list is shown below, for a business which seeks to sell its products online (a site of this kind would contain dynamic content):
- Home page.
- Our Products. The key entry point for the full product catalogue, with product categories and individual product pages.
- Shopping Cart. Allows a customer to review the items they have chosen, and make an online payment.
- Using This Site. Tips and hints about how to use the site easily.
- …
- …
- Contact Us. Simple, clear instructions for the customer to contact the business.
You are not restricted to one page for each item listed above. The “Our Products” item, for example, represents a group of pages which make up the product catalogue. Design your navigation so that a customer can get anywhere on your website in 3 clicks or less (a 2 click maximum would be even better).
Finally, ensure that a customer can navigate out of a section of your site easily. This may be achieved through a consistent navigation bar on the left or top of screen.
Step 3: Content Take a fresh sheet of paper for each page (or group of pages) that you have listed. Write the page title at the top of the page, and note its purpose (from Step 2) below the title. Begin to outline the content of the page in greater depth. For a page entitled “Using This Site”, you should document all the information you think the customer will need when viewing this page. Fill the sheet with notes and thoughts about each page – it will be a great reference for you when developing your website later. You can add more detail later, but the important thing is that you have considered the site structure at this lower level.
Step 4: Design In many ways, the design of your website is as important as the content, although it must not be given absolute priority. Review the purpose of your website. Will the design of your website reflect a focus on visual or informational/textual content? An artist’s website is likely to be more visual, whilst a library website will be designed around the information that it contains. If your website is designed to structure and present a lot of information, then your design will need to be information-oriented.
Before you make more decisions regarding the design of your website, consider the following:
- Branding: Every organisation needs some kind of branding. With clear branding, your customer is more likely to remember what you offer and return at a later time (this is known as brand recognition). On a website, your branding can be reinforced through a logo, an image, a slogan, a domain name (e.g. [http://www.gamesthief.com]), or a colour scheme.
- Consistency: It is critical that the design you choose is consistent throughout your site. It is unhelpful to see navigation buttons, logos or links jumping to different parts of the screen as you navigate between webpages. Variety can be added to your design while maintaining a set of overarching design principles. For example, on a university website, one faculty may distinguish itself from another through subtle changes to the global template. This may be achieved through the use of colour or by adjusting in some way to make it reflect the faculty to which you have navigated. These kinds of changes must be implemented at the top (we don’t want each faculty doing their own thing).
- Set the mood: The overall mood of your site will be defined by its purpose, and should be re-inforced through each visual element. For example, a community site for youth is likely to choose vibrant, contemporary colours and fonts, while a conservation website may apply a nature-oriented mood through imagery and colour.
- Accessibility: All websites should be made accessible to all, but a site tailored for the visually impaired is likely to apply a high contrast colour scheme and large text to assist its audience. Consider the special needs your audience may have.
Take some time to work through the following website design elements. Consider how each item may contribute to the site’s purpose outlined in Step 1.
- Do you require a more visual or information oriented website?
- How will you brand your site, using a logo, an image, a slogan, a colour scheme etc?
- What kind of mood are you trying to create?
- Is your purpose clear?
- Do your design elements complement or retract from your overall offering? For an information-oriented site, does the design make it hard for your audience to get to the information they need quickly? For a more visual site, is there too much information?
Design your website on paper first, and continue to review this section until you are satisfied with the outcome.
Step 5: The Home Page The home page is the most important part on your entire website. It deserves special attention in both content and design. When a potential customer visits your site for the first time, they may take less than 3 seconds to decide if your website is worthy of their time. It is that part of the website that you first see (without scrolling) that will grab or lose the attention of a potential customer.
For this reason, your home page must be treated as prime real estate. Here are some quick tips for planning the content of your home page.
- The navigation of the site must be presented clearly, with obvious labels which cannot create any confusion for the viewer.
- The branding of your business, product or service should be clear and informative (a picture tells a thousand words, so use them wisely).
- Your home page needs to be visually pleasing.
- This page must not be slow to load (heavy-laden with large images etc).
- Generally speaking, when a page is loading, your eyes flick from left to right along the top of screen, then down, left and up in a quick circular motion. Consider this when placing the information on your home page.
Final Thoughts How did you go? Hopefully you will appreciate just how important the planning process really is.
Now that you know what you need in a website, you are ready to develop your site in a suitable product such as Macromedia Dreamweaver. There are also people around who can help you to design logos, site graphics, or design templates. Check your local university for talented young designers who will work for a affordable price.