-
Notifications
You must be signed in to change notification settings - Fork 70
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[SPIKE] Opportunities for Improving Alt Text Training within CMS Alt Text Field #17452
Comments
Interesting Sentry notification from today where the editor is pulling alt text from a caption of the image from another site (Stars and Stripes) to create their alt text instead of using the alt text the site used. Stars and Stripes has the alt text for the image set as "Marine Lance Cpl. Nathanial Fink (left) and Lance Cpl. Garrett Camacho dispose of trash in a burn pit in 2012 in Afghanistan." and has a caption below it that reads "Marine Lance Cpl. Nathanial Fink (left) and Lance Cpl. Garrett Camacho dispose of trash in a burn pit in 2012 in Afghanistan. (Alfred Lopez/U.S. Marine Corps)" which is the alt text that was originally submitted for the image on the VA website. This screenshot shows the alt-text that finally got through without error on the VA site. This screenshot shows the image and caption that is on the Stars and Stripes article. |
Editors are putting graphical images with text and then not describing what they actually have in them. An editor posted this news story with this road construction plan which had the alt text of "McLeland Rd access onto main campus" which does not describe the context of the image. The article reads "Great news! The long-desired west roads improvement project starts April 8, 2024 weather permitting. This project will take several months. Everyone is asked to understand the plan and that detours and some alternate parking plans will be required. During Phase 1 in April and May, 2024 the inner roadways behind Bldg. 48, 49 and 50, and the east-west road from the 4-way stop to just in front of Bldg. 116 will be closed. Veterans accessing Bldg. 116 will need to enter campus via McLeland Rd. As a reminder, Bldg. 116 may only be entered from the south door. All parking lots will be available but may use temporary access points." Had the article explained more of the graphic's content this could be enough alt text, but as it currently stands, visual users are getting more from the image than screen reader users can. |
Editors aren't understanding what a screen reader user will hear with the alt-text. The sentry notification showed the editor tried putting in the information that is shown under the description of the event as the alt-text:
The editor finally submitted the alt-text to be a repeat of the title and the teaser. This will make the screen reader users hear "VA Coffee With Campers" 3 times in a row, which is over redundant. It would have been better to have something like "Flyer for the VA Coffee with Campers event". This alt-text is appropriate because all of the text information found in the image is found below, thus the image is decorative. |
Related, it seems that editors aren't understanding how their image will be represented on the event pages. Sighted users aren't understanding about events either that screen reader users may have better understanding. The Wheels and Warriors event at the West Palm Beach VA is a perfect example. The image has alt text that explains the event details shown on the image (Rev up your engines and show off your wheels! |
Some editors are using |
I wonder if we should just make all staff images used on the leadership and biography pages decorative (i.e. ideally use Thoughts from the rest of the accessibility specialists:
|
Some editors are using |
Some editors are just taking off the file extension so they don't trigger the |
Move forward into sprint 22. |
There exists a js library called Tippy.js that already exists inside of our instance of Drupal. This is what the sitewide team is using for the tooltips that they have in the Vet center pages. The tooltips are causing accessibility errors though as they populate the The sitewide team is also using links to the KB directly in the text on the edit screen in the section |
Some editors are also just saying image without saying of. We could put in place a warning to make sure they aren't saying image because of it being redundant for screen readers. We could do this for all versions of "image", "photo", "graphic", "picture", etc. There are instances where using those words would still make sense in alt-text like, as an example, if someone is showing a picture to someone else or is posing with a photo. I do wonder if we should roll back the error on "image(etc.) of" since it's not really making a difference. If we changed it to a warning instead of an error, we may be able to do a better job at explaining the meaning of when they shouldn't be using those words. We could also potentially add a link to an explanation in the KB in the warning. |
Something we could potentially do is have a check against the file name of the image and the alt-text submitted, and if the filename and alt-text are the same, except the file extension, we could put an error up. We could also potentially do a warning state if the two are very similar. |
Something I have noticed in looking through the alt-text, is that there is the same or similar alt-text for very different images. I wonder if we could use this along with checking the name of the image to check if the user wants to replace an old image or upload a new one. This may prompt them to write different alt-text if it's a different image or to catch that the image they need already exists. |
The link, |
The description under the Something like The previous team had found in their research that editors didn't know how to balance descriptiveness and brevity under point 1 of Details of Findings that this can also help with. |
We should stop editors from being able to add in line breaks because:
|
We should add a best practice bullet for images with text. Something like: |
User Story or Problem Statement
As the accessibility lead, I need to gain a better understanding on what the current state of the alt text field in the CMS.
Steps for Implementation
Acceptance Criteria
Team
Please check the team(s) that will do this work.
The text was updated successfully, but these errors were encountered: