Style Guide - Navigational Components

A breakdown of the available navigational components available when page building section or menu landing pages.

Navigational components

Navigational components are most frequently used on landing pages with many sub sections. While they are link focused, they rarely carry a singular Call To Action, and instead present to the user a variety of options to select from under a thematic heading.

Linked Icon Card

A linked Icon Card can be used as a navigational item. This allows for a primary Call To Action at the title position, and many additional links.

It is a great way to add visual appeal to a page without requiring an image.

Another set of calls to action

Linked Image Card

While this component can technically be added to a page unlinked, the purpose of it is section navigation with an image to highlight the general theme of the section.

It can also include additional links beyond the main linked title.

Standalone Link List

A text card as a set of links

While normally considered a Call to Action element, text cards can be used as sectional navigation if there is no image or icon that works for that section.

In this situation, a link list should be included to provide that set of navigational options.

Tabs

A carousel-effect showcase of multiple content pieces. While this could be used as "body content" for storytelling, each of the tabs will likely carry a call to action navigational element. Which makes this component most frequently applicable to section navigation.