Content
Title (max. 32 characters)
- The title is a heading that clearly describes the main topic of the component.
- Avoid vague titles.
- Example: Instead of “Show Me Mizzou” (vague) try “Visit Mizzou” (more specific).
Description (max. 400 characters)
- A description, lead-in or teaser that explains what the user will find when they follow the call to action.
- Avoid multiple paragraphs.
- Avoid including lists, images, videos or other content.
Action (max. 2 buttons)
- Start with an action verb.
- Make sure the button text clearly describes the action users will be taking when they tap the button. Avoid using vague actions like “read more” or “learn more.”
- Example: Instead of “Learn more” try “Start your application”.
- Keep your action text short, descriptive and personalized to your user’s needs. Consider why someone would want to complete this action when writing your button text.
Variations
- Light
- Dark
- Photo background
How to use
- Use this component on front and landing pages when you need to highlight important actions users should take (Apply, Visit, Register, etc.).
- If using multiple times on a single page, consider using different variations to add visual interest.
Things to avoid
- Don’t use this component to present content in its entirety (example: fill with multiple paragraphs, lists, images or video.). It should always link to full content on a separate page.
- Don’t use this component to highlight content that is not associated with a strong call to action. Use Split Layout instead.