Add alt text to images

Avatar
Misty Flowers

Alt text (alternative text) is a written description of an image required for ADA accessibility and WCAG compliance. In Finalsite, alt text can be added directly in Resources so it follows the image everywhere it's used on the site, or added in the content editor when inserting images into pages or posts.

💡Quick answers

  • Why is alt text required on website images? For ADA accessibility; alt text allows screen readers to describe images to visually impaired users and is a WCAG 2.1 Level AA requirement under ADA Title II.
  • Adding alt text to an image in Resources? Click the image in Resources to open the Quick Actions Panel, then type the description in the Alt Text field (max 125 characters); this alt text follows the image everywhere it's displayed on your site.
  • What makes good alt text? A concise, specific description of what the image shows (not 'image of' or the file name); include any text that appears in the image and focus on meaning rather than appearance.
  • Can alt text be added when inserting an image into a Content element? Yes; when you insert an image using the Image button in the Content element editor, an alt text field appears where you can add or verify the description for that specific instance.

Ensuring that images on your school’s website are accessible to all users is essential for meeting accessibility standards. Alternative text (alt text) plays a key role in helping screen readers convey the content and purpose of images to visually impaired users.

🚨Compliance Extension Update: ADA Title II

Per the April 2026 Department of Justice (DOJ) Interim Final Rule, compliance dates for the ADA Title II mandate have been extended by one year. All school district web content, including PDFs and electronic documents, must meet WCAG 2.1 Level AA standards by these revised deadlines:

  • Districts 50,000+: Must be compliant by April 26, 2027.
  • Districts < 50,000 & Special Districts: Must be compliant by April 26, 2028.

To learn more about how Finalsite is helping our users reach compliance under this new timeline, check out the article, "ADA WCAG 2.1 Accessibility at Finalsite."

This article shows you where in your Composer platform you can add alt text to your images, with step-by-step instructions to get you started!

In this article

Prerequisite: Learn to write alt text! 

Before you proceed with this article, be sure to learn and practice some new alt text strategies you can learn about in the article, "Best Practice: Writing alt text for images." 

Add alt text to an image in the editor

  1. If you are inserting a new image, click the Insert Image icon.

    image-icon-editor.png

  2. For an existing image, right click on the image and select the Image Properties link.

      right-click-example.png

  3. In the Image Properties settings, find the Alternative text field and input your image description.

    image properties alternative text field.png

  4. Save your settings, save the Content element, and publish the page.

Add alt text to a navigation dropdown image

  1. On the given landing page, click the Page Settings gear icon.

    page settings gear.png

  2. Click the Nav Info Tab and find the Thumbnail Alt text field. This field only appears after you have added a Page Thumbnail.

    add alt text in page settings > nav info.png

  3. Enter your alt text, then save and publish the page.

Add alt text in Resources' quick action panel

While uploading media into Resources, easily pop open the quick actions panel to add alt text to images in a super efficient way!

Gif video showing how to add alt text in the quick panel.gif

Add alt text to constituent profile images in File Manager

For images stored in the File Manager and used in constituent profiles (such as staff directories or student lists), the system automatically handles accessibility to ensure every individual is identified correctly.

  • Automatic naming: The alt text is automatically populated with the constituent’s full name (e.g., alt="Jane Doe").

  • Independent of display settings: This happens regardless of whether you have the "Show Full Name" setting turned on or off in the element settings. Even if the name isn't visible on the screen, it will be "visible" to a screen reader.

  • Filename vs. alt text: Note that the system uses the profile data, not the filename, for the alt text. For example, a file named Doe_JaneWEB.jpg will correctly render as alt="Jane Doe" for a screen reader, ensuring the user's formal name is read rather than a technical filename.

Ensure ADA compliance by requiring alt text

Resources settings are available to help ensure ADA compliance on your site by requiring alt text in order for images to be shown on the site. There are separate toggles for Resource elements and the content editor. A warning box will display the number of images that will be affected by enabling the alt text requirement for Resource elements.

Pro-Tip: Auto-generate alt text in bulk with AI

Finalsite's new AI Alt Text Generator automatically creates alt text for images in the Resources module. This AI-powered tool reduces manual work, ensures inclusive access, and can bulk-scan your existing media library for full accessibility compliance. Learn more in the article, "Use AI to auto-generate alt text for images in Resources."

require alt text ensure ada compliance.png

Need additional help?

For additional guidance on writing alt text, refer to the WebAIM Alt Text Guide.

Was this article helpful?
0 out of 1 found this helpful

Comments

0 comments

Please Sign in to leave a comment if you don't see the comment box below.