Images

Recommended Sizes

Below are common image sizes for your site.

Page Header Image: 1600 x 675 pixels (larger option - 1920 x 810 pixels)

Rotator/Page header image with text overlay: 1600 x 780 pixels (larger option - 1920 x 936 pixels)

Note about header/rotator images: These images will often not display in their entirety at various screens sizes. It's recommended to limit any textual content that's built into these images and, if possible, to keep any text near the center.

Article or Event Header Images:  Articles and Events have a separate field for header images that will display on detail pages, and these images should be the same size as the standard Page Header Image at 1600 x 675 pixels.

Module Images:  Unless noted otherwise in this guide most modules (sermons, events, articles, etc.) images should be 1,200px wide by 675px tall.

Module Image Exceptions:

  • Staff Layout #3 - It's important to use a consistent size for all of your staff images. Recommended size is 1,000px wide by 1,500px tall.

Section Background Images:  Images used as a background for full width sections should be 1,600px in width; the height required will depend on the amount of content in the section. A recommended height would be between 600px and 1,200px.

Monklet Images: Unless noted below or otherwise in this guide, monklets will use the module images associated with them, and most module (sermons, events, articles, etc.) images should be 1,200px wide by 675px tall.

Community Monklet: Images should be square

A Word About Saving Images:

To reduce file sizes and help speed up load times, be sure to use “Save for Web & Devices” in Photoshop (or a similar setting in other tools) and stick with the JPEG format. Always save images at 50%–70% quality, especially for large header graphics.

Stock Images

A few stock photography websites:

 

Photo Editing Software

A few photo/image editing tools: