Note
Following W3C's Alternative Text Decision Tree, as the image text and content description may exceede 120 characters then this exceedes the capacity of a usable alternative text attribute.
The <figure>
element and it's native <figcaption>
child element group the image and it's content description semantically.
A caution is that WCAG directs that when a figure is removed from a document, the document's meaning is not degraded. Clearly that conflicts with the intention of this image type and its accessible content. There are alternatives including DIV and SPAN soup, or the <section>
and, or <article>
landmarks. In this use case, the semantic connection between the <figure>
and its <figcaption>
is strong and reliable when conveyed in a browser when CSS and, or JS are not available. It is the strategy of choice.
Video
HTML
<figure> <img src="../img/dieux-by-pat-godfrey-deadline.png" alt="Cartoon Strip" > <figcaption> <p>[Assistant] The Director wants your plan for the information architecture. <br> [Our Designer] Says nothing. <br> [Assistant] I'll tell him you are at lunch.</p> </figcaption> </figure>