How to choose good images for your site

Before you use an image, you must make sure you have the right to use it. 

• If you know the creator of the image, make sure you've obtained written consent to use it. 
• If the image is licensed through Creative Commons This link will take you to an external website in a new tab., make sure you include the appropriate attribution. 
• If it's an image you've found in an image library (like iStock or Adobe Stock), make sure you've licensed it for your use. 

In general avoid simply searching Google for images and pulling images from other websites to use.

One easy way to make sure you have the rights is to let us find an image for you! We have access to image libraries and can license what you need. You would just need to let us know in detail what you are looking for.

When choosing an image, it can be helpful to keep some questions in mind: Should this image tell a story, or is it just decorative? If the image includes people, who is represented in the image? How will my audience relate to this image?

In general it is best to avoid any prominent text in the image -- text you expect the user to be able to read. In cases when this is unavoidable (such as with a logo, where the text is part of the design), it is imperative that the text be included in the image's alternative text, so that it is read by screenreaders.

Keep in mind the image's size and orientation. A photo that is very small may become pixelated if sized up. On the other hand, a photo that is overly large will take longer to load on the page. In many cases images on our site are resized to fit the component, but that depends on how and where the image is added. If you have questions about an image's size, please reach out to us at atswebmaster@calstate.edu. 

Keep orientation in mind when adding images to components where orientation matters. For example, if adding a banner image, choose an image that is landscape-oriented, so when the image fills the entire width of the page, it doesn't also fill the entire height. Think of how the image will be used on the page when choosing your image.

• WebAIM: Accessible Images This link will take you to an external website in a new tab.
• WCAG 2.1, Success Criterion 1.4.5: Images of Text This link will take you to an external website in a new tab.