Other Navigation Components

Aggie UX has multiple supporting navigation components that are integrated into page templates in our CMS integrations.

Search Bar

A search bar is an interactive component that allows text input and then searches for matches to the entered key words.

Breadcrumbs

Breadcrumbs indicate the current page’s location within a navigational hierarchy. Breadcrumbs either appear within or directly below a page header.

Best Practices

Breadcrumbs typically use a shorter version of a page’s name in order to increase clarity.

For example, a page’s various names might look like:

• Title: Visit Texas A&M University
• H1: Visit Texas A&M University
• Breadcrumb name: Visit Texas A&M

Skip Link

A skip link is an internal link at the beginning of a page that lets users to skip navigational material and quickly access the document’s main content. Skip links are particularly useful for users who access a document with screen readers and users who rely on keyboards.

Skip links are automatically integrated into our Aggie UX Cascade templates and Aggie UX WordPress theme.

Usage Guidance

Skip links are mandatory to comply with WCAG 2.1. A single skip link with the text “Skip to Main Content” can be used to bypass the navigation block and direct the user to the beginning of the main content. Two skip links can be used in the instance of more complex navigation, where a user might want to bypass utility navigation and go straight to the main navigation or bypass the navigation altogether and go straight to the main content.

Pagination

Pagination indicates the current page’s location within a set of sequential pages, with the ability to navigate between all of the related pages. Pagination appears at the bottom of a page’s main content.

Pagination is often used to show multiple page of search results, news stories, blog posts, or profiles.

Alphabetical Navigation

Alphabetical navigation is used in special circumstances, such as in a glossary. It shows every letter in the alphabet as links, with the inactive ones grayed out.

Alphabetical navigations are to be used in conjunction with a set of information, such as an alphabetized card group, and serve no purpose as a standalone component.

A heading is also available to provide further contextualization.