This presentation was provided by Tzviya Siegman of Wiley, during the NISO hot topic virtual conference "Accessibility." The event was held on March 29, 2023.

1. ENABLING DISCOVERY | POWERING EDUCATION | SHAPING WORKFORCES
Tzviya Siegman | Wiley
NISO Virtual Conference| March 2023
Practicalities of Accessibility

2. Wiley Blue 2021-10.potx
2
What we’ll cover
• Accessibility and Inclusive Design
• Inclusive Design Principles
• Accessibility Basics

3. Wiley Blue 2021-10.potx
3
Accessibility and Inclusive Design
Accessibility is often thought of in terms of compliance with standards such as
WCAG.
Compliance is not sufficient to deliver a fully accessible and inclusive experience.
Inclusive design comes from talking to, learning from, and working with a wide
variety of people, including those with disabilities.
WCAG and Accessibility help remove barriers by focusing on specifics, like color
contrast, image descriptions, and focus. These are crucial for many people.
Achieving inclusive design means asking people, including people with
disabilities what features they want. Does this font size work for you? Can you
navigate this page with a keyboard efficiently? Do these image descriptions
convey meaning effectively?

4. Wiley Blue 2021-10.potx
4
Inclusive Design Principles
Provide a Comparable Experience
Consider the Situation
Be Consistent
Give Control
Offer Choice
Prioritize Content
Add value

5. Wiley Blue 2021-10.potx
5
Accessibility Basics
 Typography
 Color Contrast
 Structure
 Page Titles
 Images
 Links
 Focus
 Content Order
 Navigation

6. Wiley Blue 2021-10.potx
6
Typography
Text should be easy to perceive. Use a common font, consistently. Limit the
number of fonts you use in a product to avoid cognitive overload.
Base fonts should be at least 14 px.
Fonts should be defined with a relative value (on websites) to enable resizing.
Limit font styling (bold, ALL CAPS, etc) that might make content difficult to read
Avoid underlines for items that are not links.
Do not use images for text.

7. Wiley Blue 2021-10.potx
7
Contrast
Good contrast provides enough variation between content in the foreground and
content in the background.
Strong color contrast helps everyone easily perceive content, especially people
with low vision, those browsing on a sunny day, or on a small screen.
Contrast for text must be 5:1 for standard text or 3:1 for large text (18 pt or 14 pt +
bold).
Contrast for non-text content, such as icons must be 3:1.
There are many automated tools to analyze (and fix) color contrast.
Color alone should not be used to convey meaning. Provide an accessible
alternative. Example: Combine underscore and color to identify links.
Tip: contrast for pale colors, such as light gray or yellow against white can be
accomplished with a thin black outline

8. Wiley Blue 2021-10.potx
8
Structure
Well-structured content is important for everyone to be able to
scan material and understand quickly what it means. This is
important for people with cognitive disabilities as well as people
using screen readers.
Provide Headings and Sections. In HTML this is <h1> through
<h6>. The headings begin new subsections, and screen readers
will offer users the ability to navigate the headings or skip
sections.
Lists. Use proper list markup (ol, ul, dl). This is a good way of
breaking up large chunks of content visually as well as for those
navigating with assistive tech.

9. Wiley Blue 2021-10.potx
9
Page Titles
 <title> is what provides text for the browsers tab display.
The <title> of websites and EPUB components is spoken by
screen readers.
Choose a short and meaningful title because it is the first
thing that many users will perceive.
Website: Page name – Section name – Site name (as in
“Library Info – Wileyonline”)
EPUB: Chapter 1: Loomings, Index
 Also helps SEO

10. Wiley Blue 2021-10.potx
10
Images
Images that have meaning must have alternative text. Text should be at
least a short description conveying essential information presented by
an image.
Be careful not to duplicate the caption or provide your opinions in a
description (“a cute child”)
Stay tuned for the next talk.

11. Wiley Blue 2021-10.potx
11
Links
 Descriptive link text helps everyone, especially those using screen readers. The text should provide
the purpose of the link.
 People using screen readers often listen to a list of links. When doing this the screen reader reads
only the link, not the surrounding text in its original context.
 Keep link descriptions short. Whenever possible, provide link text that identifies the purpose of the
link without needing additional context.
 Avoid URLs if possible. They are hard to read and are often very long.
 Avoid uninformative phrases (“click here”, “read more”).
 Example:
<p> Buy my book in:<p>
<ul>
<li><a href="www.wiley.com/samplePDF">PDF</a></li>
<li><a href="www.wiley.com/sampleEPUB">EPUB</a></li>
</ul>

12. Wiley Blue 2021-10.potx
12
Focus
 Focus is the term used for the active item on website. No matter what tools a person is
using – eyeglasses, keyboard, screen reader, zoom text – the object in focus is the part
being read, based on where the curser is.
 Focus indication is necessary for a sighted keyboard user to track where they are. Focus
must be visible, using an outline, a highlight, or similar. Browser default focus might not
have sufficient contrast.
 Focus order is the order in which focusable elements such as links, form inputs, buttons,
and controls are focused on a web page when navigating sequentially with a keyboard or
swipe gestures. Focus order should match the visual order of the page so that sighted
people using a keyboard can easily track focus.

13. Wiley Blue 2021-10.potx
13
Content Order
Content order or reading order is the sequential order of all
focusable content
Content order should be logical
Group logical content together. Example: Group all address
fields in a form together.

14. Wiley Blue 2021-10.potx
14
Navigation
 Make sure that the navigation you provide gives users a sense of where they are in the
content. This might be helping users perceive that structure of the content via an outline or
ToC on the side or using page numbers that can be perceived by AT.
 Provide consistent navigation – same set of links, in the same order on all similar pages.
 There must be more than one way to navigate to content (“multiple ways”). On web sites,
this is often accomplished with a breadcrumb as well as left navigation. In an EPUB, this is
accomplished by displaying the TOC in multiple ways (and often an index as well).

15. Wiley Blue 2021-10.potx
15
Forms
 Form labels should be clear and easy to associate with the input field and remain visible
after they are filled out. Placeholder text (such as “first name” that disappears after it is
filled in) cannot be used by people with low vision of cognitive disabilities.
 Instructions, such as date format, should be displayed near the field
 Required fields should be clearly indicated, and an explanation of what that indication
means (e.g. “an asterisk means the field is required”) should be provided
 Errors: Red is a good way to indicate errors, but it is not sufficient. Use a combination of
color, text, and icons to clearly indicate that there is an error and what it is.
 Make sure forms don’t get too crowded and the labels stay close to fields

16. Wiley Blue 2021-10.potx
16
Resources
 W3C Web Accessibility Initiative https://www.w3.org/WAI
 Inclusive Design Principles https://inclusivedesignprinciples.org/
 Aria Authoring Practices https://www.w3.org/WAI/ARIA/apg
 EPUB Accessibility 1.1 https://www.w3.org/TR/epub-a11y-11
 DAISY Accessible Publishing Knowledge Base http://kb.daisy.org/publishing/docs/
 Accessible Publishing Learning Network https://apln.ca/
 WebAim Color Contrast Checker https://webaim.org/resources/contrastchecker/
 Ace by DAISY https://daisy.org/activities/software/ace
 aXe Dev tools https://www.deque.com/axe/devtools
 Google Lighthouse https://developers.google.com/web/tools/lighthouse