This short article gives some insight into how Information Architecture is used when developing websites. So, for those of who want to retain your writing skills and move into web-facing career, maybe Information Architecture is worth exploring.

One of the alternative careers I’ve considered as a Technical Writer is Information Architecture. Information Architecture is worth considering if you’re attracted to organization of data, for example, indexing, rather than writing. I get a bit tired to typing at times and enjoy other tech comms activities such as analysis, diagramming, and documentation planning.

Using Cards To Index, Organize and Structure User-Focused Websites

In order for any site to be successful, you need to  arrange the information so that users can make find the relevant  content quickly. While most websites are content-driven, many designers underestimate how difficult it is to arrange a site structure that is easily understood by both novice and experienced users.

Why is this?

Maybe it’s because we are trained from childhood to retrieve data in certain ways, for example in library systems we use chronological order and subject categories; or alphabetical listings in phone books, and later we use this method when using other media such as the Internet.

The Role of Information Architecture

Prior to any graphic design or coding taking place, an Information Architect will gather, sort and organize the content.

Card sorting is one way to organize groups of information:

• Create cards for all the topics on the site. For example, if it’s a sport portal, create cards for Football, Basketball etc
• Sub-divide these categories into Leagues, Players, Stats, venues etc that are most appropriate.
• Label them as you work and cross-reference any cards that overlap.
• Define the optimal organization structure based on the data you have gathered.
• Test the structure by performing mock tasks i.e. how do I find information about Michael Jordan, when he played softball.

Prepare Flowcharts
Next, prepare flowcharts that outline the overall site structure, showing all pages, respective navigation paths between sections and content labels. The advantage of using a flowchart is that all parties in the development process can see the site’s information architecture structure and make suggestions to remedy, alter or delete sections as needs be.

Unless information is flowcharted there is likely to be misunderstandings between departments when the site is released.

“I’d thought that it would do this…”

“I’d thought that it would be more energetic…”

“I’d thought that it would be, y’know, different…”

Breakdown Each Page
Then for each main section prepare an itemized list of its contents.

Include text, images, sounds, video clips, audio clips, applets and all downloadable items.

List all links and their destination pages.

Divide the links which appear on all pages, i.e. Contact Us, from those that will only appear on specific pages. If this list is being prepared in Excel or Word it is useful to color-code the lists for quicker reference.

By breaking down each page you will reduce any misunderstanding about its content objects and its functions. For example, designing pages within a Shopping Cart require considerable attention to detail as each separate page needs to be prepared correctly. Any omission of data may cause the user to leave the shopping section and search for it elsewhere.

Design for Breadth
Studies into HCI and Usability have shown that users get disorientated once they go past the third level of depth on a site. Therefore your site plans should enable users to find any data within three clicks. If you can’t achieve this with the current design then go back to the flowchart and begin again — the rewards will be worth the efforts.

Prior to any graphic design takes place, it is necessary to gather, sort and organize the content. The more time spent on this the greater the ability for users to retrieve your data.

Finally, when performing user analysis record how users perform tasks and make modifications to the site structure based on this feedback.

Remember websites are built to please users, not graphic designers.

Use the feedback to record the steps users take to perform tasks. Create flow diagrams showing the relationship between each content object and their surrounding elements based on the test subjects performance.

PS – If you want me to cover this in more depth, please say so in the Comments below.

About the Author: Ivan Walsh is a technical writer with a weakness for documentation plan guides. His also runs a video marketing blog at www.videocameraschool.com

Related posts:

1. Content Strategy: Using Cards To Index, Organize and Structure Websites
2. Word Plugin for Printing Business Cards
3. 9 Ways to Sharpen Your Web Site

You want to take a screenshot of something and not have to fix it when you’re finished.

Screenshots can be tricky if the window, dialog box, or application floats over the main screen. Instead of taking a screenshots of the entire window, you can automatically take only the most active window.

Here’s my favorite trick when taking Print Screens. Some people call these screenshots or screen dumps.

Tip: The print screen button (PrintScrn) is next to F12 on your keyboard.

1. To take a screenshot, press PrintScrn.

2. Open Word and Paste (Edit, Paste) the screenshot into your document.

This is fine if you’re capturing the entire screen.

But what do happens if you’re using an application, such as SAP, with multiple floating screens?

You don’t want to capture all these screens floating over each other. It looks terrible and too much work to fix in Paint.

So, how do you capture the active ‘floating’ screen only? Is there a quick way to avoid editing the entire screen?

Here’s the trick!

Hold down ALT and then press PrintScrn.

This captures the active screen only. This trick can save you many hours editing and tidying up images.

Related posts:

1. How To take Screenshots of Floating Windows
2. Using Paint to take Great Screenshots
3. Using Paint to take Great Screenshots