Optimizely: Web Image Sizing, Settings, Alt Text, and Best Practices

Image Size

Save or ensure all images are also saved to web-ready DPI (dots per inch) of between 72-90 DPI to ensure image load time for users is minimal. Images can be edited directly in EpiServer in the Image Editor or before uploading into EpiServer. We recommend using Adobe Photoshop, which is available to all University staff. Submit a ticket to request an Adobe license if you don't already have one.

Hero Image 1440 x 610 pixels
Carousel Image 1440 x 610 pixels
Side by Side Carousal Image 936 x 527 pixels
Profile Image 330 x 330 pixels
Editorial Block Image 500 x 281 pixels

Alt Text

Alt text (alternative text) is a very competent and required piece of information for each image. Add a short descriptive and simple phrase that describes the image clearly. Ask yourself, if I was unable to see this image and someone were to describe it to me, what phrase would help me visualize it? We want to ensure all people can have the same experience on our website and this helps accessible technologies - and beyond give that experience to all!

How to Upload and Add Alt Text to Images

1. Upload your image to the proper media folder.

  1. Before uploading, ensure your image is cropped to the exact dimensions required for your block or page (see image guide above). We recommend using Adobe Photoshop but many other image editors exist. 
  2. Select the correct media folder.
  3. Click the "+" icon in the lower right-hand corner of the media folder.
  4. Click the "+" icon in the dialog box that appears.
  5. Locate the image on your computer and click "Upload".

2. Find your image and click "Edit."

  1. After you have uploaded your image, open your media folder and scroll to the image you want to add alt text to.
  2. Hover over the image and a menu icon will appear to the right of the image.
  3. Click the menu icon and then click "Edit."
    a screenshot of a computer

3. Type in your short phrase.

  1. Enter descriptive text into the "Alt Text" field.
  2. This improves Search Engine Optimization (SEO) and accessibility of your page.
    an alt text field

4. "Publish" changes to make them live.

  1. Select the "Publish" button.
  2. Click "Publish Changes" in the drop-down to publish them to the website.

How to enter alt text

Image Library

The University maintains a comprehensive image library that the campus community can access with their StarID and password. The Image Library is updated regularly with new campus photography. University Marketing and Communications has built relationships with several photographers who may be able to meet your photographic needs.