Web site navigation
The pages in a Web site are organized in a hierarchy. Web Site Navigation uses this hierarchal structure information to generate navigation links and site maps automatically.
When the structure of a site changes, for example, when a new page is added, the navigation links are automatically regenerated to reflect the new Web site structure. This dynamic navigation is accomplished using special comment tags for the navigation bar and site map. Double-clicking Web Site Navigation in the Enterprise Explorer view for a Web project launches Web Site Navigation in the Navigation page.
Relationships between pages in the Web site structure
In Web Site Navigation, a Web site is displayed visually in the Navigation page. Each Web page in the Web site is represented as a page icon. Lines connect the page icons to illustrate the relationships that exist between the pages. There are several relationships that the pages can have with each other, many of the relationships are modeled after family relationships. For example, pages can have a parent-child relationship or a sibling relationship.
In the example shown below, the index page has a line connected to pages product and feedback.jsp. This means that index is the parent of the child pages product and feedback.jsp. This also means that the product and feedback.jsp pages are siblings to each other.
The error page is at the same level in the hierarchy as the index page; however, it is not attached to any of the other pages with connection lines. Instead of having a family type of relationship, the error page and the index page have a peer relationship.
The
page
relationships are used to automatically generate the navigation links.
So,
if the index, product, and feedback.jsp pages all have the Show
in Navigation option
selected, the navigation bar for the feedback.jsp page can contain
a link
to its parent (the index page) and to its sibling (the product page).
You
can see that all three of these pages are shown in the navigation
because
the Show in Navigation icon 
is visible. The error page,
however,
is not shown in the navigation. This makes sense because you might
want to
create an error page that appears when the site encounters a problem;
however,
you would not want to show the error page as part of the navigation
or in
the site map. You can also include or exclude pages from the site
map. In
this example, all of the pages except the error page are shown as Shown
in Site Map
.
Navigation root in the Web site structure
The
top page, usually the first page created in the site, is often set
as the Navigation
Root
, though you can change which
page is the navigation root. The navigation
root is important because it determines the link levels used when
generating
Web site navigation, such as navigation bars and site maps. In this
example,
the index page is the navigation root.
Web page properties
In Web Site Navigation,
you can also see which pages have actual files associated with them
as indicated
by the Code icons 
and 
. In
this example, the index page has an associated HTML file and
the feedback.jsp page has an associated JSP page. Page icons that
have files
associated with them also have a solid black border, whereas pages
with only
icons have a broken border to represent that they are only placeholders.
You can also tell from the page icon if a page template has been applied. By default, the background of the icon is blue if there is a page template associated with the page. You can see that a page template has been applied to the index page since the page icon background is blue.
Once you have a new Web site with the top page defined you can populate your site by creating page icons in Web Site Navigation to map out your site. You can use Web Site Navigation to plan and layout your whole site's organization, and then create each of the Web page files to fill out the site.
Web Site Navigation consists of an editor and a Web Site Navigation drawer:
- Web Site Navigation editor. The Web Site Navigation editor
is visible
when editing the Web Site Navigation file. You can view the whole
site within
Web Site Navigation editor. You can add, delete, and rearrange the
Web pages
that compose the Web site using this tool. There are two pages in
the editor:
the Navigation page and the Detail page. The Navigation page shows
the structure
of the Web site and the Detail page shows a list of all the Web pages
used
in the site structure.
- Web Site Navigation drawer. The Web Site Navigation drawer is visible when editing an HTML or JSP page. The Site drawer opens when the Web Site Navigation editor is open. On the Palette view there is a Web Site Navigation drawer that contains Web site elements, such as different navigation bars and a site map. You can drag these items onto your Web pages in Page Designer.
You can use these Web Site Navigation tools in conjunction with other Web tools, such as page templates. You can alter an existing page template or create your own and then apply the page template to all of the Web pages in your Web site to ensure a consistent design. Instead of making a change, such as altering the size of the navigation bar, on each individual Web page, you can alter the page template instead. The changes are applied to your entire Web site.
Related tasks
Creating or importing Web pages and Web resources
Adding a new page to a Web site
Adding an external page to a Web site
Adding an existing page to a Web site
Adding an existing Faces JSP page to a Web site