Basics of Information Architecture (IA) for Websites

Anindya,  Thursday, August 2nd, 2007

Definition:
Information Architecture (IA) is the art and science of structuring data, and defining user interactions before actually creating the website.

Why IA is important?
It is the blueprint of the site upon which all other aspects are built. They are:
1. Form
2. Function
3. Navigation
4. Interface
5. Interaction
6. Visual design

Steps of IA:
1. Define goals of the website
2. Define the user experience
3. Prepare/gather website content
4. Define website structure
5. Create visual design

1. Goals of the website
Defining website’s goal gives us a clear, well documented idea of what we want to build.

Steps:
- Ask questions
- Filter the answers
- Prepare design doc: “Website Goals”

2. User experience
User Experience is the overall experience and satisfaction a user has when using a website (or product or any system). The experience is commonly defined in terms of “ease-of-use”.

Steps:
- Define the audience
- Create common scenarios
- Analyze competitors
- Prepare design doc: “Audience, Scenarios, and Competitive Analysis”

3. Website content
In this step we have to gather the content for creating the structure and organization of the site. You will need to answer two questions:
 What pieces of content does the site need?
 What sorts of functionality will be required?

Steps:
- Identify content and functional requirements
- Group content
- Label the grouped content
- Prepare design doc: “Content and Functions”

4. Website structure
It is the skeleton of website which holds the body made with information and data. Ease-of-use of a website is primarily defined during this step.

Steps:
- Website structure listing
- Define navigation
- Prepare design doc: “Site Structure and Navigation System”

5. Visual design
In this step visual materials (layouts) are developed to create an experience. Visual Design includes: Graphic Design, Illustration, Typography, Layout, Color Theory, Iconography, Photography, etc.

Steps:
- Layout Grids
- Design Sketches and Page Mock-ups
- Prepare design doc: “Visual Design”

Filed under: Usability, Web design 3 Comments

3 Comments

Soo

steps of an IA process should include – 4. create affinity diagrams 5.define website structure 6.create wireframes

Anindya

Soo: Your are right. But I wanted to give more basic view to the subject.

Nick

How long should the total document be?
I’m including all the different breakdowns into one document and I want to make sure it has enough information but not an excessive amount.
I’m describing a service-based site with lots of scenarios that further highlight the use and practical function of the site.

Thanks.
This blog is not only informative but is filled with smart and insightful posts!

Post Your Comments: