Structure is important in building a successful Web site, but it is often difficult to visualize how all of the pages in our site relate to each other. Sitemaps and wireframes are two tools that can help you understand the relationships between parts of a page or sections of a site.
Note: For those of you who are more advanced, I’m not talking about the kind of sitemap you submit to google, an XML list of links and code. I’m referring to a visual sitemap, a chart that maps all of the pages and sections of a site and how a visitor would navigate from the home page to a designated page on the site.
By creating this map near the beginning of the process, you can feel confident that everyone working on the project understands how it will be built without wasting time and energy on trial and error. Looking at the site from this high-level view will also help you to prioritize what information is most important.
Wireframes take this process to the next level by forcing you to subject a single page to the same sort of scrutiny. Organizing the content of a page by function and importance will help you to determine a layout that supports your site goals and makes navigation fluid for site visitors.
You will find that taking the time to complete these steps before you jump into building functional Web pages will make projects easier and save a lot of time in the end.
Learn more:
http://www.smashingmagazine.com/2009/09/01/35-excellent-wireframing-resources/
http://blog.flipstudios.com/2009/10/
http://www.gdoss.com/web_info/web-site-wireframe.php
Some free online tools: