Embarking on a new website build? Creating a visual sitemap is an often-overlooked step that can help you improve client relationships and overall productivity. They’re also super simple to create with the right tools.

In this post we’ll explain why you would should create a visual sitemap and show you some easy tools (from whiteboards to WordPress plugins, we’ve got a great one from Mind Doodle for you to check out) that will help you create one.

When planning a new WordPress site build there are some common steps most people take.

First you might sit down with your client to discover their goals.

Then you’ll probably dive into a discussion about the purpose of their website.

Finally, it’s time to transfer all of this into a plan and work through the possible structure of their site.

Now, although this sounds like a straightforward workflow… what happens if these plans get lost in translation?

Or worse, what if you’re cleaning up a site littered with duplicate content, or that contains a structure that wasn’t well thought out prior to release?

Visual Sitemaps Could Be The Missing Link You’ve Been Looking For

And in this article we’ll be showing you how easy it is to create a visual sitemap in WordPress – as well as diving into the benefits of sitemaps in general.

But first…

What are Sitemaps?

A sitemap is a list of all the pages that make up a website. They’re often used by a developer, designer or website owner to plan a new website or rethink an existing web structure.

Visual sitemaps on the other hand, show the hierarchy of web pages and the relationships between them.

So how do they stack up against your usual kind of sitemap?

Let’s examine the main differences.

The Difference Between a Visual Sitemap and an XML Sitemap

The main difference between a visual sitemap (or site map) and an XML sitemap is that the former is intended for humans and the latter for search engines.

The concept of a sitemap for humans is easy to grasp, as the image below shows.

Sitemap illustration

Use this sitemap to communicate your website plan to clients. (Source: Pixabay)

An XML sitemap for a search engine, on the other hand, informs search engines about pages on your site that are available for crawling.

It does this by listing all the URLs for a site with additional metadata about each URL – such as when it was last updated, how often it usually changes, and how important it is relative to other URLs in the site.

This allows search engines to crawl the site more intelligently and discover pages from links within the site and from other sites.

XML Sitemap

Use an XML Sitemap to help search engines crawl your website and index your web pages.

Note: Smart SEO plugins like SmartCrawl include a built-in XML sitemap generator, so there’s nothing you need to do to generate sitemap files to help search engines crawl and index your content, other than to install and configure the plugin. Learn more about Smart Crawl.

The Benefits of Working With Visual Sitemaps

There are many benefits to working with visual sitemaps. Some of these include:

Show Your Client Their Visual Sitemap

One of the biggest benefits of creating a visual sitemap is that you can communicate website structure to your client quickly, in a visual way that is easy to understand. This helps you kick-start a WordPress project in a simple and logical way.

Create Meaningful Context For Your Client

Depending on the type of clients you have, their day-to-day responsibilities might run far beyond their WordPress sites. Some might not know much about websites at all.

In these cases, you need to find new ways to explain the intricacies of your website development project for someone unfamiliar with WordPress to understand.

Making a visual sitemap creates a meaningful context for your client. Think of it as a reference point that you can build your project from. Sharing a visual sitemap brings a whole new meaning to “Show, don’t tell.”

Offer A Visual Edge To Client Liaisons

For those of us who are visual people, using visual tools makes the collaborative experience a whole lot easier, simpler, and more pleasant.

Even for your clients who have a good grasp of their web structure and have owned WordPress sites for years, a visual sitemap saves time and effort by putting you and your client on the same page from the very beginning. There can be no confusion when you are both looking at the same visual structure.

What’s more, improving client communications by providing a visual sitemap gives you an advantage over competitors.

Take a Collaborative Approach For Client Work

Another advantage of making visual sitemaps is that you can use them to create site structure collaboratively with your client.

Using a collaborative tool like Mind Doodle’s Visual Sitemaps & Tasks plugin for WordPress, you can benefit from visual context with a sitemap that is more than a graphical tool.

You and your client can drag-and-drop pages around the sitemap to update the actual structure of a WordPress site. You can also use online chat that hooks up with tools like Slack and add tasks for Mind Doodle’s Task Board to develop a plan of action for the next steps.

Use a Visual Sitemap To Clean Up a Site You Inherited

Let’s face it, sometimes you find yourself working on a site that’s a bit of a mess.

This may be no fault of your own, and sometimes it’s not the fault of your client either. Perhaps they inherited the website from a former colleague, just like you took it over from another developer.

If you find yourself responsible for a WordPress site with a lot of heritage and many, many pages of content, it can be difficult to know where to start. That’s where visual sitemaps come in.

Creating a visual sitemap of all the pages on your site helps you see the bigger picture. You might be surprised to find some unnecessary pages that you no longer need or pages that would work better if they were nested or placed in a different section of the site.

Declutter Site In Exchange For Concise, Accurate Information

With a large number of pages to manage, it’s possible that content that is no longer current or relevant, such as discontinued features or services, may still be live and available to web visitors when they should not be.

