Digital Accessibility Tips for Staff

• PDFs will not be shared electronically, as they are often not ADA compliant or easily translatable. Using our approved formats* ensures accessibility for assistive technology and automatic translation, helping us reach all families. 
• A PDF that is scanned is not ADA compliant. It is essentially a photo, and a screen reader cannot read the text at all. 
• If a PDF document, such as a letter or a report, must be posted on the website, it should be formatted properly so it can be read with a screen reader. Apply Headings, alt text, and correct table formatting.
• Adobe Acrobat Pro can be used to make a PDF digitally compliant (this is called a "remediated" PDF). View instructions on how to remediate a PDF using Adobe Acrobat Pro.

*current approved formats include: information shared on our webpages, or as an accessible file in its native format (such as Google Doc, Microsoft Word, etc.)

These guidelines will be put in place for faculty, staff, and approved partners to ensure that information shared with families and the community aligns with district policies and values. Our digital standards are designed to make information accessible, translatable, scalable, and available to all. The district reserves the right to determine if and how information is shared with families.

EXAMPLE:

1. Create a simple graphic:  This graphic might be for a parent-teacher meeting.
2. Determine information to share:  Date, time, location, other important details of the meeting.
3. Send informaiton and graphic to building secretary and building principal (or Nicole Whitfield if it’s to be shared beyond your building or the activities/athletics page). 

Potential sharing methods include school newsletter, district eNewsletter, website announcement, and/or social media. 

All videos (live or recorded) must include closed captioning so people who are hard-of-hearing or who have a hearing disability, as well as those using screen readers, can access the information. Captions should cover the entire video, including any on-screen text that isn’t spoken.

The easiest method is to upload your video to YouTube and enable automatic captions, then embed the video (e.g., on your LMS, social media, website, etc.). YouTube also supports captions in multiple languages. If automatic captions don’t generate due to formatting issues, you’ll need to add them manually. Please note that transcripts may also be required for videos. 

Use descriptive link text: Instead of generic phrases such as "click here," write meaningful link text that describes the destination. 

1. Use concise and meaningful text for links (avoid these words: click here, more, read more, find out more, click for details)
2. Do not capitalize all letters in links
3. Avoid using URLs for link text
4. Do not use the word "link" as part of the link text
5. Avoid using images as your email signature (your signature should meet district branding/style guidelines and with the district and your email, phone number, and links should be clickable so it works with mobile devices and readers)

Approximately 1 in 12 men and approximately 1 in 200 women experience color blindness (unable to perceive or distinguish between certain colors). Checking color contrast ensures that the contrast between text and background colors is high enough for readability. Avoid using color as the only way to convey meaning. There must be a 4.5:1 ratio between text and its background.

Ways to check color contrast:

A fool-proof way to ensure compliance is to use black text on a white background.

Here are a couple of tools that can be used to check color contrast:

• Use the Web AIM Contrast Checker.
• Use Grackle Docs to find contrast errors (see Grackle information below). 

Headings (known as Styles in Google Docs) provide behind-the-scenes coding that allows a screen reader to navigate to different sections of the document. Do not use bolding, increasing font size, or other manual formatting to create the appearance of a header. This is a visual cue only and will not be identified as a heading by a screen reader.

To Apply A Heading:

1. Apply the style: Select the text, then click the Format menu > Paragraph styles. You can also find the Styles dropdown menu in the main toolbar.
2. Follow a logical order: Structure your headings like a document outline. Headings should be properly nested, and you should not skip heading levels.
3. Include a Header: Include a header at the top of your document. This should be the title of your document. 

Heading 1: Use once per document for the main title.
Heading 2: Use for the major sections of your document.
Heading 3, 4, etc.: Use for subsections within a Heading 2, and so on.

• Don't use the "Title" style: The "Title" and "Subtitle" styles can be inconsistent and may not be recognized reliably by assistive technologies. Instead, always use Heading 1 for the main title.
• Don’t print from a Chromebook or Mac, print from your PC: When you print from a Chromebook or Mac it can change the styles and other important settings of the document and it could be rendered inaccessible. 
• Test your document structure: Use the Document Outline to verify your heading structure. Click the "Show Document Outline" icon on the left side of the toolbar (it looks like a bulleted list with indentations). This will show a nested view of your headings.
• Customize styles: If you prefer a different look for your headings, modify the existing style instead of manually reformatting. After changing the font, size, or color of a heading, re-open the Styles menu, hover over the heading level you want to change, and select "Update 'Heading' to match."
• We will be pushing out Grackle Workspace which is a program that will assist teachers and staff in the process of making sure their Google Doc, Google Slide presentation, or Google Spreadsheet is accessible. To learn more about Grackle Workspace view the video provided by Grackle or see the next tab. 

Alt-Text:

Alt-text provides concise, meaningful descriptions for all informative images.

Add alt-text to any image within a Google document:

1. Right-click the image and select Alt-text.
2. Leave the "Title" field blank, and enter the description in the "Description" field.

Examples of alt-text:

alt-text = Little Tigers Early Learning Center little tiger mascot logo

alt-text = Two children lean over a fence to pet a fluffy white animal.

Grackle is an add-on for Google products. It provides an automated way to check a digital file for ADA compliance.  Note, a software cannot find every error, so it's important to understand the requirements of compliance to ensure all steps are taken to make a document accessible.

You must have editing access in a Google file in order to run the compliance check. Grackle can be used in Google Docs, Google Slides, and Google Sheets.

