A navigation bar (or navigation system) is a section of a

graphical user interface A graphical user interface, or GUI, is a form of user interface that allows user (computing), users to human–computer interaction, interact with electronic devices through Graphics, graphical icon (computing), icons and visual indicators such ...

intended to aid visitors in accessing information. Navigation bars are implemented in

operating systems An operating system (OS) is system software that manages computer hardware and software resources, and provides common daemon (computing), services for computer programs. Time-sharing operating systems scheduler (computing), schedule tasks for ...

file browser A file manager or file browser is a computer program that provides a user interface to manage files and folders. The most common operations performed on files or groups of files include creating, opening (e.g. viewing, playing, editing or p ...

web browser A web browser, often shortened to browser, is an application for accessing websites. When a user requests a web page from a particular website, the browser retrieves its files from a web server and then displays the page on the user's scr ...

s, apps, web sites and other similar

user interfaces In the industrial design field of human–computer interaction, a user interface (UI) is the space where interactions between humans and machines occur. The goal of this interaction is to allow effective operation and control of the machine fro ...

File browsers

File browsers use a navigation bar to assist the user in traversing the filesystem. Navigation bars may include the current

path A path is a route for physical travel – see Trail. Path or PATH may also refer to: Physical paths of different types * Bicycle path * Bridle path, used by people on horseback * Course (navigation), the intended path of a vehicle * Desir ...

breadcrumb Breadcrumbs are a culinary ingredient consisting of flour or crumbled bread of varying dryness, sometimes with seasonings added. They are used for a variety of purposes, including breading or crumbing foods before frying (such as breaded cutlet ...

s, or a list of favorites.

Web browsers

A web browser navigation bar includes the back and forward buttons, as well as the Location bar where URLs are entered. Formerly, the functionality of the navigation bar was split between the browser's

toolbar The toolbar, also called a bar or standard toolbar (originally known as ribbon), is a graphical control element on which on-screen icons can be used. A toolbar often allows for quick access to functions that are commonly used in the program. Some ...

and the

address bar In a web browser, the address bar (also location bar or URL bar) is the element that shows the current URL. The user can type a URL into it to navigate to a chosen website. In most modern browsers, non-URLs are automatically sent to a search eng ...

, but

Google Chrome Google Chrome is a web browser developed by Google. It was first released in 2008 for Microsoft Windows, built with free software components from Apple WebKit and Mozilla Firefox. Versions were later released for Linux, macOS, iOS, iPadOS, an ...

introduced the practice of merging the two.

Web design

Typically, websites will have a primary navigation bar and sometimes secondary navigation bar on all pages. These webpage sections will include links to the most important sections of the site. The

implementation Implementation is the realization of an application, execution of a plan, idea, scientific modelling, model, design, specification, Standardization, standard, algorithm, policy, or the Management, administration or management of a process or Goal ...

and design of navigation bars is a crucial aspect of

web design Web design encompasses many different skills and disciplines in the production and maintenance of websites. The different areas of web design include web graphic design; user interface design (UI design); authoring, including standardised code a ...

and web

usability Usability can be described as the capacity of a system to provide a condition for its users to perform the tasks safely, effectively, and efficiently while enjoying the experience. In software engineering, usability is the degree to which a softw ...

. In general, navigation bars are found in a page's header but may also be found in the form of a sidebar. File: Rudy 2008 web header.png, A typical webpage header with a navigation bar File: Wikipedia CamelCase Navigation Bar.png, A minimally styled header bar File: BookManager navbar cropped.png, Page navigation With different purposes, there are different kinds of the navigation bars to be chosen, such as horizontal navigation bars and vertical navigation bars. And with a dynamic website project including JavaScript, navigation bars can be designed to be responsive.

HTML5 nav tag

Some early versions of

Netscape Netscape Communications Corporation (originally Mosaic Communications Corporation) was an American independent computer services company with headquarters in Mountain View, California, and then Dulles, Virginia. Its Netscape web browser was o ...

used the

HTML Hypertext Markup Language (HTML) is the standard markup language for documents designed to be displayed in a web browser. It defines the content and structure of web content. It is often assisted by technologies such as Cascading Style Sheets ( ...

tag to construct a navigation bar to navigate websites. Today, the tag can be used for the same purpose. In

HTML5 HTML5 (Hypertext Markup Language 5) is a markup language used for structuring and presenting hypertext documents on the World Wide Web. It was the fifth and final major HTML version that is now a retired World Wide Web Consortium (W3C) recommend ...

, navigation elements are enclosed in a <nav> tag, often, containing a list of links.

References

Web design Graphical control elements Graphical user interface elements {{WWW-stub

File browsers

Web browsers

Web design

HTML5 nav tag

See also

References