Creating a sitemap for your website

1. Website Architecture
Page | 1
The term "Website Architecture" means "the way you organize
your website."
You will want to organize the pages in your website so they are
grouped by sections. The sections have to be labeled so that
visitors can easily understand them without having to think.
The whole point in doing this is to make it easy for your visitors
locate topics and pages they are interested in. If you have good
website architecture, visitors will be able to navigate easily.
Start by collecting content
You cannot organize sections and topics if you don't have
sections and topics to organize. If an interior decorator has a
room and furniture to work with, you, as a website architect,
need copy and images to work with.
Quite obviously, you need to start by understanding what copy and images will be going into the
website. Even if the copy or images do not exist yet, you have to at least know that they will appear in
the website. So, the first steps are to:
 collect all the copy
 collect images
 list down copy and images that are not yet available but will be needed
What’s the right way to organize?
There is no standard model that can apply to all websites. This is because topics are organized based
on what the owner wants, and how the visitor naturally navigates. In the end it all boils down to
common sense.
The simplest model would be one for the standard "brochureware" website. Common sense will tell us
we have to start with the HOMEpage. Then you want the visitor to know about the company, so there
should be an ABOUT US section. The owner would naturally want to offer the products or services so
the next section would either be PRODUCTS and / or SERVICES. When the visitor is interested in buying
the products (or availing of the services) he / she may want to do two things: go to a store, or call.
Therefore, there should be a STORES page and a CONTACT page.
If this were the case, the sitemap of the website will be:
For your final project
You will be asked to create a
sitemap for your final project.
Use the concepts here to come
up with one. Remember, the site
for your final project should be at
least THREE LEVELS DEEP.
Doing it on MS Word
MSWord has a graphic tool to
create organizational charts. I
encourage you to use it.

2. Website Architecture
Page | 2
Let's say we were making a sitemap for a computer distributor. It would best to organize the products
by type. In this case, the most basic categories would be HARDWARE, SOFTWARE, and ACCESSORIES. It
makes sense for the visitor to jump to either of the three depending on what he or she is looking for.
If this were the case, the sitemap would look like this:
We could go on sectionalizing these different areas by operating platform, for example. In this case,
each of the sections might have a PC subsection, and a MAC subsection.
We will draw it like this:

3. Website Architecture
Page | 3
Figure 1: Operating platforms last
Let us stop and ask ourselves if this is the natural way visitors would navigate the site. Would it seem
more logical for visitors to first select the operating platform of their system?
If this is the case, we would draw the sitemap this way:
Figure 2: Operating platforms first
Both Figure 1, and Figure 2 have the exact same components, however, the way to navigate them are
different. If common sense cannot tell you which one to use, you may resort to testing or research.
Find out what your target visitor is most likely to do.

4. Website Architecture
Page | 4
In this case, researchers have found out that computer users are quite loyal to their operating
platform, and therefore would navigate better using the sitemap in Figure 2, where they get to choose
the operating platform early on.
You should keep subdividing sections until it is no longer logical to subdivide anymore. Let us continue
subdividing the PC SOFTWARE section. Software could be categorized into three: UTILITIES (to keep the
computer in tip‐top shape), PRODUCTIVITY (for doing work), and GAMES.
We can still subdivide the PRODUCTIVITY section into different work types: GRAPHICS, PHOTOGRAPHY,
MUSIC and ANIMATION.
If this were the case, our sitemap would be like this:
You should do the same thing for UTILITY and GAMES if they can still be subdivided.
You might choose to put news snippets or press releases on the Home page, or you might choose to
have a separate News section. That's an Information Architecture decision.

5. Website Architecture
Page | 5
Taking the placement of News items as an example, there are several considerations that you might
take into account:
 Site’s goals: Do you want all visitors to the site to be made aware of all the latest news?
 User’s goals: is company news of interest to all visitors to the site?
 How much news is there truthfully likely to be? Is there enough to put on its own page without
looking bad?
 Are news snippets standalone, or do they link to articles or press releases?
 Is all news relevant to all users of the site, or is it more appropriate to divide it by
product/service/region/user group, etc.
For a simple e‐commerce site, you'd add your list of products, and a shopping/purchasing process. The
products may naturally belong in separate categories.
With more content, there are more choices to make, and the way you choose becomes more
important. It simply isn't possible to describe everything on one page; you have to start splitting a site
up into sections, and provide useful navigation between those sections.
Architecture mirroring real systems
The most obvious starting point (particularly to clients) can be to arrange content on the web site in
the way it's arranged in real life.
For example:
 A different section for each geographical sales region (Europe, U.S., Asia)
 Sections for each area of business (e.g. sales, service, fulfillment, human resources)
Check out Qatar Holidays.
Architecture based on users' goals
An alternative approach is to follow your users' goals and structure your pages around their likely flow
through the site.
For example:
 A site that sells train tickets might have "Quick booking" from the home page, favourite
journeys for registered users, and "Trip planner" that lets users book hotels and car hire at the
same time.
 A software vendor might construct their site around their different audiences

6. Website Architecture
Page | 6
o Technology expert is offered "Technical white papers" or "Feature comparisons”
o Business buyer is offered "Benefits of switching to us" or "Business case studies”
o Press audience is offered "Press releases" and "Press contacts”
o Hackers looking for clues to penetrate the software are offered nothing at all (in this
case fulfilling the company's goal, not the user's!)
These types of content or function don't necessarily map to the organization’s own structure or
product range. They're designed around the needs of the different groups that might use the
site.
Check out MetrobankCard.
Multi‐dimensional architecture
Sometimes, it is appropriate to offer many views, not a single rigid hierarchy.
Taking an online bookstore for example, which shows how you can offer many routes to the same
content, and show that content in many different views:
 It might let users browse by category: which will be a many‐levelled tree, but one book can be
in more than one category
 Users might want to search for a specific author or title
 To increase sales, the site would also advertise other titles similar to the ones the user is
interested in
 Smart content management can offer plenty of other cross‐selling opportunities, such
promoting "people who bought this also bought", "this is recommended by 90% of the people
who bought it", "Buy this together with that, and get 33% off" etc. etc. etc.
Check out FullybookedOnline.
What structure is best?
Website Architecture is a huge topic with its own text books. In general, though, it is common sense.
There are lots of ways to arrange content and functions, and it's usually a case of working out which
will work best. It's hard to get it very wrong; the goal is to let different types of user succeed.
A simple Information Architecture is basically wide and flat. Any pages could be accessed from any
point, because the whole structure was exposed via the side navigation.

7. Website Architecture
Page | 7
While this is a very straightforward model, it could take quite a lot of decoding to scan and navigate
this many elements. For that reason, I've overlaid a pseudo‐tiered structure, which arranges the
articles into main sections (Home, Basics, and Principles), and sections within those (such as 'Web
design process', 'How people use web pages', and 'Other online factors' in the Basics section). Note
that this isn't a real‐life order: it doesn't represent any particular workflow or even directory structure.
In addition, some pages provide cross‐reference links to others, and some pages which introduce their
sections link to multiple articles within the section. The result is a rich, unstructured, web‐like
architecture.
This is appropriate for situations where:
 There is a small or moderate number of pages (under 100)
 Page contents are relatively independent, and can make sense in any order
 The information might be used in a number of ways