Event Images

One of the largest problems we see with events is poor image choices. The ideal event image is:

  • horizontal (landscape);
  • has little to no text;
  • suggests what the event is about;
  • visually pleasing.

Horizontal Vs. Vertical

Horizontal images work better for main content areas on websites from a user experience standpoint. It is easy to see them, and then to scroll past them to the text content below. With a long vertical image, some users will never scroll past it and may not realize there is important copy underneath it. Image crops were set up on the site following this logic.

Image Sizes and Crops

When you upload an image to your event, you are asked to make several crops in order before you can save the event. This might seem cumbersome, but it is actually much easier than the alternative. The different crops are used for when the event is displayed in different parts of the website, as well as to resize the images for different browser sizes and for mobile browsers.

Images should also be of a decent size, but not too big. Ideally, an image will be at least 775 pixels wide but should be around 1200 pixels wide in case we decide to feature it on the calendar. If you upload an image smaller than 775 pixels wide, the site will stretch it to make it fit the 775 width, and the image will look blurry or pixelated. Images should be saved at 72 dpi.

Images with text

While images with text are possible, we strongly advise against them. They are a large accessibility liability because they are considered “Complex Images” and are subject to stricter standards. All the image text must be included in the alt text field or somewhere else on the page so it does not cause a user using a screen reader to miss out on content. In addition, depending on the color of the text and of the background, the image may also violate color contrast standards. Unless you are very familiar with the accessibility standards and can prove that the image does not break standards, please do not upload any images with text.

Please keep in mind that with most things about events, WebServices has the right to remove or alter the images used on the event page. If you have an event coming up and want to check with us about an image you are planning on using, please email us at webservices@usfca.edu.

Leave a Reply

Your email address will not be published. Required fields are marked *