Image/Video Size Cheat Sheet

Images must be cropped to the desired size before uploading to Cascade, using Photoshop or other programs.

Always select “Save for Web & Devices…” in Photoshop. Adjust quality of image to balance image quality vs. file size. File size of images affects page load time and data usage on mobile. Note suggested file sizes below (e.g., 10k, 40k, etc.).

All image resolutions should be 72 pixels per inch.

Dimensions noted below are in pixels.

If your image is a logo or has solid bands of color, save it as a .gif file to reduce file size.

Important:

The new website template is responsive, so images will change in size and location depending on the browser width or the device being used to view the website. Below are the specifications people should use to create and upload their images; the rest happens automatically.

Header Images

These images must be 770 x 375px wide. Try to keep file size below 100k.

Images in Body Area of Basic Pages

Full width images (spans full width of content area):

Images that span the full width of the main content area should be 670 pixels wide. Try to keep file size around 60-80k, depending on image size. Height can vary.

Images using “image_floatLeft” or “image_floatRight” styles:

If you want to wrap text around the image, when using “image_floatLeft” or “image_floatRight” image styles:

Keep your image under 250-300 pixels wide (about half the content area). Again, height can vary.

Smaller images should be around 40-60k.

Images on People Listings Pages

Thumbnail images should be exactly 100 x 100px, around 10-12k.

Images in Sidebar Features

Microsite and department site administrators may want to add sidebar feature slides on their sites. Slide images should be 242 x 170px, around 30k.

Videos in Body Area of Basic Page

Embedded YouTube videos should be 670 x 377px.