Digital Publishing WAI-ARIA Module 1.1

A short summary of the principal ideas, concepts, and conclusions of the work, or of a section or excerpt within it.

<section role="doc-abstract" aria-label="Abstract">
   <p>Accessibility of web content requires semantic information about widgets, structures,
      and behaviors …</p>
</section>

A section or statement that acknowledges significant contributions by persons, organizations, governments, and other entities to the realization of the work.

<section role="doc-acknowledgments">
   <p>I would like to extend my sincere gratitude to … </p>
</section>

A closing statement from the author or a person of importance, typically providing insight into how the content came to be written, its significance, or related events that have transpired since its timeline.

<section role="doc-afterword">
   <h2>Afterword: Why I Wrote This Book</h2>
   …
</section>

A section of supplemental information located after the primary content that informs the content but is not central to it.

<section role="doc-appendix">
   <h2>Appendix A. Historical Timeline</h2>
   …
</section>

A link that allows the user to return to a related location in the content (e.g., from a footnote to its reference or from a glossary definition to where a term is used).

<aside id="fn01" role="doc-footnote">
   <a role="doc-backlink" href="#fnref01">1.</a>
   Additional results of this study and
   similar studies can be found at …
</aside>

[Deprecated in DPUB-ARIA 1.1] A single reference to an external source in a bibliography. A biblioentry typically provides more detailed information than its reference(s) in the content (e.g., full title, author(s), publisher, publication date, etc.).

A list of external references cited in the work, which may be to print or digital sources.

<section role="doc-bibliography">
   <h2>Select Bibliography</h2>
   <ul>
      …
   </ul>
</section>

A reference to a bibliography entry.

<p>
   As <a role="doc-biblioref"
      href="#b8cab5dd-bc24-459c-9858-7afa9da69b64">Steinbeck</a>
   says in his great novel …
</p>

A major thematic section of content in a work.

<section role="doc-chapter">
   <h2>Chapter 1. Loomings.</h2>
   …
</section>

A short section of production notes particular to the edition (e.g., describing the typeface used), often located at the end of a work.

<section role="doc-colophon" aria-label="About the type">
   <p>This publication was set using … </p>
</section>

A concluding section or statement that summarizes the work or wraps up the narrative.

<section role="doc-conclusion">
   <h2>Summary</h2>
   <p>A central task in feminist scholarship is to expose and dismantle the stereotypes … </p>
</section>

An image that sets the mood or tone for the work and typically includes the title and author.

<img role="doc-cover" src="coverimage.jpg" alt="A Room of One's Own by Virginia Woolf"/>

An acknowledgment of the source of integrated content from third-party sources, such as photos. Typically identifies the creator, copyright, and any restrictions on reuse.

<p role="doc-credit">
   Page 62, Table 3.1 from <cite>“Economic Foundations of Cost-Effectiveness Analysis”</cite>
   by A. M. Garber and C. E. Phelps …
</p>

A collection of credits.

<section role="doc-credits">
   <h2>Photo Credits</h2>
   …
</section>

An inscription at the front of the work, typically addressed in tribute to one or more persons close to the author.

<p role="doc-dedication">To my family, without whom this would have never been possible.</p>

[Deprecated in DPUB-ARIA 1.1] One of a collection of notes that occur at the end of a work, or a section within it, that provides additional context to a referenced passage of text.

A collection of notes at the end of a work or a section within it.

Note that the doc-endnotes role is never applied directly to the list of endnotes.

<section role="doc-endnotes">
   <h2>Notes</h2>
   <ol>
      <li id="6baa07af">
         <p role="doc-footnote">Additional results of this study can be found at … </p>
      </li>
      <li id="7b2c0555">
         <p role="doc-footnote">…</p>
      </li>
      …
   </ol>
</section>

A quotation set at the start of the work or a section that establishes the theme or sets the mood.

<blockquote role="doc-epigraph">
   <p>“Would you tell me please, which way I ought to go from here?”</p>
   <p>“That depends a good deal on where you want to get to,” said the cat.</p>
</blockquote>

