How to Create a Sitemap for Your Website

First off, what is a Sitemap?

As the word implies, it’s a map or layout for your website. This includes a documented hierarchy of all of the pages and their corresponding URL’s that live on the website.

What is the purpose of a Sitemap?

There are two reasons that you typically want to make a sitemap (well three… but we’re only going to get into two).

Triggering search engines to crawl your website.

This happens when a site is newly launched or has had some major updates done to it. It is a coded version of the map of your site, usually submitted in XML, HTML or JSON format to search engines, so they can easily crawl the pages listed and rank the content.

The following resources are electronic versions of where this map can be generated.

XML Sitemaps

SEO Spider

There is also an awesome article on Moz about the value of creating digital sitemaps.


The second use is the one that we are going to discuss today.

Creating a Visual Representation of the Network of Pages On Your Website

This should be one of the first steps taken when creating a new website. In order to organize the design and user-flow of a website, we need to determine the following:

— Which pages are necessary?

— What is the user flow from one page to the next?

— How do people get back to Previous, Home or Dashboard pages from any given place on the site?

— Is there support or contact info available anywhere on the website?

— What featured does each page include, and where do those featured take you (or any activity on the site, like an accordion, or hover for more info)


My preferred method for mapping out the initial stages of a site is with a pencil and paper, but there are digital versions below as well:


Adobe Illustrator

Google Drawings

AWW Whiteboard


End Result

At the end of your mapping sessions, you should be able to have the following items complete, to provide to a designer

— Number of pages on website

— What pages are linked to what (user flow)

— Key features of each page


PS: Below is an example of a client sitemap I’ve created to give you an idea of what they can look like (created in Adobe Illustrator).




Let us know in the comments below your favourite too for creating sitemaps.


Leave a ReplyJoin the Conversation

Your email address will not be published. Required fields are marked *