Location: My Courses Dashboard e.g. https://courses.edx.org/dashboard
Description: The images next to the courses are image links with alternative texts. However, aria-hidden="true" is added in the parent div container. When tabbing on the image links, screen readers guess at the name, role of the element since the aria-hidden is hiding all the information from assistive technologies. Actionable elements that receive focus must not have aria-hidden attribute assigned.
Auditor Note: Since the image link performs the same action as the course link, it is suggested to not have a repetitive image link. Therefore, developers must remove the anchor element from the image. In this case, the aria-hidden attribute will hide the image from assistive technologies and the image will no longer be in the tab order.
Internal Note: This one is easy to fix. Simply add a tabindex="-1" to the link that wraps the image. This will prevent it from showing up in the taborder for both screen reader and keyboard users. Thanks for discovering this neat trick .