Sitemaps are basically just a diagram where you use boxes or circles to represent each page in your site. Don’t make them any more complicated than they need to be.

In the example above a hierarchical diagram is used. Typically the Home page is listed on top. Then on the next line below that is the pages that are lined to in the main navigation for the site (Photos, Resume, About Me, Blog). If there are subpages then those are listed vertically (Photos, Web, Mobile).

Remember that each box represents a full page in the site. If your site links to another site those pages are not part of the site map.

Software to Create Sitemaps

Microsoft Word: yes believe it or not in the newer versions of Word there is a pretty good Organization Chart tool that works well for simple sites. This won’t cut it for more complicated sites and doing sophisticated annotations but if you just want to show some pages then it works.

Here is a screencast for how to do it:

Adobe Illustrator: If you’re a pro at Illustrator then drawing a bunch of boxes probably isn’t too hard. If you’re not then either use something else or take it as a learning experience.

Writemaps: This is a browser-based online tool. It doesn’t have any real export capabilities so just take a screenshot of the map once you’re done. It’s pretty easy and quick so it shouldn’t take you too long.

Lovely Charts: this is an online software that costs money but you can try it for free.

Here is a screencast for how to use it:

Pen and Paper: You can also just draw it out on paper and then take a photo or scan it in. Make sure to adjust the brightness and contrast so that it is visible. If you use a Sharpie (thin tip) then it is easier to do this. Regardless of what method you choose in the end it often helps to start with pencil and paper.

2 Trackbacks

Post a Comment

Your email is never published nor shared. Required fields are marked *


You may use these HTML tags and attributes <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>