Installing & Running Grackle

The first time you use Grackle, you will need to install the grackle extension. This needs to be done for EACH application (i.e. Google Docs, Slides and Sheets). This documentation pertains to Google Docs.

1. Open a Google Doc
2. Click Extensions - Add ons - Grackle
3. If Grackle is not listed as an Add on, choose Get Add ons, type Grackle in the search box and choose Grackle to install

If asked for permission to run this, choose OK, choose your work email, and sign in to grackle docs. Click continue. If asked to allow Grackle to access your Google Account, choose select all and click continue.

How To Check For Errors

1. Click Extensions - Grackle Docs - Launch
   The Grackle Docs window appears on the right. Grackle will automatically scan your document and group issues into categories: Document, Images, Headings, Tables, and Content. Errors are found in red. Common errors are headings, no alt-text, tables, etc.
2. Fix errors:
   • Red X: Must be fixed. Click the error, then click Locate. Grackle will highlight exactly where the problem is.
     Alt-Text: If an image is missing a description, click +TAG in the Grackle sidebar and type your 1-sentence description.
     Headings: Use the Google "Styles" menu (Heading 1, Heading 2). Grackle will warn you if you skip a level (e.g., going from H1 to H3).
3. Rerun and fix until there are no errors.
4. If you must download the file as a PDF:
   • Never use File - Download - PDF. This strips away all of the accessibility features.
   • Always click the Export to PDF button at the top of the Grackle sidebar. This "bakes" the accessibility tags into the final file.

A screen reader reads text boxes in the order they were created for Google Slides. Simply moving the boxes around doesn't change the reading order. 

Grackle Hack: In the Grackle Slides sidebar, click Document Structure. You can drag-and-drop the boxes in the sidebar to re-order them without moving them on the slide!

Smore is the newsletter tool our school building offices will use to share updates and information with families in connection with ParentSquare. Following our guidelines will help ensure that everyone has equal access to communication being sent home. 

Headers

• Building Newsletters: Please make a header that reflects the district colors and logos and meets accessibility requirements. Reach out to Nicole Whitfield at whitfieldn@versaillestigers.org if you would like one created for you. Please have the Communications Department review your header to ensure accessibility standards and branding/style guidelines are met (view district branding guidelines). 

Templates 

• Building newsletters: templates will be provided for building level use.

Colors

• Buildings newsletters: use colors that are consistent with our branding (gray, black, yellow gold, etc). Our exact branding colors are not available in Smore, which is why we are going to move toward using custom headers and wallpaper.

Color Contrast

Ensures that there is sufficient contrast between the text and background colors to enable those with low vision or color vision deficiencies to read content easily. There must be a 4.5:1 ratio between text and its background. Example: Yellow text on a blue background likely doesn’t meet this standard. Smore limits its color combinations to ensure contrast is met, but any graphics you include should adhere to this standard.

Wallpaper

Building newsletters must adhere to branding guidelines with district created wallpaper or you can create your own that fall within the district color scheme. If you’d like a custom wallpaper or header, reach out to Nicole Whitfield at whitfieldn@versaillestigers.org.

Graphics

• Do not share PDFs, and avoid linking to PDFs unless absolutely necessary. If you must link to a PDF, be sure to include a link to any translations needed for your school.
• Flyers that are saved in a graphic format (png, jpeg, etc.) should not be included in Smore, unless they are very limited in words.

How to share information from a flyer:

1. Create a simple graphic image in a square format (1080x1080 pixels) with an image from the flyer. See Canva branding info.
2. Take the text from the original flyer, and include it in a text box next to the image.
3. All graphics must have alt-text. Here are examples of alt-text.

How to add Alt Text:

1. Hover over the image where you would like to include the Alt Text, or click in the text box that contains the image.
2. Click Edit. The alt-text box will be located under the paragraph box.
3. Add the alt-text.
4. Click Done.

Guidelines for tables that are shared digitally:

• No merged cells — screen readers read left-to-right/top-to-bottom and merged cells break that order.
• No blank cells — every cell should contain meaningful data or a placeholder like “N/A.”
• Always include column headers and/or row headers so screen readers can announce context.
• Ensure headers are properly tagged (e.g., <th> in HTML or header row settings in Word/Docs).
• Provide descriptive table titles or captions to explain the purpose of the table.
• Don’t use tables for layout — use them only for true data.
• Use simple, consistent structure — avoid nested tables or complex layouts.

Use Acrobat Pro for PDFs you didn't create yourself (such as scanned forms or vendor flyers).

Automated Check Process

1. Open Tools: Go to the Tools tab and search for Accessibility. Add it to your right-hand shortcut bar.
2. Accessibility Check: Click Accessibility Check > Start Checking.
   Right-Click to Fix: In the results panel on the left, right-click any Failed item.
3. Select Fix. Acrobat can often automatically add titles or metadata for you.
4. Manual Check Process: Acrobat will always mark "Logical Reading Order" and "Color Contrast" as Needs Manual Check. It’s asking you, "Does this make sense to a human?" Review the document manually to see if it makes sense.

To fix a "Scanned Image" PDF in Adobe Acrobat Pro:

If you open a PDF and can't highlight the text with your mouse, it’s just a picture and is 100% non-compliant. It is most likely created by scanning a document or printing to a PDF from within an application. 

In the Accessibility toolset, select Scan & OCR > Recognize Text. This turns the "picture" into actual text that a screen reader can read. You will then need to go through the automated check to verify compliance.