A Web Designers Guide to Information Architecture

Categories Articles, Web Design

This is a special guest post from Jeff Foster – co-founder of WebBizIdeas, a company providing website development and e-commerce web design.

Web Design and information architecture go together like peas and carrots. Whether you have an information architect to work with or you are flying solo, a basic understanding of the interaction between the two is a fundamental in designing successful websites. Design is a layering process, and a general understanding of information architecture (IA) is pivotal to web designers seeking to excel in their craft. Information architecture is a fundamental cornerstone of a successful website – employing its principles ensures that the site’s users will experience functionability, ease of navigation, and easily discoverable content.

Information architecture is a fusion of arts and science that encompasses research, library science, computer science, graphic design, and psychology and then applies them to the design or build of a website. Designers should be vividly aware of the role information architecture plays in the planning, concept, and design/redesign stages of their projects.

There are certain IA concepts that a designer should always be aware of including the purpose of the site and its intended audience; the organization of the site in relation to the site’s content, labeling of pages, and its navigation schematics. Planning and executing the structural design of site information is necessary and must be viewed from the perspective of obtaining maximum ease of use and intuitive access to content.

Purpose and Mission

Getting a good grasp of you or your client’s intent and goals for the site is key. Web designers should ensure that they are intimately aware of the client’s mission statement, objectives, organizational culture and brand. This first layer is pivotal for it is the basis of the site’s design. The intended audience is another item that should be taken into account at the beginning of the project. The demographics and culture of the intended audience is an important consideration when it comes to laying out of the content and how the navigation scheme is set up. Without this initial purview a site could be wonderfully designed but ineffective for the client’s needs.

Organization of Content

The structure and classification of content will directly impact a user’s ability to actually find and manage the information within the site. Whether you are doing a redesign or designing from scratch you should have a good grasp of the types of content that will be included in the site ahead of time. Organization choices should be made only after an in-depth content inventory is conducted, after the wireframe or blue print visual diagram or site map has been sketched that allows the designer to get a good visual of possible content and structure scenarios. Some basic models for content organization are:

• All in one: the simplest model, all content will be accessible from the same home page;

• Flat: pages are peers and interchangeably accessible;

• Index: based on the flat structure, but provide additional content in the telephone book style;

• Daisy: design for sites that need a workflow pattern of a linear nature- basically returns users to a certain point on the site after they’ve completed a task;

• Categorical strict hierarchy: content on lower level pages can only be accessed via the parent page; and

• Multidimensional hierarchy: provides users with multiple ways of browsing the same content.

Navigational Schemes

Designers have to put themselves in the position of the intended audience when making navigational design choices. Ask yourself, how are most people going to make their way through the site and how can you make it as easy as possible for them to do so? Effective navigational design should at the least do the following:

• Ensure that users are always aware of their location within the site; this allows them to easily browse forward or backwards;

• Hyperlinks should be distinctly set out from content such that they are easily discernable;

• Informing users of where they will be moving to upon clicking the hyperlink;

• Allowing for the usability and availability of the browser back button; and

• Seek to provide the audience with a minimum clicks to get maximum results.


Labeling of sites pages must be done in a logical way that reflects the websites actual content and organization directives. A good way to do this is to make the site map reference CSS compatible. Similar to the cataloging concepts of a library, a site map should clearly define relationships between pages and reflect the similarity between the pages in a meaningful way- i.e. by content type, alphabetically, in phases or in relation to the websites geography.

A smart web designer must balance his or her talent for design with the science of what the website is being designed for. Understanding the principles of information architecture and integrating them with the principles of web design is a key skill.

header image copyrighted by OiMax

Catalin is the founder of Mostash - a social marketing boutique - and he's always happy to share his passion for graphic design & social media.