Information Architecture and Interface Design

Web Design October 10, 2007

You may have heard the terms "information architecture" and "interface design" especially when it comes to websites. When there's a good relationship between the two, then you have yourself a decent site.

Information architecture is where you put all of the stuff on your site that drives people to visit and how it's all linked together. Interface design is how you design their interaction with your content and how it's all found.

For example, suppose you want to have a dictionary website that has a list of all the words and their definitions. That's your content. But there are several ways to organize it through the site. For example, you may have a page that lets users browse for words. You may opt to just have a search box. It's up to you as the designer to determine how the user navigates the site to find what he/she is looking for.

This idea goes hand-in-hand with navigation principles (from a previous post). You can present all your content on one page if you want, but that's probably not the best solution. Instead, breaking it down into smaller subsets will make things a lot easier for the user.

So when thinking about information architecture, design where certain content belongs: what goes together? What doesn't? Where should there be links between pages/sections? What should be visible on one page that may not be visible on another?

Once you've developed this sitemap, then you can start designing the interface to make navigating easy and pretty.

An Analogy: A House

The floorplan of a house is like your information architecture. You've decided that there's a doorway from the kitchen to the dining room because there will be a lot traffic between the two spaces and it makes sense to minimize the distance as much as possible. Similarly, it makes sense on a website to link one page with an appropriate other page.

You can think of interface design as how you get from one space to another. What kind of door is between the kitchen and the dining room? Is it a door that opens both ways? Is there a little window from the kitchen to the dining room? What does the door look like and how are the rooms designed? Etc.

Other Web Design Posts