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

REFERENCES :
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 http://www.digitalqatar.qa/en/2009/11/10/user-experience-documentation-site-maps-task-flows-and-wireframes/