Image tips – including alt text

On this page:

• Image recommendations
• Enable Lightbox to display a larger view of an image when clicked
• Accessibility for images
• Find images

Image recommendations

Ensure any images you use are copyright compliant. The Copyright and Creative Commons chapter of this book explains more about using Copyright and Creative Commons licensed material in your work.

Check out the Adding media guide from Pressbooks.

• Use high quality, large images whenever possible.
• Max size for a file upload into Media is 10 MB. Most images can be much smaller than that (250 KB to under 1MB) and still look good.
• For both a web and print book width 500px by height 600px is recommended.
• Centre images.
• Add a caption. Images without captions will not render properly in all e-readers.

Detailed images

• Set images to Full size in Pressbooks, otherwise a smaller or compressed version of the image will be exported.
• The Thumbnail option images are only 150 x 150px and may be too small for print versions of Pressbooks.

Enable Lightbox

If the image view size is too small it can be hard to see details.

1. Enable Lightbox under Appearance -> Web Options to allow images to show a larger view when clicked
2. In your chapter, click to edit the image
3. At Link To, under Display Settings, select Media File
4. The URL of your image will be shown.
5. Click Update to save the changes.

You will need to do this for any images you want to Lightbox.

Accessibility for images

Add Alt text to all images, unless they are purely decorative. W3.org explains alt text for different types of images.

Alt text, captions, and titles for images (from the US General Services Administration – Accessibility Guide)

Complex images

Graphs, charts, or diagrams need to be explained in text. You can:

• Have the same information conveyed in the image in the surrounding text.
• Use Alt text if it is not too long.
• Use a long description. You can do this either in the text below the image or put it at the end of the chapter and use an anchor link. Anchor links for long descriptions instructions.
• Ensure you have a good contrast between the background color and your font color in charts, graphs etc. Black font against a white background provides the best contrast.
• Bold the font and increase the font size to increase the visibility in images.
• Do not add tables as images (if you absolutely have to do this, you need to fully explain it in the alt text or text description).

Find images

The UWF library Open educational resources (OER) guide lists sources of a wide array of images.