Skip to main content

Images and Photography

Photography for Use on Your Site

Photos of campus events, buildings, etc. can be found on the sites below. Do not use images downloaded from google or other places that you have not paid for or gotten permission to use.

Learn more about photography usage and scheduling here.

Web Image Sizes

For examples of how these image sizes work with each theme, you can review our example sites for an Academic College Site, Academic Site or an Administrative Unit Site.

College Banner

1350 x 325 pixels, compressed for web jpg file.

Top Medium Image Banner

Also the Department Homepage Banner and Unit Homepage Banner
1140 x 325 pixels, compressed for web jpg file.

Top Image Banner

820 x 345 pixels, compressed for web jpg file.

Content Images

For Photo Galleries, Cover Images, Media & Text Blocks
450 x 300 or 300 x 450 pixels, compressed for web jpg file.

Portraits

151 x 240 pixels, compressed for web jpg file.

Resizing Images

Resizing images can be done easily without special software. For the best results, we suggest using Adobe Photoshop’s save for web dialog. See the instructions below for your operating system or within WordPress.

Windows 10

  1. Navigate to the image you want to resize. Right click the image and open with “Photos”
  2. Right click the image in the Photos application. Select “Resize”
  3. Select “Define custom dimensions”
  4. In the “Width:” area, input a value less than 800 or if resizing a banner image consult the sizes above.
  5. Make sure “Maintain aspect ratio” is checked. A quality of 80% should be good, if you want the file size to go down a bit more (take up less space) you can reduce the quality but be careful of going too far.
  6. Click “Save revised copy” and save the image.
  7. To further compress the image, upload it to the Online Image Compressor site then download the compressed image to your computer.
  8. Upload to WordPress.

Windows 7

  1. Navigate to the image on your computer, right click and select “Edit” to open the Paint editor.
  2. In Paint, click “Resize” in the top toolbar and an options panel will appear.
  3. Select the radio button to resize by “Pixels” and then enter a new value (less than 800) for “Horizontal.” You will see the Vertical value will automatically be calculated to maintain the aspect ratio.”
  4. Click the “Ok” button to apply the changes.
  5. Save the resized image to your computer.
  6. To further compress the image, upload it to the Online Image Compressor site then download the compressed image to your computer.
  7. Upload to WordPress.

Mac

  1. Navigate to the image you want to resize. Right click the image and open with “Preview”
  2. Go to “Tools” at the top of the screen. Select “Adjust Size…”
  3. On the pop up that appears over your image, next to the lock icon, make sure the dropdown is set to “pixels” (it is probably set to inches when you first look at it.)
  4. In the “Width:” area, input a value less than 800 or if resizing a banner image consult the sizes above.
  5. Make sure the “Resolution:” is set to 72 pixels/inch and make sure “Scale proportionally” is checked then click ok.
  6. Go to “File” and click “Save” if you want to save over the original image. Go to “File” and click “Duplicate” to create a copy of the original file then click “Save” to save the file and rename if you wish.
  7. To further compress the image, upload it to the Online Image Compressor site then download the compressed image to your computer.
  8. Upload to WordPress.

Online Photoshop Editor

  1. Navigate to Adobe Photoshop Express
  2. Upload the image you want to resize or edit.
  3. Click Resize Image in the left sidebar. You can also crop the image if you’d like.
  4. In the right sidebar that displays, change the pixel size to your desired size. Make sure that the lock icon is closed to keep the ratio of the photo.
  5. When you’re finished resizing, click the Resize image button in the bottom right.
  6. Click the Download link in the top right.
  7. In the pop up, choose your compression and file name. Click the download button to download to your computer.
    • Jpg is best for simple images on the web but if your image has any transparent areas, save it as a png instead.
  8. To further compress the image, upload it to the Online Image Compressor site then download the compressed image to your computer.
  9. Upload to WordPress.

WordPress Media Library

  1. Click “Media” in the left sidebar. Upload the image you want to resize. (if the image is larger than 2mb you will have to resize the photo outside of WordPress)
  2. Click on the image you want to resize. (if you are resizing an image already uploaded, it is recommended that you download the image and re-upload it so that you do not edit the existing image that may already be on other pages)
  3. On the popup, click on “Edit Image” under the image.
  4. On the right side you will see a column that shows the current dimensions. Under “New dimensions:” change the left number (the width) to be less than 800 or if resizing a banner image consult the sizes above.

Photography Sizing Tips

When looking through what to delete or reupload, remember to check the actual sizes of the images you are deleting

You have 150MB to use. When looking through your image sizes remember that 1MB = 1,000KB.

You could delete 20 photos and feel like you’ve done a lot but if each was only about 20kb you’re only saving 400KB which isn’t going to make a great impact on your storage space which can be frustrating.

See the following screenshots to see what to be on the lookout for. You will notice that just one of these images is 1MB and the other is a whopping 2MB. Deleting these images or resizing them will have a great impact on your storage limit. As a good rule of thumb, nothing uploaded to your site should exceed 1,000 pixels wide. The first one is 3088x2068px and the second is a similar size.

You should not be uploading full quality or storing print-quality images in your WordPress site. Please create a folder in your departmental google drive for backup of photos.

Saving Images in Photoshop for the Web

  1. Open your photo in Photoshop.
  2. Edit it as you would like to see it on your site.
  3. Go to File → Export → Save for Web (Legacy).
  4. Change the preset to JPEG High.
  5. Change the width of the image to 1000px or less. You will be able to see an estimate of the size in the bottom left.

Don’t have Photoshop? Or want to get your images as optimized as possible?

Upload the image you want to compress further to the Online Image Compressor site. Download the newly compressed file and upload to WordPress.

It’s recommended to resize the image as small as possible first, then utilize the online compression site to further optimize the image. You can use WordPress to resize an image then download it from WordPress and upload it to the image compressor site. See steps below for how to resize an image in WordPress without utilizing Photoshop.

Last updated: 3/22/2021