If you are creating a website without a sitemap it can be hard to see how the pages relate to one another. A sitemap provides your team with a clear view of what the structure of the website should be before the design and development of it begins. It can help to structure the content, visualize user journeys and ensure that the website supports the user needs and business goals.
A sitemap is a handy place to start if you need to build a new site or plan a redesign to work out what pages you need and how they should link together. Creating a site map at this point can also help your team in identifying gaps before they become development issues.
What is a Sitemap?
A sitemap is a document that sets out the structure of a website. It displays the hierarchy and relationship between pages and is used as a planning tool for the web design and content organization.
If you ask about the appearance of a sitemap it can be structured as an outline or a visual diagram depending on what the website team wants to plan and review of the structure.
How Does It Help?
A well-structured sitemap will help your team:
- Improve Usability: Group content in a way that makes it easy for users to find what they are looking for
- Structure Site Flow: Establish the connections between pages and the paths that users will take when navigating your site
- Align With Business Goals: Build the content architecture around your website’s core messages and calls-to-action
- Plan Effective Navigation: If you have an idea of how your website is going to look like, it’ll be easier to design the navigation.
Sitemaps are usually full of the names or IDs of pages related to the hierarchy and grouping of content. If a visual sitemap includes symbols or colors a legend can also be used.
Ways to Represent a Sitemap
A sitemap is normally seen in two formats:
- Outline Format: Lists pages in a structured hierarchy and shows parent-child relationships
- Diagram Format: Displays a graphical diagram to demonstrate the relation of pages and sections.
The format you choose will depend on how large the website is, the number of pages, and the way the sitemap will be reviewed by stakeholders.
Note: A website planning sitemap is not an XML sitemap. An XML sitemap is a machine-readable file that lists the URLs that help search engines discover and crawl the pages of a website.
Sitemap Outline
A sitemap outline or outline view is a simple way to display page hierarchy.
That can be written as:
- A list in structured format with indentation
- Diagram of a horizontal tree similar to an organizational chart
- A page hierarchy vertical or horizontal
In the early planning stages, an outline is often useful because you can move, group or delete pages without having to create a complex visual diagram.
Sitemap Diagram
A sitemap diagram is a visual map of the structure of a web site. It uses boxes, lines, icons or other visual elements to show relationships between pages and sections.
Below are some tools to help you create visual sitemaps:
- Microsoft Visio and professional design software such as Adobe Illustrator or Photoshop for detailed diagrams.
- Web-based tools such as Gliffy and Creately for creating and sharing sitemap diagrams.
A diagram can help stakeholders, designers, developers and content teams review large website structures more easily.
Tools and Requirements for Creating a Sitemap
What You Need to Create Your Sitemap
Before you create your sitemap, gather the information that will drive the structure of the website.
- Creative Brief: A document that outlines goals, audience, scope and requirements for the site.
- Website Objectives: Information about the features and functionality you’ll need to meet business and user objectives.
- User Goals and Tasks: What users want to accomplish when they visit the website.
- Card Sorting Results: Card sorting organizes pages and content into groups that make sense to users.
Having this information handy simplifies the decision of which pages to include in the main navigation, and where supporting content should sit.
Key Considerations for Creating Your First Sitemap
Before finalizing your sitemap, consider the following:
- User Intent: Why is the user visiting the website?
- Logical User Path: What's the most intuitive way for them to get to where they need to be? Home > Services > Quote Form
- Business Goals Alignment: Does it support the goals and objectives of the organization?
- Page and Content Relationship: How do the pages connect. Is there a logical relationship between related content?
That helps you decide what pages to include and how they should relate to one another within the hierarchy of your website.
Steps to Create a Sitemap
1. Start With a Sketch
First, you want to draw a sketch, a white board or even some sticky notes on your wall. It allows for easy manipulation as you grow your site structure.
At this stage you can also use card sorting to learn how users expect to see information organized. Begin with the main sections, then add subpages and other content. Before you go into a more detailed version, talk about the structure with your team.
2. Refine With Sitemap Tools
Once you have the basic structure approved, move it over to your favorite sitemap tool such as:
- Microsoft Visio
- Adobe Illustrator or Photoshop
- Gliffy
- Creately
- Lucidchart
For smaller projects a document, spreadsheet, whiteboard or simple diagram might be enough. Larger sites can be made with dedicated sitemap software.
Presenting the Sitemap
The sitemap should also communicate the high-level structure of the website to stakeholders and give enough detail to the team so that they understand the scope of the project.
When presenting your sitemap:
- Label Pages Clearly: This can be done by using similar language or numbers throughout your site map.
- Include Future Pages: Keep in mind that they are within the scope of this project and make sure to specify it clearly.
- Keep Client Presentations Simple: Focus on the most important aspects of your site such as the general organization and flows.
Key Questions to Answer for Each Major User Group
Before finalizing the sitemap, ask:
- Who will use your site?
- What are their objectives when visiting your site?
- What tasks will they perform on your site?
Answering these questions will allow you to get an accurate picture of the sitemap that will best suit the needs of your users and fulfill the goals of the business.
Start Your Website Planning With a Sitemap
A sitemap is much more than a list of your website's pages. It is a tool that helps your team reach an agreement on the design of your website before any developments take place.
Beginning with user needs and business objectives will give you a better base for organising pages, navigation and content. When it has been approved the sitemap can be used to inform wireframes, content planning, design, development and SEO work.
Tony
Director and Founder
Inorbital founder and digital solution architect with over 20 years’ experience planning and directing dynamic web presence and web applications for all types of organizations. When not directing Inorbital you can find him actively trying something completely new. You can schedule a meeting with me here