Accessible Publishing Knowledge Base

Lists

Summary

...

Techniques

In order to facilitate the navigation of lists, Media Overlay documents must be marked up so that lists are discoverable — and consequently escapable and skippable — by the user without having to drop out of playback mode.

Although the basic markup for lists in overlays is the same regardless of list type, HTML5 includes two different types of lists that need to be accommodated.

Ordered and Unordered Lists

The HTML ol and ul list elements each represent sets of items, and are marked up similarly as follows:

Definition Lists

HTML definition lists (the dl element) associate one or more names (dt elements) with one or more values (dd elements). When constructing these lists in an overlay document, the following markup rules should be followed:

Examples

Example 1 — Comparison of ordered and unordered lists
<ul>
   <li>…</li>
   <li>
	  <p>…</p>
	  <p>…</p>
   <li>
   <li>
	  <ol>
		 <li>…</li>
	  </ol>
   <li>
</ul>
<seq epub:type="list">
   <par epub:type="list-item">…</par>
   <seq epub:type="list-item">
	  <par>…</par>
	  <par>…</par>
   </seq>
   <seq epub:type="list-item">
	  <seq epub:type="list">
		 <par epub:type="list-item">…</par>
	  </seq>
   </seq>
</seq>
Example 2 — Comparison of definition lists
<dl>
   <dt>…</dt>
   <dd>…</dd>
   
   <dt>…</dt>
   <dt>…</dt>
   <dd>…</dd>
   <dd>
	  <p>…</p>
	  <p>…</p>
   <dd>
</dl>
<seq epub:type="list">
   <seq epub:type="list-item">
	  <par>…</par>
	  <par>…</par>
   </seq>
   <seq epub:type="list-item">
	  <par>…</par>
	  <par>…</par>
	  <par>…</par>
	  <par>…</par>
	  <par>…</par>
   </seq>
</seq>

References