-
Notifications
You must be signed in to change notification settings - Fork 29
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
Image a11y sign off updates #351
base: main
Are you sure you want to change the base?
Conversation
|
🟢 No design token changes found |
|
@@ -66,7 +78,7 @@ export const CustomClassWithAspectRatio: StoryFn<typeof Image> = () => ( | |||
<Image | |||
src={placeholderImage} | |||
className={style['custom-image']} | |||
alt="placeholder, blank area with an off-white background color" | |||
alt="placeholder, blank area with an off-white background color, custom aspect ratio" |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Based on the feedback you received, we still issue with the stories with custom red outlines:
(sev 3) Within the Custom Class with Aspect Ratio and the Custom Class on Picture examples, the alt attribute has the same placeholder value of "placeholder, blank area with an off-white background color" although a red frame outlines the image.
although a red frame outlines the image.
Can we update the alt text to indicate there's a red outline here please?
Also FYI that the height and width attributes here are still 100%
.
This likely needs a code change under-the-hood for this component. How much effort is that?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I discussed the 100% height and width with the a11y eng team and that is ok to keep in there for functionality. I will add the red outline to the description.
Summary
Updating the alt tags for the feature stories on Storybook to go above and beyond and be slightly more specific.
List of notable changes:
Supporting resources (related issues, external links, etc):
Contributor checklist:
Reviewer checklist: