Picking the Right One

Page headers serve as the face of your page. By using the appropriate header you can give context, provide visual hierarchy and help to create engaging experiences. Introduce your content, give it emphasis or get straight to the point with a simple header. Using photos and video in your page header can elevate your page, while keeping things simple can keep your page content from being outshined.

The Options

a screenshot of the hero header

Hero Header

  • Features a large, eye-catching image with prominent text
  • Ideal for impactful landing pages and homepages
  • Designed to make bold statements and showcase key messages
  • Engages and creates a memorable first impression

Hero Header Example

 

a screenshot of the partial headerPartial Media Header

  • Pairs multimedia (photo or video) with descriptive text
  • Automatically fills in the site and section name
  • Allows you to customize the text as well
  • Meant for secondary pages, enhancing detail and context
  • Features an action button for targeted user actions

Example With Image   Example With Video

 

a screenshot of the simple headerSimple Header

  • Clean, text-focused design
  • Automatically fills in the site and section name
  • Allows you to customize the text as well
  • Best for straightforward, informational pages

Simple Header Example