Skip to main content
All CollectionsBest Practices
Add Alt Text to Images: Best Practices
Add Alt Text to Images: Best Practices
Emily van der Harten avatar
Written by Emily van der Harten
Updated over a week ago

Assistive technologies like screen readers use alt text, also known as alternative text, to describe images to people who are blind or have low vision. Alt text also appears in place of images when they can't load properly due to low internet bandwidth, and when someone hides images on a website to lessen cognitive load.

Webex Events lets you add alt text to images throughout our platform, so everyone can participate equitably in all event experiences. This article shows you how to add alt text to images, and it provides tips and resources for writing effective alt text.

Why add alt text to images?

Writing effective alt text is a worthwhile skill to learn. Practice makes perfect, though, and trying is far better than doing nothing at all. We highly recommend adding alt text to every image, or marking images as decorative where appropriate. If you do nothing, your content will be inaccessible to a wide variety of users. Likewise, screen readers will instead read the image file name, which can lead to a frustrating and unpleasant user experience.

Alt text tips

Before we learn how to add alt text in the Webex Events platform, this section highlights a few different types of images, outlines tips on writing alt text, and provides resources from the Web Accessibility Initiative (WAI) to help you learn more.

Types of images

There are different kinds of images that warrant different kinds of alt text. The following are common types of images you might add to various parts of the platform:

  • Informative images - Images with information that aid in understanding a concept that's being conveyed on a page. If a person can't see the image, they miss out on key information. These images need alt text.

  • Decorative images - Images that don't add any further information to what's conveyed on a page, like a background image. These images can be marked as decorative.

  • Functional images - Images that also link to other destinations. These images need alt text that includes the link's purpose. For example, if you have a banner image that internally links to the Sponsors feature, include this information in your alt text so people know what to expect.

  • Images of text - Images that contain informative text. The message conveyed in an image like this needs to have a text equivalent, usually written in the alt text.

Tips for writing alt text

  • Keep your alt text brief. We recommend no more then 1-2 sentences, and the Webex Events platform limits alt text to 250 characters.

  • Describe the image in context with its surroundings. Ask yourself, "What essential information do people need to know about this image?" Your goal is to provide the text equivalent of what the image is conveying.

  • If your image contains text, that messaging also needs to exist in text format, either in the alt text field or in an adjacent description. For example, you might have a banner image that has some information about a Session. Screen readers can't read text that's baked into an image, so alt text is a great place to add a text equivalent.

  • Don't begin alt text with "Image of". Screen readers often announce images, so writing "Image of" is unnecessary.

  • Marking an image as decorative tells a screen reader to ignore the image and pass over it. Mark images as decorative if:

    • The image doesn't add any additional information or context.

    • The image is described in adjacent text, and adding alt text would otherwise be duplicative. For example, a profile image with the name 'Serena Page' in text directly below it doesn't need alt text that says "Serena Page's profile image", and it can be marked decorative.

Alt text resources

WAI has plenty of resources to help you write clear and helpful alt text.

Where can I add alt text in Webex Events?

With almost any image you upload to the Webex Events platform, you can add alt text or mark the image as decorative. The exception to this is profile images, which are automatically marked decorative for you. 😸

💡 Keep in mind, you can only add alt text to an image when manually uploading directly within the platform. Currently, it's not possible to add alt text when importing data.

On the Event App, attendees can add alt text to images they post to the Wall feature.

How to add alt text in the Webex Events platform

  1. When uploading an image to the Webex Events platform, click the Add alt text button in the 'Preview' step.

    The Add alt text button in the Preview modal.
  2. In the 'Add alt text' modal, enter a brief description of the image in the Alt text field, up to 250 characters. If the image is decorative and doesn't add any informative value, simply check the 'Image is decorative' box without adding alt text.

    1. In the following example, the image contains text that says, "Keynote Speaker Janet Watson. Chair for Sustainable Energy for All, UN Energy.", so we've added this exact text to the alt text field.

      The example just described in the Add alt text modal.
  3. Click Save.

  4. Click Upload to finish.

💡 Keep in mind, it's not possible to edit alt text on an image in the Webex Events platform. If you need to change the alt text, you must re-upload the image and add the updated alt text during the upload process as just described.

How attendees add image alt text to a Wall post

Attendees who upload an image as part of a Wall post can add alt text before they post to the wall.

Web App users click the Add alt text button in the 'Preview' step, add alt text or mark the image as decorative, click Save, then Upload.

The add alt text modal on the Web App. The alt text says, "Bert, an American shorthair orange tabby cat, sitting pretty on a moving box."

Mobile App users simply tap the +Alt button in the upper right corner of the image, enter alt text for the image, tap Done, then Post.

The process just described.

Now you know about alt text! Why not learn more about how you can save time with collaboration forms?

Questions? Chat with us or email support@socio.events

Did this answer your question?