Theory
"Where am I?"
Deep inside FestConnect, a student on the registration page might wonder how they got there and how to step back. The familiar answer on the web is a breadcrumb trail near the top of the page:
Home > Events > Register
Each part before the last is a link back up. ASP.NET provides a ready-made control that shows this trail for you: SiteMapPath. This short lesson covers what it does and where it gets the trail from.
Theory
SiteMapPath and the site map
SiteMapPath is a navigation server control that displays the current page's position in the site as a breadcrumb, with the ancestor pages shown as links and the current page as plain text at the end.
It does not need you to specify the trail per page. Instead it reads the site's structure from a site map, by default a file named Web.sitemap. That XML file describes your pages and their parent-child relationships. SiteMapPath looks up wherever the visitor currently is and renders the path from the home page down to it, automatically.
Practical
Web.sitemap: describing the hierarchy
<siteMap>
<siteMapNode title="Home" url="~/Default.aspx">
<siteMapNode title="Events" url="~/Events.aspx">
<siteMapNode title="Register" url="~/Register.aspx" />
</siteMapNode>
</siteMapNode>
</siteMap>
<!-- Nesting defines parent-child: Home > Events > Register -->This example runs in Gri-Learn on the web, where you can edit it and see the output.
Practical
Dropping the control onto a page
<!-- Often placed on the master page so every page shows breadcrumbs -->
<asp:SiteMapPath runat="server" />
<!-- On Register.aspx this renders: Home > Events > Register -->This example runs in Gri-Learn on the web, where you can edit it and see the output.
Formula
One control, every page
The elegance is that SiteMapPath works out the trail from the site map plus the current page, so a single control handles every page. Put it once on the master page and every content page automatically shows the correct breadcrumb for its own location.
Update the hierarchy in Web.sitemap and the breadcrumbs everywhere follow, no per-page editing. It is the same define-once idea again: describe the structure in one file, and the control reflects it site-wide.
Quiz
How does a SiteMapPath control know what breadcrumb trail to display on a given page?
- You type the trail by hand into every page's SiteMapPath
- It reads the site's structure from a site map (by default Web.sitemap) and shows the path to the current page
- It guesses the trail from the page's colours
- It queries the database for the trail each time
Show the answer
It reads the site's structure from a site map (by default Web.sitemap) and shows the path to the current page
SiteMapPath reads the site's hierarchy from a site map, by default the Web.sitemap XML file, and renders the path from the home page down to whatever page the visitor is currently on. Option A is exactly what SiteMapPath saves you from: you do NOT hand-type the trail per page; that is the whole convenience. Option C is nonsense; colours have nothing to do with navigation structure. Option D is wrong: the default site map is an XML file, not a database query; SiteMapPath uses the site-map structure, not the database. Describe the hierarchy once in Web.sitemap, and the control shows the right trail on every page.
Think first
Why bother with breadcrumbs at all?
Menus already let users navigate. What do breadcrumbs add, and why generate them from a site map? Then tap.
Show the answer
Breadcrumbs answer two questions a menu does not: 'where am I right now?' and 'how do I step back up one level?'. On a deep page like Register, a menu shows all the places you COULD go, but the breadcrumb Home > Events > Register instantly shows the visitor their current location in the site's structure and gives them one-click links back to Events or Home. That orientation reduces the lost feeling on large sites and is a small but real usability win. Generating them from a site map (rather than hand-writing each trail) means the trails are always CONSISTENT with the actual structure and update automatically when you reorganise: change the hierarchy in Web.sitemap once and every breadcrumb across the site corrects itself. So breadcrumbs improve orientation, and driving them from a single site map keeps them accurate with no manual upkeep. Location plus easy step-back, maintained in one place.
Summary
Key takeaways
- SiteMapPath is a navigation server control that shows a breadcrumb trail, like Home > Events > Register.
- Ancestor pages appear as links; the current page appears as plain text at the end.
- It gets the trail from a site map, by default a Web.sitemap XML file describing pages and their parent-child relationships.
- You add <asp:SiteMapPath> to a page (often the master page) and it renders the correct trail for whatever page you are on.
- One control plus one site map handles breadcrumbs for the whole site; reorganise the site map and all trails update.
- Breadcrumbs improve orientation ('where am I?') and give quick links back up the hierarchy.
- Memory hook: SiteMapPath reads Web.sitemap and shows you where you are.