A concluding section of narrative that wraps up or comments on the actions and events of the work, typically from a future perspective.

<section role="doc-epilogue">
   <header>
      <h2>Epilogue</h2>
      <p>SPOKEN BY PROSPERO</p>
   </header>
   <p>Now my charms are all o'erthrown, …</p>
   …
</section>

A set of corrections discovered after initial publication of the work, sometimes referred to as corrigenda.

<section role="doc-errata">
   <h2>Corrections</h2>
   …
</section>

An illustration of a key concept of the work, such as a code listing, case study or problem.

<figure role="doc-example">
   <figcaption>Example 1 — Hello World!</figcaption>
   …
</figure>

Ancillary information, such as a citation or commentary, that provides additional context to a referenced passage of text.

The doc-footnote role is only for representing individual notes that occur within the body of a work. For collections of notes that occur at the end of a section, see doc-endnotes.

<aside id="6baa07af" role="doc-footnote">
   * Additional results of this study and similar studies can be found at …
</aside>

An introductory section that precedes the work, typically not written by the author of the work.

<section role="doc-foreword">
   <h2>Foreword</h2>
   …
</section>

A brief dictionary of new, uncommon, or specialized terms used in the content.

The structure of a glossary SHOULD make it possible for end users to identify each term and associated definition (e.g., using the [HTML] dl or dfn elements).

<section role="doc-glossary" aria-label="glossary">
   <dl>
      …
      <dt id="bcc0f155">Credit default swap</dt>
      <dd>
         A credit default swap effectively insures against
         default by a borrower.
      </dd>
      …
   </dl>
</section>

<section role="doc-glossary" aria-labelledby="glosshd">
   <h2 id="glosshd">Glossay of Technical Terms</h2>
   <ul>
      <li id="gtt00110001"><dfn>algorithm</dfn> A set of rules …</li>
      …
   </ul>
</section>

A reference to a glossary definition.

<p>
   This is indicated in the cost of a
   <a href="#bcc0f155" role="doc-glossref">credit default swap</a> …
</p>

A navigational aid that provides a detailed list of links to key subjects, names and other important topics covered in the work.

<section role="doc-index">
   <h2>Index</h2>
   <section>
      <h2>A</h2>
      <ul>
         <li>A/B testing, <a href="chapter03.xhtml#page230">230</a></li>
         …
      </ul>
   </section>
   …
</section>

A preliminary section that typically introduces the scope or nature of the work.

<section role="doc-introduction">
   <p>Everyone has some experience with marketing … </p>
</section>

A reference to a footnote or endnote, typically appearing as a superscripted number or symbol in the main body of text.

<p> … as studies have shown.<a href="#fn01" id="fnref01" role="doc-noteref">[1]</a></p>

Notifies the user of consequences that might arise from an action or event. Examples include warnings, cautions and dangers.

<section role="doc-notice">
   <img src="warning.png" alt="warning icon"/>
   <p>Just because you can include a font doesn’t mean you should.
      Think carefully about readability. Also, be respectful of intellectual property.
      There are many excellent free open-source fonts available.</p>
</section>

A separator denoting the position before which a break occurs between two contiguous pages in a statically paginated version of the content.

Page break locators are also commonly used to provide static markers in purely digital publications (i.e., where no statically paginated equivalent exists). These markers provide consistent navigation regardless of differences in font and screen size that can otherwise affect the dynamic pagination of the content.

Authors MUST ensure the name of the page break is an end user-consumable page number that identifies the page that is beginning so that assistive technologies can announce the page as needed (e.g., in a command to identify the current page).

A navigational aid that provides a list of links to the page breaks in the content.

<nav role="doc-pagelist">
   <h2>Pages</h2>
   <ol>
      <li><a href="chapter.xhtml#Page_1">1</a></li>
      <li><a href="chapter.xhtml#Page_2">2</a></li>
      …
   </ol>
</nav>

A section of text appearing at the bottom of a page that provides context about the current work and location within it. The page footer is distinct from the body text and normally follows a repeating template that contains (possibly truncated) items such as the document title, current section, author name(s), and page number.

