You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
[Programmatic Access - Make code for micro bit - Feedback]: Alternate text is not defined for the image present inside the “Usabilla Feedback button”
#4938
Closed
Chandangithb opened this issue
Aug 29, 2022
· 5 comments
Visually impaired users who depend on screen reader and navigate in scan mode will not be able to understand the information provided or purpose of the image properly and might get confused.
Note: User credentials should NOT be included in the bug.
Navigate to the "Feedback" button and run an accessibility insights tool.
Observe and verify the issue.
Actual Result:
Issue: Alternate text is not defined for the image present inside the “Usabilla Feedback button” as a result when focus moves to the image in scan mode (Narrator) announces as “To get the missing image description open context menu unlabeled graphic”.
Expected Result:
Solution: Alternate text should be defined for the image present inside the “Usabilla Feedback button” as “Feedback logo”.
Fix any of the following:
Element does not have an alt attribute.
aria-label attribute does not exist or is empty.
aria-labelled by attribute does not exist, references elements that do not exist or references elements that are empty.
Element has no title attribute.
Element's default semantics were not overridden with role="none" or role="presentation".
Environment:
Microsoft Edge version 105.0.1300.0
This accessibility issue was found using Accessibility Insights for Web 2.32.0 (axe-core 4.4.1), a tool that helps find and fix accessibility issues. Get more information & download this tool at .
Accessibility Insights! - Identify accessibility bugs before check-in and make bug fixing faster and easier.
External Bug Process: If this bug belongs to external team, mark it as resolved/done and assign it back to the tester with notes on where to file/route the bug. For more information, please use this External Bug Process (sharepoint.com). “HCL Staff should not log any third-party external bugs. Should be routed to EDAD team”.
Hi @Chandangithb! Thank you for your feedback and helping MakeCode improve. I have been working on improving the alt-text experience for this landing page, but unfortunately, the Usabilla Feedback button's image is something that we cannot touch. We have been in contact with the Usabilla team, and updating their image tag is not something they can do right now. Our current version of the site has an aria label on the container that the button is in. It sounds like the screen reader was able to read off this aria label and hopefully gives enough context for what the button is used for. I apologize for the inconvenience of not providing a better description of the image for the feedback button.
User Experience:
Visually impaired users who depend on screen reader and navigate in scan mode will not be able to understand the information provided or purpose of the image properly and might get confused.
Note: User credentials should NOT be included in the bug.
Repro Steps:
Actual Result:
Issue: Alternate text is not defined for the image present inside the “Usabilla Feedback button” as a result when focus moves to the image in scan mode (Narrator) announces as “To get the missing image description open context menu unlabeled graphic”.
Expected Result:
Solution: Alternate text should be defined for the image present inside the “Usabilla Feedback button” as “Feedback logo”.
Issue:
Ensures
elements have alternate text or a role of none or presentation (image-alt - (https://accessibilityinsights.io/info-examples/web/image-alt))
Target application:
MakeCode Skill Map - https://arcade.makecode.com/--skillmap#docs:/skillmap/racer
Element path:
#usabilla_live_button_container_iframe898772216;img
Snippet:
<img src="//d6tizftlrpuof.cloudfront.net/live/resources/buttons/usabilla_orange_rightSideFeedback.png" width="39" height="130">
How to fix:
Fix any of the following:
Element does not have an alt attribute.
aria-label attribute does not exist or is empty.
aria-labelled by attribute does not exist, references elements that do not exist or references elements that are empty.
Element has no title attribute.
Element's default semantics were not overridden with role="none" or role="presentation".
Environment:
Microsoft Edge version 105.0.1300.0
This accessibility issue was found using Accessibility Insights for Web 2.32.0 (axe-core 4.4.1), a tool that helps find and fix accessibility issues. Get more information & download this tool at .
MAS Reference:
Reference Links:
Test Environment:
MAS1.1.1-Alternate.text.is.not.defined.for.the.image.present.inside.the.Usabilla.Feedback.button.mp4
The text was updated successfully, but these errors were encountered: