Event image best practices

What makes a good event image?

Images should reflect the topic or give an overall sense of who, where and/or what the event is.

Correct size: 600px x 600px
No text
- Exception: A logo that includes lettering or text is acceptable if it is one, single logo and the alt text field describes it.
No QR codes
- Links are offered in the event calendar entry and RSVP fields. QR codes are designed to be printed and used in offline situations.
High contrast ratio of at least 3:1
- The contrast between background and foreground should pass "Color Margins" based on the contrast checker
Crisp and clear images -- not blurry, pixelated, skewed or stretched
Images need to be optimized (file size reduced for the web for fast load time).
- File size: less than 50 kb
Alt text is the written copy that appears in place of an image on a webpage if the image fails to load on a user's screen. It is read by screen readers in place of images allowing the content and function of the image to be accessible to those with visual or certain cognitive disabilities. For more examples of alt text visit webaim.org.
- It is recommended to be under 240 characters and succinct.
- Describes image content.
  - Image: portrait of a speaker
    Alt text: Andrea Smith
  - Image: smiling students
    Alt text: diverse group of students in front of the student center

600 x 600 px event page images for each School/College, generic images and several event type icons

Resizing images

Adobe photoshop
resizeimage.net
- At "Optimize your image", drag the scroll bar to the left to bring the value to 15% image quality. Click "Resize image" and download your optimized image.
- YouTube tutorial
imageresizer.com
pixlr.com

Accessibility contrast checkers