Step 4a: The Zoom Creates Website Design Process Series – How Zoom Creates a Sitemap

Zoom Creates Website Design Process with J.R. Johnson

Step 4a: How Zoom Creates a Sitemap


Step 4a in a series that illustrates the Zoom Creates process in Designing, Developing and ultimately Launching a website for our client, J.R. Johnson Inc.










In Part Three we described what a sitemap is and what role it plays in planning the finished website. As explained in Part 3, the sitemap serves to organize all the information on a website in a way that makes site navigation easy and intuitive. Creating the sitemap is like creating a blueprint for the website. Designing the sitemap is often considered the most important step in creating a website because, as Corrina, Zoom’s Art Director points out, “Creating a sitemap forces you to conceive of the design and content in terms of the end product.”

To organize the sitemap for J.R. Johnson, we had to segment and arrange their business in a way that fits into a hierarchical sitemap layout. In most cases, we will take into account the established industry standard of organization that site visitors already know. With this standard organization in mind, we tailor it to the business. If there is no standard or the standard can be improved upon, we will start with that standard and rearrange it until it becomes most effective.

How to arrange a sitemap

Site pages colored by relevance.


We began with the sitemap of J.R. Johnson Inc.’s previous website as a template. Unfortunately, one reason that J.R. Johnson Inc. needed a new website was that the organization of their previous website was unclear and overly complicated. In our office, we often hear Zachary, our Director of Digital Marketing, say, “This is a maze, it needs to be a hallway.”




To provide site visitors with a hallway to what they are looking for, we consulted with Alisa Gaylord, J.R. Johnson Inc.’s Director of Business Development and Client Services, and we re-categorized and prioritized pages from the previous website by visitor relevance.

How to arrange a sitemap.

Most relevant pages are most easily accessible.





We then brought those pages to the forefront of the website and made them easily accessible from the homepage and one click away from any page of the site. (Side Image)




The final version of the sitemap highlights the most important reasons to visit J.R. Johnson Inc.’s website: information on the services they offer, and how to contact the company for these services. The challenge of the next step in creating a website is to organize and prioritize information in the same way but this time for the visual layout of each page. This visual mock-up of each page is called wireframing. In the next post, we will describe how wireframing begins to plan out the site structure, page organization and overall user experience.


To follow this series, “Like” us on Facebook or subscribe to a feed below.

See the rest of  Zoom Creates’ Web Design Process Series for J.R. Johnson



Step 2: The Zoom Creates Website Design Process Series – The Discovery Meeting 

Step 3: The Zoom Creates Website Design Process Series – Research

Step 4: The Zoom Creates Website Design Process Series – What is a Sitemap?

Step 4a: The Zoom Creates Website Design Process Series – How Zoom Creates a Sitemap

Step 5: The Zoom Creates Website Design Process Series – Wire Framing

Step 6: The Zoom Creates Website Design Process Series – Design Approach

Tags: , , , , , , , , ,

One Response to “Step 4a: The Zoom Creates Website Design Process Series – How Zoom Creates a Sitemap”

  1. consulta says:

    Commonly I really don’t examine article on blogs, but I would wish to say that this specific write-up pretty obligated everyone to take a peek with along with implement it! The composing flavor has been impressed us. Appreciate it, very good article.


Leave a Reply