Optimizing Images for Word.Emerson

As the quality of photographs taken by smartphones increases, so too does the raw size of the file. In order to ensure that visitors to your website have the best experience possible, it’s essential to optimize your photographs and digital graphics for the web.

The two most important things to address when using images in your Word.Emerson content are:

  • Image file size: the amount of storage space your image takes.
    • All sites on Word.Emerson live on the same server and thus have to share the storage space available.
    • Word.Emerson sites are limited to a total of 3,000 MB of storage space currently.
    • Individual file uploads cannot exceed 4 MB in size currently.
  • Image dimensions: the height and width of your image, i.e. the amount of space on the screen your image takes up.
    • If your image is larger, the computer will attempt to crop it down, which may result in the loss of important visual information, such as cutting a person’s face out of the photo.
    • Most themes that make use of the “featured image” option for posts will attempt to fit whatever image you choose into the dimensions required for the theme.
    • Editing your image’s dimensions yourself will allow you to make sure that the image and post work together to convey the information that you want them to.

Below we’ve compiled a list of guides and links to tools to help you optimize your images. 

Please note: most links will take you out of Emerson's websites.

General image optimization


WordPress

If your image’s file size is less than 4 MB, you can do basic editing within WordPress.


Preview (macOS only)

Preview is the built-in document and image tool for Apple's Mac computers. It’s a useful tool for simple resizing. You can Crop, resize, or rotate an image in Preview on Mac.

Things to consider when choosing which option[s] to use:

  • Crop an image: This will remove portions of the image. This will make the image smaller, but it’s not a good option if you want to keep everything in the frame of the image.
  • Change an image’s dimensions: This will change the height and width of the image. We recommend pixels for web images.
  • Reduce an image’s file size: This will make the file size of an image smaller by changing its resolution. This is done via the Resample image checkbox and entering a lower resolution. It’s generally not recommended to go below a Resolution of 72 pixels/inch for web images.

You can see how big the file size will be after resizing by clicking Tools > Adjust Size:

Screenshot of Image Dimensions dialog box in Preview

Tips on managing images you’re resizing

  • If you want to preserve your original images, you can select and right click on the image[s] and Duplicate them before editing. You may want to do this if you are making changes to the images that significantly alter the size and/or resolution of your original photos.
  • You can also revert to previous versions after applying edits.
  • You can also resize multiple images at once. To do this, display the images in the same window. Then select them in the window's sidebar and click Tools > Adjust Size. This applies the same resizing parameters to all the images selected.

In a pinch and need to reduce the file size now?

In Adjust Size:

  1. Keep Scale proportionally and Resample image checkboxes selected.
  2. Adjust the Width or Height to a smaller value. For example, try less than 800 pixels wide for a Word.Emerson blog post.
  3. If you’re using the image on the web, the generally recommended Resolution is 72 pixels/inch. If you’re changing the resolution, consider the tips above concerning your original files.

Adobe Creative Cloud

Adobe CC is provided free to full-time Emerson faculty, staff, and students for their personal machines, as well as being available on lab computers around campus. If you don't already have Adobe CC installed on your machine, the following guides can help:

Photoshop

  • Official Photoshop Tutorials
  • Export options in Photoshop
    • PNG is a lossless image format, but file sizes tend to be larger. If the image is cropped down appropriately, it shouldn't be an issue.
    • JPG does lose some image quality, but you can adjust how much is lost in the Export As menu.

To resize photos in Photoshop, look for Image > Image Size. Towards the top of the Image Size window, you'll see the current file size, followed in parentheses by the size the file will be after the changes you've specified. 

Screenshot of Image Size dialog box in Photoshop

Lightroom

To resize photos in Lightroom, use Export (scroll down this page to the section titled “Export photos in the format of your choice”). The size of the file that will be created from the specifications that you select here is displayed at the bottom of the window:

Screenshot of Export dialog box in Lightroom


Web-based tools

Editors

  • PIXLR (Also available as a mobile app)

Image compressors

Was this article helpful?
0 out of 0 found this helpful
Have more questions? Submit a ticket