Why are site maps important?

Building a smart and useful website is more complex than many people realize. When putting a site together, a considered and analytical approach will improve user experience and encourage conversions.

Content management systems and similar services make creating a website easier then ever. Even without a background in Web design or development, any technically savvy entrepreneur need only purchase the right tools to put up a professional-looking website.

While platforms provide beautiful templates integrating tried and true design elements, knowing what pages to create and how to place them is up to you. A customer's ability to navigate a site and find what she's looking for depends on a clear and intuitive page structure. The more products your site sells, the more pages your site requires, the more important it becomes to plan out your navigation before putting together a single Web page. This process is known as site mapping.

Determine site goals and audience

The goal of an ecommerce site is to sell a product, but determining the best way for your customers to navigate your site requires a more in-depth analysis. A website's goals are determined by several factors:

• Who is the target audience for your website/product?

• What functions, pages or applications will expedite your audience's use of the site?

• What customer needs will your site fulfill?

When creating a profile of your audience, be specific. The needs of a tech-savvy twenty-year-old may be very different from the needs of a senior citizen. Knowing who will be visiting your site and what they'll be looking for helps define the content.

Determine the content areas and group them together

Once you know your audience and their needs, you'll have a better idea what they look for in a website such as yours. Brainstorm your content areas. Think of every type of page your audience wants. As you brainstorm, you'll find that content falls into broader categories. Begin to group your content by those categories.

For instance, a t-shirt store may brainstorm the following content needs:

• Men's short sleeves

• FAQ

• Women's baby doll t's

• Legal disclaimers

• Blog

• Shopping cart

• Men's long sleeves

• Women's regular t's

• Children's shirts

• Wish lists

• Mission statement

• Account information

In this example, the content could be sorted into five general categories: men, women, children, customer account information and about us. These major content areas will later become the website's top-level navigation.

Organize the content areas with a site map

Organizing the content areas isn't simply about lumping pages together beneath a label. Designers decide which categories should come first in the top navigation (or be placed elsewhere on the page, such as the top-left of the header) and which pages should be listed first in the navigational dropdown menus. These decisions are based on the work you did earlier, determining which goods or services your customers will value the highest.

Below is a sample site map based on the t-shirt store example:

An example site map for a website that sells t-shirts outlines the hierarchy of each page.

Much like a family tree, a site map grows outward from parent pages to child pages. In this case, the home page is the start point for the customer, and all navigation proceeds from there.

The four main categories are placed below the home page, connected by lines that show the relationship. Those are the main navigation items. The smaller rectangles below the main navigation denote the child pages. If your site has dropdown menus, these are the categories which will appear when the user hovers over the main navigation label.

Note that account information is set apart from the main navigation. On most ecommerce sites, account info is not part of the standard navigation. Instead, it is set apart in a prominent place, usually the top left of the page, so that it is easily seen and accessed by the user. The site map reflects this organization.

The above example is simple compared to most websites. Child elements of top navigation labels may themselves have multiple child elements. The shopping cart, for example, naturally has many subpages and tangents, all of which should be mapped. In addition, designers denote links between pages using dashed lines to anticipate a user's path to and from content areas.

Having a site map is not only important for planning, but it provides invaluable insight into the structure and depth of your website.

Refine and design the navigation

Once the site map is drawn, designers have an opportunity to fine tune the navigation and decide where to place navigation elements on the page.

This is the time to give the navigation categories clearer, catchier or more succinct names. It is also the time to decide if navigation should be moved to places other than the top. For instance, it might make more sense to place the "About Us" section in a sidebar or the footer, giving the product navigation better visibility and room to grow.

Site mapping is complex and time consuming, but it's essential to creating a seamless and intuitive experience for your customers. By taking time and care, designers catch incorrect or confusing labels before they reach the public. They also discover pages, functions and applications that might have been missed in the initial brainstorming.

Catching omissions in the mapping stage is a great deal easier to fix, especially if a missing page necessitates a major re-categorization.

Site mapping then leads to wire framing - a simple, text and line drawing of a typical page layout. It may seem like a great deal of preparation. Any Web designer will tell you that it takes five times longer to map out and design a site than it does to actually code and make it live. But the preparation will save time and money in the long run.