The visual sitemap brings these pages back to the surface so they can be dealt with appropriately and not simply forgotten about.

Avoid Duplicate Content

Although it’s highly unlikely that you will find identical pages, you may discover duplicated messaging across multiple pages that can be made more concise and combined into a single page.

This makes it easier for web visitors to find the information they need. It also makes it simpler for a website manager to maintain their site and ensure the content is always relevant and accurate, and (importantly for SEO) unique. Everyone wins!

Structure Information With a Visual Sitemap

A well-structured site will help your site visitors navigate their way to the information, products, and resources they require or provoke the call-to-action you want them to take.

Think of it as information architecture. You craft every website for a purpose, and you need to carefully consider how you structure a site, just like you take care with designing, developing, testing and copywriting.

Improve Usability and Navigation

Use a visual sitemap to craft usable, accessible and intuitive navigation that allows web visitors to get from one page to another in just a few clicks.

Focus on your web visitor’s journey and expectations, too. It’s important that visitors navigating through your website land on the pages they anticipate. This creates a good user experience, which also brings business benefits.

How are your website’s pages linked together? Are they organized in a manner that’s easy for a user to navigate? How about Google? After all, website structure is important for SEO, too.

Google’s spiders should be able to navigate your site structure. Click-throughs and bounce rates, as well as the time spent on each page, will also impact Google’s algorithms.

Make Your Site SEO-Friendly

Your site’s structure helps a search engine interpret your site. Search engines should be able to crawl through website content to understand what the site is all about and determine which keywords should bring up the WordPress site in search results. Pages that are linked together make it easier for search engines to do this.

Creating a visual sitemap that includes both page hierarchy and internal links will give you a much better idea of how crawlable your site is.

How To Create a Visual Sitemap

There are a variety of options for creating a visual sitemap, including online and offline:

Use Sticky Notes

One way to create a visual sitemap is to use sticky notes on a wall.

Label each sticky note with the name of a page or section of your site, add brief descriptions and any notes you or client raises during the process, and organize these in a hierarchical structure on a wall to create the layout of the site (tip: use different colors to separate sections of the site or indicate nested pages).

Just remember to take photos of the end result before the cleaners come around so you don’t lose your work.

People looking at a wall of sticky notes

Give your clients the most fun they’ve ever had and create a visual sitemap using sticky notes!

Use Pen or Pencil & Paper

Many great ideas were borne from simple sketches made on the back of a napkin.

Using a pen or pencil and paper is a straightforward way of creating a visual sitemap and allows you to work with your clients anywhere: a coffee shop, bar, park bench, or even the back of your limousine.

Planning a website using a pencil and a notepad

Drawing a visual sitemap using pencil and paper is great … until the client changes their mind about their page layout!

Use A Board

Most offices have whiteboards. You can create visual sitemaps on plain whiteboards, an interactive whiteboard, even an old-fashioned chalkboard if your client happens to be a school or learning institution.

Illustration of a whiteboard presentation.

A whiteboard is a great tool for planning websites and creating sitemaps.

Use Online Tools

A visual sitemap tool like Mind Doodle lets you easily visualize and document sitemaps on the fly.

Combining visual thinking with built-in tools like task management and online chat allow you to offer clients the added convenience of scheduling workflow tasks and working on sitemaps collaboratively and remotely.

Mind Doodle - Mind Mapping & Task Management

Mind Doodle is an online mind mapping and project management tool.

Use A Free WordPress Plugin

No doubt you’ll be building or redesigning your clients’ sites using WordPress, so why not use a visual sitemap generator that actually builds your site for you as you design and rearrange its page structure?

Mind Doodle Visual Sitemaps & Tasks is a free WordPress plugin that lets you create a visual, interactive sitemap while streamlining the website development process.

Mind Doodle Visual Sitemaps & Tasks

Use Mind Doodle to generate sitemap files visually and interactively.

The plugin includes access to a built-in task management tool that facilitates the creation of your website.

As you create a visual sitemap in the same way as you would create a mind map using drag-and-drop to update parent/child pages, the plugin then instantly builds WordPress pages for your site, adds them to your sitemap, and automatically creates your website menu system.

Here it is in action:

[embedded content]

We also highly recommend installing our SmartCrawl SEO plugin and using it together with Mind Doodle.

*P.S. WPMU DEV members you also have access to a special Mind Doodle deal if you’re interested. Head to our Partner Page for more details. Not a member yet? Sign up for a free 30 day trial silly!

Don’t Overlook Visual Sitemaps During Your Next Site Build

Hopefully this article has given you a better understanding of sitemaps and why they’re useful.

If you’re up for it, on your next build try using both an XML sitemap (for search engines) and a visual sitemap (for easier visitor navigation).

You’ll seldom go wrong combining both of these crucial “site-mappers.”

Tags: