Image sizes can vary on mobile/responsive websites. Images may be squished to fit depending on the content type used and the size of screen on which it is viewed.
While there are not set rules in every case, there are a few set sizes and recommendations.
Content area width
1320px is the maximum width of the content area.
Fullwidth images should be 1300 - 1600px
Should be less than 1MB. 500kb should be large enough for most images.
jpg is the recommended format for images
200 x 300px
The use of sliders is not recommended.
1320 x 500px
800 x 533px
Portraits for Faculty/Staff Directories
They should be 200x300 (200 pixels wide, 300 pixels tall)
There are many cases where faculty/staff listings need to be shared on multiple pages, i.e. cabinets, committees, task forces. If all images are the same size this will give all directories a clean and organized look.
Images for sliders
The use of sliders is not recommended. Learn more
All slides in a slideshow need to be the exact same size.
Recommended Size: 1320 x 500 (1320 pixels wide, 500 pixels tall)
1320 px is the maximum width of the content area. That is the recommended width for slides.
Picture Links Menu
All images used in the Picture Links Menu need to be the exact same size.
We recommend using a 3:2 ratio.
Recommended Size: 800x533 (800 pixels wide, 533 pixels tall).
Image sizes for general content area
The size you use for images in other areas depends on what you want to accomplish with the image and your own personal taste.
Below are the maximum widths for various columns used on the website. This may help you visualize what size you want an image to be.
Keep in mind that on small screens (phone, tablet), all columns collapse. Each column is then the width of full screen. This means if you are using one of the column content types, you may want the images to be 600-800px wide.
Full width: 1170 pixels
Half width: 585 pixels
One-third width: 390 pixels
Quarter width: 293 pixels