UAMS Call-to-Action (CTA) Bar Block

The UAMS Call-to-Action (CTA) Bar block should be used for when you want the user to take a specific action.

Configuration

• Heading
• Body
• Button
  • Text
  • URL
  • Description
• Layout: Centered, Weighted
• Size: Small, Normal, Large
• Background (Read Backgrounds of UAMS Blocks before setting the background color or background image of this block)
  • Background Color: White, Gray, Red, Black, Blue, Green, Teal, Eggplant, Orange
  • Background Image

Heading

Capitalize the text in the heading according to the AP Style rules for composition titles.

Button/Link

The button link should used in most cases, but if there is an edge case where the link(s) should be included in the text, that is an option. Including a button link and link(s) in the text is discouraged.

Your link text should be two to four words. It should be an action phrase. You are telling the user to do a thing. Do not use “Click Here”.

The link description is necessary for accessibility. It helps to distinguish between multiple links on the page that use the same link text. For example, if multiple links on the page have the same link text, but go to different destinations, screen readers will not be able to determine a difference. Your link description should adequately describe the action that is being taken by the user when they click that link. It should also be unique on the page, meaning no other link’s description should be the same value. Do not copy the link text into this field. Do not copy any related item headings into this field.

Its Use on Marketing Landing Pages

The UAMS Call-to-Action (CTA) Bar block should typically be the final element on a Marketing Landing Page (before the footer), as all of your content preceding it should be leading the user down a path that educates and informs the user and makes them want to take this final action. If it is not the final element, then the elements after the UAMS Call-to-Action (CTA) Bar block could result in a dead end.

Marketing Landing Pages should typically have a single UAMS Call-to-Action (CTA) Bar block to support the goal of the page. Additional UAMS Call-to-Action (CTA) Bar blocks can muddy the waters for what the user should be doing. Links in other blocks on the page should also be avoided.

It is recommended that the final UAMS Call-to-Action (CTA) Bar block on a Marketing Landing Page use the Large size and Centered layout, as it helps to separate the block’s content from neighboring blocks and provides the highest visual hierarchy. If no other blocks on the page have a colored background, the final UAMS Call-to-Action (CTA) Bar block should use a Blue background and should not use a background image.

If it is absolutely essential that multiple UAMS Call-to-Action (CTA) Bar blocks be included on a Marketing Landing Page, a second UAMS Call-to-Action (CTA) Bar block could be added immediately before the primary UAMS Call-to-Action (CTA) Bar block. The secondary UAMS Call-to-Action (CTA) Bar block should use a White background (or Gray, if necessary), Small size and Weighted layout. This will give it a lower visual hierarchy than the primary UAMS Call-to-Action (CTA) Bar block, emphasizing that this second block is not the primary action for the page.

Its Use on Wayfinding Landing Pages

Wayfinding Landing Pages could have multiple UAMS Call-to-Action (CTA) Bar blocks as the goal of those types of pages would be to get the user to a variety of destinations.

As there is not likely to be a single primary goal on Wayfinding Landing Pages, the Normal size should be used on all UAMS Call-to-Action (CTA) Bar blocks on those types of pages.

Examples

See below for examples of this block.