The doc-pagefooter role MUST be used on every instance of the page footer.

The doc-pagefooter MUST NOT contain the doc-pagebreak.

The doc-pagefooter MUST NOT contain footnotes (doc-footnote).

Assistive technologies MAY allow the user to read the document content continuously without interruption from the page footer.

<section role="doc-pagefooter">
   <div>Leo Tolstoy</div>
   <div>321</div>
   …
</section>

A section of text appearing at the top of a page that provides context about the current work and location within it. The page header is distinct from the body text and normally follows a repeating template that contains (possibly truncated) items such as the document title, current section, author name(s), and page number.

The doc-pageheader role MUST be used on every instance of the page header.

The doc-pageheader MUST NOT contain the doc-pagebreak.

Assistive technologies MAY allow the user to read the document content continuously without interruption from the page header.

<section role="doc-pageheader">
   <div>War and Peace</div>
   <div>321</div>
   …
</section>

A major structural division in a work that contains a set of related sections dealing with a particular subject, narrative arc, or similar encapsulated theme.

<section role="doc-part">
   <h2>Part One</h2>
   <section role="doc-chapter">
      <h2>Chapter 1</h2>
      …
   </section>
   …
</section>

An introductory section that precedes the work, typically written by the author of the work.

<section role="doc-preface">
   <h2>Introduction:A Guide to the Galaxy</h2>
   …
</section>

An introductory section that sets the background to a work, typically part of the narrative.

<section role="doc-prologue">
   <header>
      <h2>Prologue</h2>
      <p>Chorus</p>
   </header>
   <p>Two households, both alike in dignity, …</p>
   …
</section>

A distinctively placed or highlighted quotation from the current content designed to draw attention to a topic or highlight a key point.

Unlike a passage quoted from another source, a pullquote is a direct repetition of text in the current document. As a result, authors must ensure that the presentational occurrence is hidden from users of assistive technologies (e.g., using the aria-hidden attribute).

The following example shows the identification of a pullquote that will be presented elsewhere (e.g., via a script). In this case, the pullquote is not hidden as the marked text is not presentational.

<p>… I may die, but first you, my tyrant and tormentor, shall curse the sun that gazes on your misery.
   <span id="pq01" role="doc-pullquote">Beware, for I am fearless and therefore powerful.</span>
   I will watch with the wiliness of a snake, that I may sting with its venom. … </p>

The next example shows a pullquote that duplicates the text. This quote is hidden because it is for presentational purposes only.

<p>… Better habits pave the way to growth, and growth leads to greater happiness.</p>
<aside role="doc-pullquote" aria-hidden="true">
   Better habits pave the way to growth, and growth leads to greater happiness.
</aside>

A section of content structured as a series of questions and answers, such as an interview or list of frequently asked questions.

<section role="doc-qna">
   <h2>Interview with the Author</h2>
   <dl>
      <dt>Q: When did you begin writing this book?</dt>
      <dd>A: I first got the idea …</dd>
      …
   </dl>
</section>

An explanatory or alternate title for the work, or a section or component within it.

<header>
   <h2>Chapter 2 The Battle</h2>
   <p role="doc-subtitle">Once more unto the breach</p>
</header>

Helpful information that clarifies some aspect of the content or assists in its comprehension.

<aside role="doc-tip">
   <h3>Tip</h3>
   <p>You can assign a variable a new value that is the result
      of an expression involving its previous value.</p>
</aside>

A navigational aid that provides an ordered list of links to the major sectional headings in the content. A table of contents may cover an entire work, or only a smaller section of it.

<nav role="doc-toc">
   <h2>Contents</h2>
   <ol role="directory">
      <li><a href="preface_001.xhtml">Original Transcriber’s Notes:</a></li>
      <li><a href="introduction_001.xhtml">ETYMOLOGY.</a></li>
      <li><a href="epigraph_001.xhtml">EXTRACTS (Supplied by a Sub-Sub-Librarian).</a></li>
      <li><a href="chapter_001.xhtml">Chapter 1. Loomings.</a></li>
      …
   </ol>
</nav>