When to use Images

Images are not intended to replace written instruction, merely to give the user supplemental visual context for complex procedures. All documentation should be written to assume that any image inserted into the documentation is not visible to the user. 

How to Insert an Image

Images can be inserted into a document two ways.

  1. While in editing mode drag and drop a image, or file, onto the page.
  2. While in editing mode paste a copied item onto the page.

Formatting an Inserted Image

Upon selecting an inserted image a toolbar will present itself.

Depicts the Image editing toolbar.

On the image editing toolbar the following image attributes can be edited.

  1. On this toolbar the size of images can be edited. Images should not be overly large and an average square image of a single item should be around 350 pixels.
  2. Selecting the Properties button will render an Image Properties page allowing for a Title, Alt Text and an Effect to be added to the Image.

    Depicts the Image Properties Page with the Drop Shadow effect selected.

  3. It is mandatory to add a Title and Alt text to all images. Alt text must be a description of what is taking place in the image and different than the title.

    Depicts adding Title and Alt text to and image on the Image Properties page.

Design Guidelines

  • All documentation should be written to assume that any image inserted into the documentation is not visible to the user.
  • Any images should not be excessively large (around 350 pixels), or depict more than necessary to give the reader visual context of the written instruction.
  • All images must have a title and alt text.
  • Alt text must be a description of what is taking place in the image and different than the title.
  • It is recommended to give inserted images the drop shadow effect.

More about Content Types and Formatting