Split Layout

Content

Kicker (optional) (max. approximately 28 characters)

  • A kicker, sometimes referred to as an overline, is a smaller, often more abstract heading that “kicks off” a section.
    • Example: “Show Me Results” or “Live Like a Tiger”

Title (max. approximately 18 characters)

  • Your title heading should clearly describe the content and action.
  • Avoid vague titles.
    • Example: Instead of “Show Me Mizzou” (vague) try “Visit Mizzou” (more specific).

Description (max. approximately 180 characters)

  • The description is a short lead-in or teaser that explains what the user will find when they follow the call to action. The most successful descriptions describe how this content will help meet a user need, not how this will benefit your department.
  • Avoid using multiple paragraphs.

Action (max. 1 button)

  • Button text should start with an action verb and clearly describe where users will go when they tap the button. Avoid using vague actions like “read more” or “learn more.”
    • Example: Instead of “Learn more” try “Start your application.”

Image

  • Minimum dimensions: 688px wide by 459 pixels tall (3:2 aspect ratio)
  • Select images that provide context and help reinforce the adjacent text.
  • Avoid purely decorative images.
  • Include an alt text description for the photo.

Variations

  • Left text/right photo
  • Right text/left photo
  • With background image
  • No offset

How to use

  • Usually used on front and landing pages when you need to create a highly visible entry point to important or frequently needed content on another page.
  • If using multiple times on a single page, alternate style variations.

Things to avoid

  • Avoid using this component to present content in its entirety (e.g., fill with multiple paragraphs). It should always link to full content on a separate page.
  • Avoid using this component when an appropriate (non-decorative) image cannot be associated with the content. Use Call to Action instead.