In this post, I will briefly talk about the importance of a site map and site architecture. When it comes to designing and developing a website, it is always helpful to start with a map of the structure. You can carefully by design control how you want your users to interact with the site. Furthermore, you can place information in an order that displays logical and makes sense. While some websites bury you in a maze, remember simple is less stressful on the user. Thus, good Information Architecture is the building block for good user experience.
Site map
Before you can jump into a Site Architecture you have to gather the list of items or pages that need to go on the website. A site map will do that. Here it is important to lay out the flow of information through SILO, sequence and hierarchy and map out a structure that allows the user to access the information they seek quickly and easily. Understanding the user’s needs and expectations is an important part of this process. While good Site Architecture yields good user experience and SEO, poor organizing structure and nomenclature can have a negative impact on the user experience and their trust in the brand, product, and service.
A site map should display all the pages of your site. It maps out the structure in terms of topics or categories, It displays the relation of information through SILO and hierarch. In the above example, the content can be accessed with one click, two clicks, and three clicks. If access to content requires more than 3 clicks then make use of algorithms and/or breadcrumbs to help the user maintain a mental picture of where they are.
Information Architecture
Next, we have to map out inbound and outbound links and identify the different channels of navigation so we can control and guide traffic. In this example, we are repurposing the site map. The lines display links. While outgoing links (to another page) are from the bottom and right, incoming links (from another page) are from the top and left. Here the use of colour, legends and icons can simply communication of information.
At the wow studio, we build the Information Architecture for websites parallel to wireframing and prototyping. It is an iterative process. The client continues to be involved in this process.
Now our site architecture is a bit different. It is visually more informative. For that reason, we call it IA+. You can see in the above illustration that the home is placed in the same row and the 1st Tier. Furthermore, the wireframe of the homepage is placed underneath its 2nd Tier. This way we can customize the homepage.
Algorithms and Site Architecture
In the old days’ navigation was a simple hyperlink to another page. But now there are all sorts of display formats, navigation designs and algorithms that dictate content, interaction and the experience: carousel, accordion, pop up, a new page, iframes. These should be communicated in an IA through the use of icons and legends. We use icons that symbolize navigation and content format.
Compared to SA+ allows us to get a mental picture/overview of the site and opens a different dialogue to create more engaging lively content. Think of this as a blueprint and keep it ud-tod-date. Strategically as the website evolves, the IA+ should be updated.
