How to fix the error "Iframe must have accessible name"

Overview: Screen Recording 2022-09-26 at 03.31.53 PM


Key Takeaways:
All IFrames should have a title attribute with text that describes the content of the frame

What to check:

  • Does the page contain any Iframes

  • Does each Iframe have a title attribute 

  • Does the title attribute describe the functionality or content of the Iframe 

<!-- ? Incorrect, does not contain title 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 title with a detailed description fo the content-->
<iframe
        title="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>
Was this article helpful?
0 out of 0 found this helpful

Comments

0 comments

Please sign in to leave a comment.