stephen.turbek.com

The Lazy IA's Guide to Making Sitemaps

by stephen turbek


Published 29 Jan 2006 at boxesandarrows.com and Edited by Liz Danzico


This article further develops the excellent Automating Diagrams with Visio by Michael Angeles.

Sitemaps are common deliverables, desired by clients who want a visual representation of a site. Since they are rarely used to make decisions, information architects may not consider them the valuable tools they are. The effort required to make and maintain them requires time that might be better used elsewhere. In fact, I would suggest that making sure the little boxes line up is a waste of an IA's mental abilities.

Especially when your sitemap looks like this.

So what is an IA to do? Turn to Excel, of course. Storing sitemap data in a structured data format such as Microsoft Excel makes the data easy to edit, easy to share with the team, and easy to elaborate on (e.g., adding example notes and URLs that may not be appropriate for the map itself). Unfortunately, this approach requires maintaining a spreadsheet in addition to maintaining the visual sitemap.

Or does it?

This article includes step-by-step instructions on how to make sitemaps with:
1. Excel and Visio 2000 or Visio 2003 (Windows only)
2. Word and Inspiration (Mac OS and Windows)

Use these lazy techniques and spend your time on better and more interesting problems than lining up little boxes!

Techniques


I've chosen these three options because they use standard applications that store the sitemap data in a format that can be edited by non-IAs. Each option demonstrates how you can store the data in the first format (Excel or Word) and import it into the second program (Visio or Inspiration) to—Voila!—create the sitemap.

You can use this zip file to access all the templates referenced in this article. I suggest doing the exercise once with the sample file to get the hang of it, then editing that file to your needs. The Excel spreadsheet has been written to do some semi-fancy calculations to let you store your data on the import sheet in a nice format and to output Visio-readable data on the output sheet.



Technique 1: Excel and Visio 2000 / 2003


This approach uses the import data feature of Visio 2000 (Note that this feature has been removed in Visio 2003) and (mis)uses the "Organization Chart Wizard" from Visio 2003. You store and manage the sitemap data (the list of links in a structured organization) in Microsoft Excel, save it as a text file, and import it into Visio for quick visualization.

Step 1: Enter your sitemap data in the "Input" sheet in the file "template_for_visio_2000_and_2003.xls."

Image_01_turbek_sitemap_visio2000_excel_start

For Visio 2003, proceed to the variation below



For Visio 2003, proceed to the variation below.

Step 2: Go to the "Output for Visio 2000" sheet (and pay it no mind).
Image_02_turbek_sitemap_visio2000_excel_output

Save as Type "Text (tab delimited)."
Image_03_turbek_sitemap_visio2000_excel_save_as_text

You will see two alerts. Click OK and Yes.

Image_04_turbek_sitemap_visio2000_excel_save_as_text_alert
Image_05_turbek_sitemap_visio2000_excel_save_as_text_alert2

Close the file. You may get the alerts again, hit "OK" and "Yes." Closing the file is actually important!

Step 3: Open Visio 2000. Click "Open." Choose Files of Type "Text (.txt, .csv)." Choose the file you just saved.
Image_06_turbek_sitemap_visio2000_open

Step 4: When the dialog box pops up, set Field separator to [Tab] Text Delimiter to "Comment Character to ;. Click "OK."
Image_07_turbek_sitemap_visio2000_open_2

Step 5: A sitemap! Edit your sitemap to suit your fancy.
Image_08_turbek_sitemap_visio2000_open_4

Variation for Visio 2003

Step 2: Click on the Sheet tab "Output Visio 2003" (and pay it no mind). Save the Excel file and close it.
Image_09_turbek_sitemap_visio2003_excel_export

Open Visio 2003. Select the "Organization Chart Wizard."
Image_10_turbek_sitemap_visio2003_menu

Step 3: Select "Information that is stored in a file or database." Click "Next."
Image_11_turbek_sitemap_visio2003_orgchartwiz1

Step 4: Select "A text, Org Plus (*.txt), or Microsoft Excel file. Click "Next."
Image_12_turbek_sitemap_visio2003_orgchartwiz2

Step 5: Find the demo file included with this presentation "example_visio_2003.XLS." Click "Next."
Image_13_turbek_sitemap_visio2003_orgchartwiz3

Step 6: Leave these defaults. Click "Next."
Image_14_turbek_sitemap_visio2003_orgchartwiz5

Step 7: Remove "Title" as a displayed field. Click "Next."
Image_15_turbek_sitemap_visio2003_orgchartwiz6

Step 8: Ignore the Custom Property fields (though you might be able to think of some use for the other fields in some interesting way). Click "Next."
Image_16_turbek_sitemap_visio2003_orgchartwiz7_custom_property

Step 9: You can make sitemaps that span multiple pages. Choose "specify." Click "Next."
Image_17_turbek_sitemap_visio2003_orgchartwiz7_define_page_layout

Step 10: This allows you to define the top Sitemap box on the page. If you follow the Excel template, you can leave this alone. Click "Finish."
Image_18_turbek_sitemap_visio2003_orgchartwiz8_define_on_page

Step 11: A sitemap!
Image_19_turbek_sitemap_visio2003_orgchartwiz9_output

Step 12 Right click on the sitemap to edit properities.
Image_20_turbek_sitemap_visio2003_orgchart_leftclick_menu

"Arrange subordinates" changes the sitemap layout.
Image_21_turbek_sitemap_visio2003_orgchart_leftclick_menu_arrange

"Change Position" changes the look of the boxes
Image_22_turbek_sitemap_visio2003_orgchart_leftclick_menu_change_box

Technique 2: Microsoft Word and Inspiration


This (mis)uses the flowcharting tool Inspiration. To do so, you format the sitemap in Microsoft Word outline format, save it as a RTF document, import it into Inspiration, and modify the diagram to look like a sitemap. The outline format can also be created directly in Inspiration, but storing the data in Word allows you to better collaborate with coworkers and clients.



Step 1: Outline your sitemap using Microsoft Word's Outline format. Save it as a RTF file. (Step 1 is optional: you can make the outline in Inspiration, but some users may wish a more accessible format, like Microsoft Word.)
Image_25_turbek_sitemap_inspiration_2-word_outline

Step 2: Open Inspiration. Create a new file. Open the RTF file.

Step 3: Inspiration converts the RTF file to its own format. You may have to do some minor editing to remove blank rows, as shown above. (See image 26)
Image_26_turbek_sitemap_inspiration2

Step 4: Click the "diagram" button at the upper left. What a mess! But click the "arrange " button…
Image_27_turbek_sitemap_inspiration_3

Step 5: Select diagram type "Top down Tree" and Lower level stacking option "Right."
Image_28_turbek_sitemap_inspiration_4_arrange

Better arranged, but visually lacking.
Image_29_turbek_sitemap_inspiration_5_arranged

Step 6: Select all then click the rectangle in the menu bar. Now you can do things like take off the drop shadow, change the fill color to white, change the line color, etc.
Image_30_turbek_sitemap_inspiration_6_boxes

A sitemap!
Image_31_turbek_sitemap_inspiration_7_export

Working hard, hardly working
Sitemaps can be useful tools and are a whole lot easier when you separate the data from the visualization. After you have done these steps a few times, you will be able to update a sitemap in under a minute.

All these techniques can be expanded and improved upon. Let me know what you have done and what works for you. Have fun, but don't work too hard!


Downloads
This article references the following downloads:

Templates referenced in article (Visio, Inspiration, Excel)

For more information
This article includes step-by-step instructions on how to make sitemaps with:

Excel and Visio 2000 or Visio 2003 (Windows only)

Word and Inspiration (Mac OS and Windows)