Skip to main content
U.S. flag

An official website of the United States government

Dot gov

The .gov means it’s official.
Federal government websites often end in .gov or .mil. Before sharing sensitive information, make sure you’re on a federal government site.

Https

The site is secure.
The https:// ensures that you are connecting to the official website and that any information you provide is encrypted and transmitted securely.

Components

Link - Collection

Use: Deployed
Collections of links that allow users to navigate to related content within and outside of the current content section.

Examples

Example of Related links to show a list of links.
Use the Related links variation for a collection of links that navigate to closely related programs and services within a content section.
Example of the Link, Collection, Related links component to show a list of links.
Use the Major links variation for a collection of links that navigate to pages outside of a content section.
Example of the Link, Collection, Quick links component to show a list of links.
Use the Quick links variation for a collection of links that navigate to related topics outside of a content section.

Usage

When to use a Collection

  • Link to related programs and services. Use related links for links to closely related programs and services within a content section.
  • Link to pages outside a content section. Use major links for links to pages outside of a content section.
  • Link to related topics outside a content section. Use quick links for navigating users to related topics outside of a content section.

When to consider something else

  • Calls to action. Calls to action (CTA) links should be an action link or appropriate link variation. CTA buttons are for launching an application, signing in, or other primary and essential actions on a page.
  • Table of contents. Use the On this page

Choosing between variations

Review the when to use a collection section for guidance.

Placement

  • Related links generally appear at the bottom of the page in the main content well.
  • Major links can appear throughout the main content well.
  • Quick links are rarely used but can appear in the right rail in certain instances.

Design principles

For collections of links, the Law of Proximity applies which states:

Objects that are near, or proximate to each other, tend to be grouped together.

Collections of links, given their close proximity, will be perceived to share similar traits or properties. Also, proximity helps users to understand and organize the information faster and more efficiently.

Instances of this component in production

Our examples are all from production. Once these link styles are converted into web-components we will swap the examples out for code examples and move the current examples to this section.

Content considerations

Accessibility considerations

Edit this page in GitHub (Permissions required)
Last updated: Jun 06, 2022