Image Guidelines

Images can be used in various places and have different designation names based on their location, such as a Hero or Featured Image. This section will go over the different image designations and their specifications.

All Images

The following are the recommended specifications for all the different types of images you can use throughout your site.

File Size

  • Maximum file size: 3 MB

*We recommend you use image manipulation software to keep file sizes down as low as possible to improve load times and overall performance. See below for resources. If you need assistance, please contact us.

File Type

  • Accepted file types: jpg, jpeg, png

*We recommend you use jpg only to keep file sizes down and improve load times and overall performance. See below for resources. If you need assistance, please contact us.

Guidelines by Image Type

Hero Images

A hero image is typically displayed at the top of a landing page or on a homepage. The pronounced image expands outside of the content area.

  • Ratio: 3:1
  • Recommended image size: 1680 x 560 pixels
  • Minimum image size: 1600 x 533 pixels

Featured Images

A featured image is typically displayed within the content area, unlike a hero or banner image which typically expands outside of the content area.

  • Ratio: 16:9
  • Recommended image size: 1680 x 945 pixels
  • Minimum image size: 1200 x 675 pixels

Teaser Images

The teaser image is typically displayed as a small photo on the homepage. It is also used alongside content in a preview, list view for the site.

  • Ratio: 16:9
  • Recommended image size: 1680 x 945 pixels
  • Minimum image size: 600 x 400 pixels

Embedded Images

An embedded image is displayed within the body, or text, of a piece of content. It can be formatted in two different ways: full or wrapped. 

  • Full: A full-size image takes up the full width of the content area. (none/centered)
  • Wrapped: Aligned left or right with text wrapping.

In basic pages:

  • All images: width 960 pixels

In news items:

  • All images: width 1200 pixels

Galleries

Organized display of grouped images in slideshow with thumbnails

  • Gallery Title: Required; Presented when inserted on a basic page
  • Ratio: 16:9
  • Recommended image size: 1680 x 945 pixels
  • Minimum image size: 1200 x 675 pixels
  • Maximum images displayed: 10 (5 when used as a carousel)

Carousel

A gallery displayed as a set of rotating images. If the characters are fully maxed out, the bottom half of the image is covered by the text overlay. 

  • Per slide Character Limits:
    • Heading: 85 characters
    • Description: 100 characters
  • Ratio: 3:1*
  • Image size: 1680 x 560 pixels*
  • Maximum images displayed: 5

*Gallery images are automatically cropped to a 3:1 ratio. It is preferred that the image is uploaded at the Gallery specifications above (1680 x 945 pixels).

People List Images

A people list image is an image displayed within each person in a people list. 

  • Ratio: 1:1
  • Minimum image size: 1200 x 1200 pixels

Image Resources

  • Photoshop
    • Full image manipulation
    • Image cropping, resizing, and compression
    • can open and save different image file types
    • Has a paid version only *Qualifies for an educational discount
  • ​​Gimp
    • Limited image manipulation
    • Image cropping, resizing, and compression
    • Can open and save different image file types
    • Free, open-source 
  • Pixlr
    • Limited image manipulation
    • Image cropping, resizing, and compression
    • Can open and save different image file types
    • Has a free and paid version