Sitemap References

February 15th, 2009


In a way, sitemaps can be thought of as a unifying table of contents of an information architecture project. They provide a way to zoom out and view the whole organization from a bird’s eye point of view. As interesting as things look from the clouds, one can fly around only for so long, and information architects often also allow to come back down to the wireframe or page level. This zooming back in is often done through some form of referencing. Here in this sample I began referencing at least three things: wireframes, content inventories, and additional sitemap pages. Wireframes are referenced with a red “W#” stamp, content inventories with a “C#” stamp, and additional pages with upper corner blocks. Some time ago in the past I also referenced user scenarios at this level. The list of references could possibly be expanded to accommodate other item as well.

Credits: Jakub Linowski

10 Responses to “Sitemap References”

  1. juarezpaf Says:

    It's a nice approach to Sitemaps view. Show this other pages is very useful, but how do you Zoom in these areas? You design the sitemap, put these references to other pages, but how we can create the effect of zoom in to another page or it's only to make a relation?

  2. Jakub Linowski Says:

    When I wireframe at least, I do not create wires for all pages. This implies that you can only focus in on a wireframe which exists by looking up the reference. Cheers.

  3. Will Gaus Says:

    Jakub,
    Very cool indeed! Are the wires and sitemaps generated in the same application, making it easy to link? If so, what's your weapon of choice?

  4. Jakub Linowski Says:

    Hi Will,
    Just using Illustrator for both documents. It does not generate the numbers automatically, but by not representing a structure or order with the numbers (ex: W2.1.2.3.4) one can just come up with any reference number anywhere and not have to worry about updating them.

  5. Noah Says:

    I like it. I've seen a big following of lovelycharts.com for the creation of sitemaps lately, but software that links frames together is still yet to be seen.

  6. Jason Robb Says:

    Hey Jakub,

    I really like this example of a sitemap! Would you care to share a screenshot of your content inventory for one of these pages and a full view of the Home page wireframe for this project?

    It'd be especially helpful! Thanks!

    Cheers,
    Jason R.

  7. juarezpaf Says:

    Hey Jason… I really appreciate too if Jakub show to us this kind of thing. :)

  8. Jakub Linowski Says:

    I'll try to find it. Might be tough though.

  9. Robin Says:

    Loving this site-mapping design; really simple and clear. I am currently trying to replicate it as simply as I can – so power-point is the weapon of choice. Quick question… what does "header only" imply? That is the only bit I am not too clear on.

    Thanks for the site generally – there is some great work on here. Hopefully I can contribute once I have some tools to add.

  10. Jakub Linowski Says:

    Hey Robin,

    "Header Only" was a style that was developed for a section which is not really a concrete page. Sections however can contain concrete pages within them. Makes sense? :)