Images can be added to many different kinds of Cascade documents in many different ways, but the standards and formatting for images are the same. Read below to learn about our top tips for images and alt text.

Images on the web should always 

• be consistent with the University's brand standards for photography
• be high resolution—never blurry or pixelated
• make sense in the context of the page and the website
• have text no smaller than 36pt
• if the image is clickable, there should be an indicator that it is clickable, such as a triangle arrow or a button.  Please refer to the documentation on button style.

 1. You should take photographs with a high-resolution camera.

In other words, you should not take photos with a phone. If you do not have a high-resolution camera, you can fill out a photo request form with advance notice of your event to have a JMU photographer take photos for you.

2. Always use high quality images. 

If you are not personally taking photos with a high-resolution camera nor hiring a JMU photographer to photograph your event and instead are using preexisting images, be sure that the image files are large enough to meet the minimum height and width requirements according to the sizing chart. If it is too small, blurry, fuzzy, pixelated, or poor quality, find a different image file to use. 

3. You can access ready-to-go images through Cascade's _images folder.

You can find high-quality, pre-measured images in Cascade's "_images" folders. You can also locate specific images for action links, features, and spots: 

/_images/_action-links
/_images/_features
/_images/_spots

4. You can freely access photographs from JMU Creative Media.

JMU Creative Media is a Google Photos website that categorizes and shares high-quality JMU photos. You can freely access theses photos, but be sure to resize the photo so it meets the minimum height and width requirements according to the sizing chart. We recommend using Cascade's _images folder to search for images since the images already adhere to the sizing requirements.

5. Use quality alt-text.

You should always use quality alt-text (see below) so that the image's description is still accessible to screen readers for website visitors without sight.   Continue reading for tips on creating quality alt text.

One of the first things anyone learns about accessible web design is the importance of the alt attribute on images. Writing alt-text is easy, but writing good alt-text can take some thought. The following sections outline steps web designers can take to implement effective alt-text.

What is alt-text?

Alt means ALTernative: The alt attribute is the text that represents the image in Screen Readers, a program designed for visually impaired web users. Screen Readers reads webpages aloud for the user, so it is important to write clear and communicative alt-text for your images. When writing alt-text, ask yourself what information the image is conveying.

Alt-text for decorative images

For decorative images, leave it blank: Most sites contain a large number of images that serve purely decorative purposes: things like spacer gifs, images forming the corner of a pretty drop shadow effect, floral patterns attached to item headers. All of these should have their alt attributes left empty because they add no extra content or context to the webpage's information.

Alt-text for images with text

If an image contains text, replicate the text in full: There are no exceptions to this rule: if an image contains text, the alt-text must be the same. This is particularly important when images are used for navigation elements that also act as links.

Alt-text for charts and graphs

For charts and graphs, try to summarize the trend: Charts and graphs are one of the harder image types to make accessible. Often though, a chart will be used to highlight a specific trend. In this case, the alt-text should be used to summarize that trend; for example, a graph's alt-text could read: "unemployment rates rose from 5% in January to 7% in March." 

Alt-text for all other elements

For everything else, be imaginative: The above advice covers the most common cases; for images that are there for a purpose and are not covered above, be creative. When creating alt-text, ask yourself: What information is the image conveying? For example, a photograph of your uncle may have the alt-text "My uncle, standing in our living room, holding our black and white cat." 

Courtesy of: gawds.org