What is a Sitemap? A sitemap, also spelled site map, is an inventory of all the pages on a website. A visual sitemap organizes this list in a hierarchy, giving it a structure much like an organizational chart.

Types of Sitemaps

There are three types of sitemaps most web developers usually want to create: an XML sitemap for spiders and search engines, an HTML sitemap for site visitors to browse, and a visual sitemap for website planning and development.

Most XML sitemaps are automatically generated. You can find apps for generating a sitemap using a quick Google search. Some apps will translate that generated sitemap into HTML code that you can stick on your site for human consumption. Alternatively, you may want to create a more stylistic interpretation of your site and only call attention to specific pages or create a better organization than just a flat list of all the pages on your site.

A visual sitemap can also be automatically generated. This works well if you want a visual inventory of all your content and if you want to understand the information architecture of an existing site at a glance. However, a visual sitemap can also be an essential planning and optimization tool. It can also be used to plan out a brand new site with new architecture.

Sitemap example

Two Approaches to Creating a Visual Sitemap

In SmartDraw, you can create a visual sitemap one of two ways. You can generate one using SmartDraw's built in site crawler. This is an easy way to get a quick inventory of all your existing pages and see where you may need to optimize or reorganize.

Enter URL

You can also manually create a sitemap, much as you would make a mind map or org chart. Use SmartDraw's SmartPanels to add new pages and organize them into logical groups and, eventually, directories. This approach is useful if you want to create a more high-level discussion about your site's information architecture without worrying about the details. In this case, the goal wouldn't be to document every single page, but to show visually the basics of your site's organization to stakeholders and developers.

A visual sitemap will help you

  • Plan
  • Visualize
  • Organize

When to Use a Horizontal or Vertical Orientation for a Sitemap

Horizontal sitemaps are probably more common because they're well-suited for sites with lots of upper-level directories. The top-down approach makes it easy to differentiate pages based on where they fit into the hierarchy. For example, it's easy to see at a glance that page x is four levels deep.

A vertical sitemap may be more useful for planning out navigation and site flow, especially for sites that don't have a lot of high-level directories. Because we read left to right, a vertical sitemap helps to visualize a user's path through your site's organization.

vertical sitemap

The Importance of Sitemaps

Having an XML sitemap is a no-brainer if you want your site to be indexed by search engines. While creating a visual sitemap may seem unnecessary since it doesn't directly affect the functionality of your site, the fact is that it's no less important than a sitemap created to be read by search engines. Think of the visual sitemap as the foundation or blueprint for your website. You wouldn't build a house without first having an architect create a plan. The sitemap is your information architecture blueprint. Before you build hundreds or thousands of pages, a sitemap allows you to discuss, collaborate, plan, and assess.

A sitemap will allow you to determine the navigational structure of a website and make changes to enhance and optimize the user experience to create better user engagement.

Card Sorting

Before diagramming your site, you may want to go through a card sorting exercise. This allows your team and stakeholders to group content logically and then to label these groups. These can become your high-level site navigation and your site's taxonomy.

Sitemap Notations

You may find it helpful to use different shapes, outlines, or colors to denote different types of pages or directories. There's no one way to do this. However you choose to present it, make sure to include a key. For example, you can use red or a dotted outline to denote future or proposed pages and organization, with a key denoting this for users.

sitemap notations

Tips for Creating and Maintaining Sitemaps

When trying to reorganize site content, be aware of possible stakeholder fatigue. Don't try to tackle thousands of pages at once. Always start at a high level before getting lost in the details.

When designing new site architecture, test your organization and sitemap with a variety of different users. Your assumptions may work with one group, but not another. It's best to resolve any conflicts early.

A sitemap should never be created in a vacuum. Your site's organization should be measured and tested against clear business and user experience objectives. If something is many levels down, it's probably buried and hard to find. Is that a good or bad thing?

It's easy to make a sitemap then forget about it. But for a sitemap to be useful all versions should be updated frequently.