Masthead Image Considerations

When selecting an image to use in the Masthead area, be mindful that the main navigation bar for the website overlays the top portion of the image.

The main navigation bar will cover a significant portion of the image in top 1/4 to 1/3 of the image. Given this, you'll want to make sure that the navigation bar does not cover any portion of the image that you want to be visible.

In the Masthead area above, the main navigation bar covers the face of one of the two people in the image.

In mobile and tablet display, a solid bar displays at the top of the page. This bar holds the menu icon (three vertical lines) that are used to access the main navigation. This bar will cover roughly the top 1/2 of the image.

Mobile display

Image display in the Masthead component in mobile view

Tablet display

Image display in Tablet view of the Masthead component