From the course: Simplifying Web Development with Accessibility Best Practices

Unlock this course with a free trial

Join today to access over 25,300 courses taught by industry experts.

The figure and figcaption elements

The figure and figcaption elements

- [Instructor] In many cases, you'll have one or more images that include a caption describing or otherwise contextualizing the visuals. For this scenario, we have two dedicated elements: figure and figcaption. The figure element wraps around one or more image elements and can contain an optional figcaption element. In screen readers, it's declared as a figure followed by whatever images and captions it contains. The purpose of the figure and figcaption elements is to associate the caption with the images, otherwise it would be an image and then a separate text block and there's no clear connection between them. But using figure and figcaption, there is a clear connection because they belong together as a whole. The figcaption can contain any other HTML element including links, headings, and so on. This means if you have an image and some associated texts and you want them to be wrapped inside a container, the best option…

Contents