Watch your figure

Okay, here’s another thought experiment from a recent discussion I had.

First, the culprit: figure

Second, the scenario: if you’re trying to delineate the logical reading order in your EPUB, what does this element signify?

The simple answer is that it represents a figure, but that tends to be about as unhelpful as the EPUB Structural Semantics vocabulary defining marginalia as marginalia! (Note: that def should be up for review in the next revision, as different people have different takes on whether marginalia is a kind of note/annotation or just some generic content in the margin.)

Here’s how HTML5 defines figure:

The figure element represents a unit of content, optionally with a caption, that is self-contained, that is typically referenced as a single unit from the main flow of the document, and that can be moved away from the main flow of the document without affecting the document’s meaning.

This definition seems pretty straight-forward, right? Use a figure for those images, tables, charts and other referenced figure content that the text possibly flows around (whether you literally float the figure or display it between paragraphs is a formatting decision with no significant bearing on the accessibility).

But, as everyone who tries to mark up content as HTML knows, you always have to be somewhat liberal in your interpretations since the specification does not outline every possible use case. The specification definitions are also not normative.

And this is where the crux is. If a figure tag also encapsulates descriptions, summaries and other related content of the figure, why wouldn’t it also be useful for grouping that content with any image, table, chart, etc. that is part of the logical reading order?

At least, that’s the question I’ve bumped into.

Let me try to rationalize why using the element as a generic grouping tool is a bad thing.

First, for EPUB accessibility purposes, we’ve been trying to focus people on reserving figure as a marker of secondary content, as defined in the HTML5 specification, as there’s the very real benefit to users of assistive technologies in quickly and easily being able to determine primary from secondary content. Put simply, consistent use of this tag will allow reading systems to present readers the option to decide when they want to skip all figures by default or manually skip them as encountered.

But a counterargument runs: why not then put the figure into an aside to mark it as secondary when it’s not part of the logical reading order, like this:

<aside>
   <figure>
      <img src="bananas.jpg">
      <figcaption>...</figcaption>
   </figure>
</aside>

But to me this is nothing more than markup overkill. You now have two tags to express what figure alone was conceived for.

It also begs the question, what kind of aside is this? Do we now also need an epub:type attribute to express that this is just a figure to avoid having to enter it to discover its nature?

But what really rubs me the wrong way is that figures, pretty much by nature, are secondary content, so why add extra tagging to delineate the common usage?

More to the point, can you validly argue that a table or image or chart that is deliberately placed in the logical reading order is not just a table, image or chart but actually a figure just because there is some other content associated with it? (Again, I’m not talking about layout of real figures, where the text might be broken above and continue below the figure.)

The use of figure simply to group content is wrong from every perspective I can see. So very, very wrong.

Generic grouping in the logical reading order, when necessary, can be done with a div.

(I never thought I’d write that.)

But seriously, keep figure for figures.

Leave a Reply

Your email address will not be published. Required fields are marked *