Overview: Screen Recording 2022-09-26 at 03.31.53 PM
Key Takeaways:
All IFrames should have an aria-label attribute, with text that describes the content of the frame
What to check:
Does the page contain any Iframes
Does each Iframe have an aria-label attribute
Does the aria-label attribute describe the functionality or content of the Iframe
<!-- ? Incorrect, does not contain aria-label attribute -->
<iframe
width="853"
height="480"
src="https://www.youtube.com/embed/CD-2cOqhUJI"
frameborder="0"
allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture"
allowfullscreen>
</iframe>
<!-- ✅ Correct implementation contains aria-label with a detailed description fo the content-->
<iframe
aria-label="YouTube video describing the TruWest Card manager app"
width="853"
height="480"
src="https://www.youtube.com/embed/CD-2cOqhUJI"
frameborder="0"
allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture"
allowfullscreen>
</iframe>
Comments
Please sign in to leave a comment.