School of Information Systems

Basic Elements of Site Maps and Task Flows 

The most basic of elements within your drawing program is creating site maps and task flows. To ensure that your creations can be easily interpreted by a wide audience, however, it’s best to use a standard set of shapes.

A site map is a visual representation of the pages within a website. Site maps are used to show how the content and functionality of a web site are organized. They typically show the relationships between pages and which pages contain dynamic or static content. Task flow are a visual representation of paths and processes that users follow as they use a web application. Task flows detail the screen flow and options that are presented to users as they use a system to complete a task.  While a site map shows organization of content and functionality, tasks flows illustrate the user paths and key decision points.

Basic Elements of Site Maps and Task Flows:

  • Page: the basic unit of user experience on the Web. There are a number of ways to draw these pages, but the simplest, most commonly used format is a plain As the progress through creating site maps and task flows, you will want to find the style that best suits you for labeling and numbering your pages.
  • A pagestack: represents multiple pages of similar content. An easy way to comprehend pagestacks is to think of dynamic content, such as a common blog page created using a publishing system
  • Decision Point: used to show the path that a user can take depending on the answer to a question
  • Connectors and arrows: used to show movement or progress between pages, pagestacks, decision points, and so on. Connectors generally appear where there is a call to action from one page to another
  • Conditions: A dashed line is a fairly common way to display a condition. it can appear in site maps, task flows, and other work product you may create or invent. You can use a dashed line as a connector or as a box around an area to highlight that a connection to a page or an entire section of pages is conditional based on some other action or event

Russ Unger and Carolyn Chandler. (-). A Project Guide to UX Design: for User Experience Designers in the Field or in The Making. 02. New Riders. Berkeley, CA. ISBN: 978-0-321-81538-5.
Verhoeven, B. (2018). User Experience Documentation: Site Maps, Task Flows, and Wireframes. Retrieved from

Jennifer Alexandra