Image Sizes Chart

Saving Images

  • Images should be cropped to the appropriate size and saved for the Web as a 72dpi JPG, PNG, or GIF file.
  • To optimize photos for web, in Photoshop choose to Save for Web, and save the image as a JPG Quality High (60).
  • Images that are scaled on the page, rather than inserted at the correct size, will increase load time and may stretch out of proportion.
  • JPGs are best for photography. PNG is best for images that contain both photography and typography or geometric shapes.

Naming Images and Using Alt Text

  • For accessibility and search engine optimization, images must be named appropriately and contain valuable keywords.
  • Images cannot include spaces or special characters and should be all lower case. Use a dash to divide words. For example “my-image.jpg.”
  • It is imperative for search engine optimization and to meet accessibility guidelines, that every image to contain an appropriate Alternative Tag with meaningful text and rich keywords.

Image Sizes Chart

Images Size (w x h) Retina Size (w x h)
Home Page Banner 1000 x 700 not supported
Home Page Feature 310 x 195 610 x 390
Program (slider and list) 450 x 285 900 x 570
Spark of Inspiration 150 x 150 300 x 300
Partner/Donor 520 x 360
Podcast 310 x 195 610 x 390
Blog Post 310 x 195 610 x 390
News 310 x 195 610 x 390
Interior Banner Image (single) 1920 x 390 not supported
Interior Banner Image (set) 800 x 600 not supported
Right Column Callout 280 x 185 560 x 370
Mega Menu Callout 280 x 185 560 x 370
Billboard 618 x not supported