Inserting an Image
You can insert images directly onto web pages or in the body area of content types such as stories, events, and most blurb types.
Upload an Image
- From the LiveWhale page editor, put your cursor in an editable region where you want the image.
- Click the image icon on the page editor toolbar. This will bring up a list of the images currently uploaded in your group.
- Refine the list of images by keyword search. You can also upload a new one.
- You can reduce the scope of search using the “all images” drop-down to select the a date range, collection, or tag.
- Images shared from other groups are labeled with a globe icon. If you want to filter out images shared from other groups, uncheck the box labeled “Include shared images.”
- Select the image in the right column.
- The left column will contain the image you choose to insert. Choose a width or height for the image and alignment. The full and half column presets will automatically size the image to fit the region you are inserting it into.
- When inserting images, you MUST provide “Alternative Text” (Alt-text) for the image. The Alt-text is what screen readers like Jaws present to the visually impaired.
- When selection is made and image is sized, click the blue “Add Image” button on the bottom right.
- The image(s) will be inserted into the editable field on your page. You may align it using the alignment buttons in the livewhale editor toolbar.
- Click “save ” when you are finished.
Note: If you wish to change or resize the image later, simply double click on it and the insert image screen will reappear with the image you’ve inserted ready for editing.
Alternative Text
All images must have alternative text.
By law, images must have alternative text for people with visual disabilities. The Alt-text should be a brief description of the content of the image. (Code Example: <img alt=”text about an image” />)
Good alternative text is:
- Discernible (can be read by assistive technology like a screen reader)
- Meaningful
- Concise (nothing over 125 characters, because some screen readers will cut off the rest)
Alternative text should typically:
-
Be accurate and equivalent
in presenting the same content and function of the image. -
Be succinct
This means the correct content (if there is content) and function (if there is a function) of the image should be presented as succinctly as is appropriate. Typically no more than a few words are necessary, though rarely a short sentence or two may be appropriate. -
NOT be redundant
or provide the same information as text within the context of the image. -
NOT use the phrases “image of …” or “graphic of …” to describe the image.
It usually apparent to the user that it is an image. And if the image is conveying content, it is typically not necessary that the user know that it is an image that is conveying the content, as opposed to text. If the fact that an image is a photograph or illustration, etc. is important content, it may be useful to include this in alternative text. Copyright © 1999-2018 WebAIM (Web Accessibility in Mind). All rights reserved.