Image Mangement

Good image composition, including subject positioning, is key when selecting an image.  Watch the video below for a full tutorial covering image selection, resizing, naming, and positioning.

Selection Criteria

Choose an image that renders well on all screen sizes.  In most instances, this means the main subject of the photo should appear at or slightly right-of-center and in the middle third. 

People in your photo? 

  • Position so the entire image shows subjects from the waist up
     
  • If the photo isn't illustrating a story about feet or shoes - no need to show them!

Do not use photos that are:

  • Blurry
     
  • Crooked
     
  • Upside-down, or otherwise weird

Optimal Image Dimensions

The maximum size for all SiteMasonry images is 2MB

Thumbnail Image

Must be added to every page and news item.

  • 1:1 aspect ratio
  • shape - square
  • minimum dimensions - 300x300 pixels
  • maximum dimensions -  400x400 pixels

Header Image - Landing Page

May be added to a landing page.

  • 30:13 aspect ratio
  • shape - horizontal rectangle
  • minimum dimensions - 2600x1127 pixels
  • maximum dimensions - 3000x1300 pixels

Slide Image - Landing Page

May be added to a landing page.

  • 16:9 aspect ratio
  • shape - horizontal rectangle
  • minimum dimensions - 2600x1463 pixels
  • maximum dimensions - 3000x1688 pixels

Hero Image - Basic Page

May be added to a basic page.

  • 9:1 aspect ratio
  • shape - horizontal rectangle
  • optimal dimensions – 210x1890 pixels 
  • minimum dimensions –  210x1890 pixels 
  • maximum width – 3000 pixels 

Profile Image

May be added to a profile item. The profile 'headshot' displays as the image preview when shared to social media.

  • 1:1 aspect ratio
  • shape - square
  • minimum dimensions - 300x300 pixels
  • maximum dimensions - 600x600 pixels

Embedded Image

May be added to any text block.

  • use a source image with a minimum width of 400 pixels, maximum width of 800 pixels
  • after uploading an image, select a pre-formatted size from the dialog box

Featured Image

May be added to a basic or landing page.

  • A Featured Image block expands to the width of the section it is placed within
  • For optimal results, use images with a standard aspect ratio - 4:5, 16: 9 or 1:1 

 

In the video below, Digital Strategist Kristin Heydt teaches you image selection, resizing, naming, and positioning.