Design and the structuring of information


Information Architecture may sometimes be a bit abstract for visual designers (and other people too). Maybe that’s why Information Design as a discipline has been growing so much. We’ve never had access so much access to organized information as we do now. How to digest it all? Well, information design makes it easier in a lot of cases.

But not everything can be translated into an info graph, right? A lot of the times information will still have to be delivered in verbal format, or text form. This form, the verbal one, has many ways to be on a web page: paragraphs, navigation, call-to-actions, tags, side bars, links, body text, etc. But which piece of information should be what?

It is said that defining things (or naming them) will help with understanding them, and therefore, using them more effectively. Today I want to talk about how to structure your information in your site based on the type of experience you are offering.

First, you can organize information in four manners: hierarchically, in sequence, indexed, and as cross-reference. Let’s briefly talk about each one.



Well, that’s a Nav (or navigation). Hierarchies have a parent-child relationship, so they are good to view a large amount of information in an easy structured way. Another way is using a table of content. If you have a website with a lot of information to cover and that’s important that people go well through it, focus the attention on the Nav. Make it prominent, make it the star of the show.


If your information is of a certain nature that people need to be assisted through it, or they need to know A before they understand B, then information needs to be delivered in sequence. To be more effective, make that the focus of the site (or of the section). Wizzards are a good example of sequentially structured information. They guide or assist a user trough a process. Sequences are good for tasks; but also for stories.

Sequential structure of information is hot now in mobile site design. The small real state forced designers to break down information in sequences that can be quickly loaded, digested, and moved on from. But they work so well sometimes — because of their “feed-a-little-at-a-time” — that they are also becoming increasingly popular in desktop sites. They do focus the user in a very effective manner.


Index your information when you know the users know what they looking for (they litterally know the name of a document, or a subject they want to read about). Exposing alpha-ordered tags (or showing them through suggestive search) is a a type of indexed information on the web. Alpha-ordered drop-down menus are also an indexed information.

If you’re building a site where most people know what they are looking for, consider exposing your tags — and exposing them with emphasis — or finding a way to expose your indexing. Of course, if you add a creative visual manner to do that exposing that, all the better.


Cross-referencing your information is advised when there’s a good chance people will be researching things on your site, and don’t know exactly what they need. The idea is that by cross-referencing you allow them to jump around and discover. Side bars blocks with call-to-actions, or ‘related links’ scattered here and there are examples of cross-reference. Unordered (non-alpha order) exposed tags are a type of cross-reference.


Structure provides handles for searching. The better information is structured, the easier it is to be found. Isn’t that what we all want, to have user and information find each other? (well, not always, I know… there’s something called click-through-rate, but we don’t deal with that around here, thank goodness).

If an Information Architect (or a Designer herself in case of an IA is nowhere to be found) is able to match the goal of the site to the structure of the information (large amount of data, tasks, user who knows what he wants, and lots of discovery) and pass that on to the visual designer; then the visual designer can properly match the delivery of information visually.



Of course, in a lot of  cases, a site has a little bit of everything (tasks, discovery, a bunch of text, and users that know what need). Still, it’s advisable to define the audience well (find out the goal of the most people) and then let that define what structure will be the main one. Then you can also have a secondary structure, and maybe even a tertiary and a fourth one (think

Also, if there’s no need to use a certain type of structure then don’t use it. For example, cross-reference is really helpful if you’re lost, but maybe you don’t need to cross-reference at all in certain sites, because that would add distraction (article sites, for example, where you settle down to read something — and hey isn’t that why Readability exists, to fill that need?). Then don’t do it, if it’s true that 80-90% of people won’t be really discovering/exploring much, but coming back often and knowing their path well.

Obviously, Business Strategy will need to define site goals properly, so the IA can structure the information successfully. But with the right information structure, a designer can visually integrate one or more types of information structure by emphasizing the most important one and de-emphasizing the secondary ones.


The beauty of organizing information up front (get yourself an IA if you can) is that what’s clear on an information level will have much better chances to look clear visually. It’s hard to fix an information architecture problem visually, as it is hard to solve a broken business strategy (or lack of vision) with copywriting. You just won’t ever get the graphics right in the first case, as you won’t find the right meaning or words in the second one.



Posted by on September 18, 2012 with no comments yet

Leave a comment