Publications typically have a primary narrative that readers are expected to follow from beginning to end, and being able to navigate this dialogue uninterrupted is a key factor in making publications accessible.
There is sometimes no distinction between the narrative and its representation in the markup. A novel, for example, might consist only of sections, headings and paragraphs which are all marked up in order and can be read in order. These cases tend not to be the norm, however, as most publications will have some degree of complexity to their layout.
More often, publications will include at least some supplementary information, such as footnotes, endnotes, references, sidebars, tables, figures, charts, code samples, warnings, alerts and similar. As this information is interspersed within the content of the body, its markup must inevitably also be interspersed within a content document (e.g., a sidebar may be placed between two paragraphs within a section and the text visually floated around it). If this content is not clearly marked and identifiable as secondary information, readers navigating at the markup level will have the primary narrative interrupted as the reading system attempts to play back the auxiliary content.
This problem was particularly acute prior to HTML5, as generic div tags we used to group
secondary material, which left no way to reliably distinguish its purpose. The result was that readers
manually had to try and determine where the content ended in order to continue reading.
To be accessible to non-visual readers, content must be marked up such that a logical path that excludes the secondary material and orders the primary can be followed: the logical reading order. Rich markup allows secondary materials to be automatically excluded from text-to-speech playback or refreshable braille rendering if the user doesn't want their reading experience interrupted.
To establish the logical reading order, you need to ensure all of the following:
section and aside elements have been appropriately applied to groupings
of primary and secondary content, respectively;Although creating the logical reading order is not a complicated requirement, it typically requires manual inspection of your markup. The determination of which content is primary to the narrative flow and which secondary can only be reliably determined by a human, so a successful validation report from a tool like epubcheck, while helpful, is only a good start.
The narrative flow in the following textbook excerpt is obvious to sighted readers who can distinguish the images and sidebar it flows around from visual cues.
The logical reading order would be established using figure tags to offset the images and an
aside for the sidebar, as in the following markup:
<div epub:type="pagebreak">43</div>
<figure>
<img src="img01.jpg" alt="…"/>
<figcaption>
Figure 2.2: Neurons transmit information to
other neurons. Information passes from the
axon of the presynaptic neuron to the
dendrites of the postsynaptic neuron.
</figcaption>
</figure>
<p>
The site where a presynaptic terminal ends in
close proximity to a receiving dendrite is
called the
<dfn epub:type="keyword">synapse</dfn>.
The cell that sends out information is called the
<dfn epub:type="keyword">presynaptic</dfn>
neuron, and the cell that receives the
information is called the
<dfn epub:type="keyword">postsynaptic</dfn>
neuron. It is important to note that the synapse
is not a physical connection between the two
neurons; there is no cytoplasmic continuity
between the two neurons. The intercellular space
between the presynaptic and postsynaptic neurons
is called the <dfn epub:type="keyword">synaptic
space</dfn> or <dfn epub:type="keyword">synaptic
cleft</dfn>. An average neuron forms
approximately 1,000 synapses with other neurons.
It has been estimated that there are more
synapses in the human brain than there are stars
in our galaxy. Furthermore, synaptic connections
are not static. Neurons form new synapses or
strengthen synaptic connections in response to
life experiences. This dynamic change in neuronal
connections is the basis of learning.
</p>
<figure>
<img src="img02.png" alt="…"/>
<figcaption>
Figure 2.3: The synapse is the site where
chemical signals pass between neurons.
Neurotransmitters are released from the
presynaptic neuron terminals into the
extracellular space, the synaptic cleft or
synaptic space. The released neurotransmitter
molecules can then bind to specific receptors
on the postsynaptic neuron to elicit a
response. Excess neurotransmitter can then be
reabsorbed into the presynaptic neuron through
the action of specific reuptake molecules
called transporters. This process ensures that
the signal is terminated when appropriate.
</figcaption>
</figure>
<div epub:type="pagebreak">44</div>
<p>
The brain contains another class of cells called
glia. There are as many as 10 to 50 times more
glial cells than neurons in the central nervous
system. Glial cells are categorized as microglia
or macroglia. Microglia are phagocytic cells that
are mobilized after injury, infection, or
disease. They are derived from macrophages and
are unrelated to other cell types in the nervous
system. The three types of macroglia are
oligodendrocytes, astrocytes, and Schwann cells.
The oligodendrocytes and Schwann cells form the
myelin sheaths that insulate axons and enhance
conduction of electrical signals along the axons.
</p>
<p>
Scientists know less about the functions of glial
cells than they do about the functions of
neurons. Glial cells fulfill a variety of
functions including as
</p>
<ul>
<li>
support elements in the nervous system,
providing structure and separating and
insulating groups of neurons;
</li>
<li>
oligodendrocytes in the central nervous
system and Schwann cells in the peripheral
nervous system, which form myelin, the sheath
that wraps around certain axons;
</li>
<li>
scavengers that remove debris after injury
or neuronal death;
</li>
<li>
helpers in regulating the potassium ion
(K+) concentration in the
extracellular space and taking up and
removing chemical neurotransmitters from
the extracellular space after synaptic
transmission;
</li>
<li>
guides for the migration of neurons and for
the outgrowth of axons during development; and
</li>
<li>
inducers of the formation of impermeable tight
junctions in endothelial cells that line the
capillaries and venules of the brain to form
the blood-brain barrier.<a epub:type="noteref"
href="#fn03">3</a>
</li>
</ul>
<aside epub:type="sidebar">
<h3>The Blood-Brain Barrier</h3>
<p>
The blood-brain barrier protects the neurons
and glial cells in the brain from substances
that could harm them. Endothelial cells that
form the capillaries and venules make this
barrier, forming impermeable tight junctions.
</p>
<p>
Astrocytes surround the endothelial cells
and induce them to form these junctions.
Unlike blood vessels in other parts of the
body that are relatively leaky to a variety
of molecules, the blood-brain barrier keeps
many substances, including toxins, away from
the neurons and glia.
</p>
<p>
Most drugs do not get into the brain. Only
drugs that are fat soluble can penetrate the
blood-brain barrier. These include drugs of
abuse as well as drugs that treat mental
and neurological illness. The blood-brain
barrier is important for maintaining the
environment of neurons in the brain, but it
also presents challenges for scientists who
are investigating new treatments for brain
disorders. If a medication cannot get into
the brain, it cannot be effective.
Researchers attempt to circumvent the
problems in different ways. Some techniques
alter the structure of the drug to make it
more lipid soluble. Other strategies attach
potential therapeutic agents to molecules
that pass through the blood-brain barrier,
while others attempt to open the blood-brain
barrier.<a epub:type="noteref"
href="#fn04">4</a>
</p>
</aside>
epub:type attributeConsider how someone reading using a text-to-speech engine interacts with your publication. They are navigating at the markup level, moving from structure to structure and hearing the prose rendered at each step. That's fine, but now picture having no information about the structure you've just reached. Are you going to the next paragraph, or is a footnote suddenly going to be read back? Did the last section end or did you just jump into a sidebar?
Without structure and semantics, there's no way to easily move from one structure to the next. Where
does the sidebar marked as a div end and the next paragraph continue? These questions left
to the reader to puzzle out, leaving them manually navigating the publication to fit together the
elusive reading order from the generic markup. It's also why semantically meaningless markup ruins the
reading experience, if not makes it downright impossible.
Accessible reading systems typically provide the option for readers to select elements to ignore. Semantic markup eases this process of identifying and skipping non-essential content. A reader may still choose to render secondary content as it occurs, but it becomes their choice again, and no longer a burden to navigate through or around as desired.