Information Architecture for the World Wide Web, Second Edition

Wireframes

Blueprints can help an information architect determine where content should go and how it should be navigated within the context of a site, subsite, or collection of content. Wireframes serve a different role: they depict how an individual page should look from an architectural perspective. Wireframes stand at the intersection of the site’s information architecture and its visual and information design.

For example, the wireframe forces the architect to consider such issues as where the navigation systems might be located on a page. And now that we see it on a “page,” does it seem that there are too many ways to navigate? Trying out ideas in the context of a wireframe might force you back to the blueprint’s drawing board, but it’s better to make such changes on paper rather than reengineering the entire site at some point in the future.

The wireframe describes the content and information architecture included on a page, and is therefore constrained in size. These constraints force the information architect to make choices about what components of the architecture should be visible and accessible to users; after all, if the architectural components absorb too much screen real estate, nothing will be left for actual content!

Developing the wireframe also helps the information architect decide how to group content components, how to order them, and which groups of components have priority. In Figure 12-11, the information architect has determined that “Reasons to Send” is ...