Re: [ia-14] Seeking examples of good IA documentation for web sites

From: Jayson E.
Sent on: Friday, May 22, 2009 5:08 PM
Hi Tony,

Looks like you have some great thinking evidenced in the documents you attached.

The most important thing in IA documentation is ensuring that your audience understands the document when you're not around - there's no "right" way to format, except to communicate well. I think you're well on your way.

I generally present the sitemap and flows as two separate documents, so that the sitemap becomes a logical organization of the structure, though not necessarily a representation of the navigation. Your site map is easy to read, but don't worry about representing all of the naviagational paths as much as the conceptual relationships.

The number one piece of advice I would give is to set up a numbering scheme for your pages, and use it in all your documentation. It's typically a hierarchical scheme, e.g. "1.5.2 Address Book" would mean that the page "Address Book" is the second page in the fifth subsection (My Account), within the first top section (Home).
By using a numbering scheme, you can refer to that number in site maps, wireframes, flows, visual designs, content decks, etc., and always know exactly what goes with what.

On the wireframes - there is a philosophical debate about how much detail / design belongs on a wireframe. I used to be a purist, and insist on zero actual design elements. I have changed my mind significantly over the years, and I now believe you should use whatever level of fidelity is appropriate for your audience. A rule of thumb to follow is to use the least amount of design that still conveys the experience, and the most possible that doesn't distract from the purpose of a wireframe, which is to expose content, functionality, and general layout.

Take a look at the annotations on my wireframes - you'll see an outline structure that I developed over the years and which has always served me well:
  • Page Description
  • How To Get Here
  • Content / Data
  • Functionality
  • Buttons / Links
  • Further Comments
  • Technical / Design Assumptions

If you fill each of these out, you'll find that the page is pretty well described. You may have other special sections you need to use, such as Business Rule (to cross-reference a business rule table), or Permissions (if it's a wireframe for a site where not all users have access to all pages), or any other special needs an individual project may have.

Using a standard numbering scheme makes the "Buttons / Links" section much easier to read, because you can refer to the page number to avoid any ambiguity.

It's always a good idea to create a navigation flow document that mirrors your wireframes (have a look at my site for example of that as well). It's easier for many developers to read, leaves zero room for ambiguity, as well as making it very easy for a QA tester to write a test plan.
Just as importantly, I've found that I often catch something when I'm making my flows that I didn't see in the context of a wireframe - a link path that goes in circles or dead ends in a strange way, or something I forgot to define in my wireframes.

Finally, always document your error messages well. The way you write error messages is a major element of your usability, and one of the most overlooked as well.

The site you're making looks pretty neat. Please keep posting where you are as the build progresses - it's fun to watch people work!


On Fri, May 22, 2009 at 3:29 PM, Tony Zeoli <[address removed]> wrote:

Amazing stuff. I guess I have a long way to go. Although I've been working in and around IA for a few years, I haven't had the chance to see much other work. This gives me a good indication of where I need to be in terms of detail and language.

I'm working on something now for an urban clothing site. I've attached here. I'd love some critical feedback. The notes aren't quite complete, still working on that.

- - - -

Best regards,

Tony Zeoli, Founder

o: [masked]
m: [masked]

email | web | blog | LinkedIn | Facebook | Twitter
aim / msn: djtonyz | yahoo: anthonyzeoli | skype: tonyzeoli

On Fri, May 22, 2009 at 2:28 PM, Jayson Elliot <[address removed]> wrote:
You can see some examples in the prezi on my site:

It's a bit sluggish performing, but if you click through, I've put a lot of different documentation examples in the presentation.

On Fri, May 22, 2009 at 1:33 PM, Anthony Zeoli <[address removed]> wrote:
Hi everyone:

I was wondering if anyone has any examples of wireframing documentation they could share with me. I want to see how others are framing and doing site maps. If anyone feels comfortable sharing and is not under an NDA, I'd appreciate it. Thanks.

- - - -

Best regards,

Tony Zeoli, Founder

o: [masked]
m: [masked]

email | web | blog | LinkedIn | Facebook | Twitter
aim / msn: djtonyz | yahoo: anthonyzeoli | skype: tonyzeoli

Please Note: If you hit "REPLY", your message will be sent to everyone on this mailing list ([address removed])
This message was sent by Anthony Zeoli ([address removed]) from The New York City Information Architecture Meetup Group.
To learn more about Anthony Zeoli, visit his/her member profile
To unsubscribe or to update your mailing list settings, click here

Meetup Support: [address removed]
632 Broadway, New York, NY 10012 USA

People in this
Meetup are also in:

Sign up

Meetup members, Log in

By clicking "Sign up" or "Sign up using Facebook", you confirm that you accept our Terms of Service & Privacy Policy