Navigation bar
A navigation bar (or navigation system) is a section of a graphical user interface intended to aid visitors in accessing information. Navigation bars are implemented in file browsers, web browsers and as a design element of some web sites.[1]
File browsers
File browsers use a navigation bar to assist the user in traversing the filesystem. Navigation bars may include the current path, breadcrumbs, or a list of favorites.[2]
Web browsers
A web browser navigation bar includes the back and forward buttons, as well as the Location bar where URLs are entered.[3] Formerly the functionality of the navigation bar was split between the browser's toolbar and the address bar, but Google Chrome introduced the practice of merging the two. Some early versions of Netscape used the HTML link tag to construct a navigation bar to navigate web sites.[4] Today the nav tag can be used for the same purpose.[5]
Web design
Typically, web sites will have a primary navigation bar[6] and a secondary navigation bar on all pages. These sections of the webpage will include links to the most important sections of the site. The implementation and design of navigation bars is a crucial aspect of web design and web usability.
In general, navigation bars are found in a page's header,[7] but may also be found in the form of a sidebar.[8]
-
A typical webpage header with a navigation bar -
A minimally styled header bar -
Page navigation
HTML5 nav tag
In HTML5, navigation elements are enclosed in a <nav> tag, often, containing a list of links.[7]
<nav>
<ul>
<li><a href="/">Home</a></li>
<li><a href="/blog">Blog</a></li>
<li><a href="/contact">Contact</a></li>
</ul>
</nav>
See also
References
- ^ "Personalize the Windows Explorer Navigation Bar".
- ^ "Dolphin".
- ^ "Avant Browser Help - Navigation Bar".
- ^ "Link".
The LINK element can be used to define a toolbar of navigation buttons or an equivalent mechanism such as menu items. Many of the values for the REL attribute could be reserved for this purpose (such as Home, Next, Previous, etc.)
- ^ "HTML <nav> Tag".
- ^ "Navigation Bar: Explanations and Samples".
{{cite web}}: CS1 maint: url-status (link) - ^ a b "How To Make Header Bar In Html? - PeterElSt".
- ^ "How to create a Sidebar Nav? What is Sidebar Nav?".
 | This World Wide Web–related article is a stub. You can help Wikipedia by expanding it. |