Building the framework for your website’s content
Understanding what your users want and expect plays a key role in determining how you design and organize the content and navigation on your website. Now that you’ve taken the time to understand how your users expect content to be organized and what terminology they use, you will create your website’s information architecture.
What is information architecture?
Information architecture is the structural design of a website, including the organization and labeling that helps users find content. Information architecture focuses on your users, how they navigate through your site, what technology they use, and what content you provide.
Information architecture produces site maps (website structure) and wireframes (design blueprint) to convey how the site will work from a practical perspective.
What is a site map and how do I read it?
A site map is a planning tool that visually shows how information will be grouped and labeled, where content will be located, and how a user will move through your website. It lists the pages and content organized in a hierarchical fashion that should be read from top down, from left to right.
Homepage
At the top of the site map is your homepage. List the information that will be shown on your site’s main homepage.
Content on the homepage should direct users to relevant information. Homepages often contain several sections including featured programs, short key messages, and lists of upcoming events or news.
Below is an example of a sitemap and the resulting homepage.
Primary Navigation
List the primary navigation (the main menu listed horizontally across the top of the site just below your department’s name) below the homepage information in your site map.
The primary navigation is the starting point of your user's journey through your website. It is located at the top of every page and is consistent throughout the website.
The primary navigation should represent 5-8 sections of content that users are most interested in visiting. It will be read from left to right, so prioritize your tasks starting with the most important / most used tasks on the left.
On the site map, the primary navigation elements will be labeled 1, 2, 3, 4…and presented in boxes near the top of the page. The content that will appear on that specific page will be labeled 1a, 1b, 1c… or 2a, 2b, 2c… etc.
Below is an example showing a site map for primary navigation and the resulting navigation as displayed on the final site.
Secondary Navigation
Content that does not serve the primary goal of the website but is still relevant to the user should go into the secondary navigation.
Each of the secondary navigation elements is a separate webpage that the user lands on when they click on the secondary navigation link. On the site map, these boxes will located under the primary navigation boxes. The secondary navigation pages will be labeled 1.1, 1.2, 1.3… or 2.1, 2.2, 2.3…, etc. The content on these pages will be labeled 1.2a, 1.2b, 1.2c…, etc.
Site Map of the Secondary Navigation:
Meet the Trustees Landing Page (Primary):
Chuck Lillis Landing Page (Secondary):