Skip to Main Content

Resources for Digital Humanities: Accessibility

Vocabulary, tools, advice, and library resources to start your Digital Humanities project or research.

Resources

Universal Design

Universal Design is a concept—coming originally out of architectural design, coined as a term by Ronald Mace—that has been widely applied to accessibility in design contexts.

Universal Design, broadly speaking, seeks to meet the access needs of as many of a design's potential users as possible, without requiring users to make additional adaptations. Universal Design can benefit abled users, as well as disabled users: a commonly cited example is the usefulness of curb cuts, invented by Selwyn Goldsmith, for both wheelchair users and abled people with strollers. However, as various disability studies scholars have pointed out—for more on this, see Jay Dolmage's chapter on Universal Design—framing Universal Design this way can water down the emphasis on access for disabled users.

Thinking about your digital humanities project through a lens of Universal Design (especially if you remember to center disabled users in your Universal Design) can help you build more accessible, and often more interesting, projects.

A Note on Safety

Anything that flashes more than three times per second, including animations and videos, poses a seizure risk, and is therefore physically dangerous to some users. PEAT is a free Windows tool that can help you identify this risk, especially if you have any quick or high-contrast videos or animations (lightning, quick transitions, etc.) in your web or desktop projects.

Selected Accessibility Recommendations

These are not meant to be a complete list of considerations for your projects' accessibility, but rather to offer a set of key examples of common considerations to make for digital humanities projects.

Colors and Tones
  • Strong color contrast between backgrounds and content (such as text, but also illustrations or graphics)—light content on dark backgrounds or dark content on light backgrounds, for example, rather than dark content on dark backgrounds or light on light
  • Color is not the sole feature conveying something (e.g., links are underlined, not just blue; data visualizations conveying something via color might have additional labels to duplicate that information)
  • WhoCanUse is a quick browser tool you can use to check color and contrast accessibility for various combinations
Equivalents for Single-Sense Content
  • Alt text for any image or illustration that is intended to convey information; those conveying no information (design elements such as borders, for example, or images that are already thoroughly described by the text near them) should be marked "decorative" or left without alt text
  • Captions and transcripts for audio and video content
  • Test alt text and other equivalents for visual information by using a free screen reader such as NVDA (downloadable for Windows) or VoiceOver (included in Mac and iOS)
Navigability and Readability
  • Built-in semantic features (make headers by using header styles in Word or similar documents or by header tags in HTML documents, rather than through visual formatting; use "label" tags for form elements; etc.), which accessibility tools often use for navigation
  • Links offer meaningful labels ("more information on the DHLab" instead of "click here") so they make sense if provided as a quick list out of their original context
  • Tab order (the order in which interactive features of web pages are highlighted if cycled through using the tab key) follows the flow of browsing and includes all interactive elements such as links or buttons; for non-web projects, keyboard navigation is supported
  • Text is broken up with meaningful headers and written in the plainest language it can be
  • Screen readers such as NVDA or VoiceOver can help in testing navigability; tab order can be checked by hitting the tab key until the whole page has been accessed, starting with the URL bar
Controls and Options
  • Time-based media such as audio or video and animations can be controlled by users, including starting and stopping them and (ideally) playing at faster or slower speeds
  • Actions that will change the project or view are clearly labeled and easily controlled or reversed—notify the user if a button will close the current view, for example, or wait until the user presses "go" to respond to inputted text
  • Layout accommodates resizing text (even doubling its size) responsively, not breaking or obscuring elements
  • Where possible, content is offered in multiple languages—if multiple languages are offered, the method of switching is clear and easy to find

Examples

Contrast and visibility
Good Contrast
Poor Contrast
Good Contrast
Poor Contrast
Note that what degree of contrast is required can also depend on color, font size, or font weight (is it bold, for example).
Color accessibility
Ambiguous Without Color
 
 
 

 

Clear Without Color
Stop
Slow
Go
Duplicating information conveyed by color can help: for example, a data visualization could use both color and size for points, or color and pattern for lines.

Alt Text
A low-relief sculpture of a lamassu, a mythical creature with the body of a bull, the wings of a bird, and the head of a human
What alt text would be best for this image? It depends on context!
If it appears without context, you might opt for:
"A low-relief sculpture of a lamassu, a mythical creature with the body of a bull, the wings of a bird, and the head of a human"
For an article about sculptural references in Sterling, you might go with:
"A carved detail in Sterling Memorial Library depicting a creature from Assyrian mythology and architecture"
When in doubt, aim for short and clear: focus on capturing the core point you'd want sighted readers to take from the image.

Link Readability
Instead of:
To contact our staff with additional questions, click here.

Try:
Contact our staff with any additional questions.
Instead of:
These data visualizations were designed to showcase our recently collected data.

Try:
These data visualizations were designed to showcase our recently collected data.
Longer isn't better: opt for the fewest words needed to indicate where the link goes.

Flexibility
Design websites so none of the content disappears or becomes unusable as the font size changes. Note the scroll bar that appears below when the content gets too long for the window!
Title
Link
Link
Link
This would be the text of the body of a website. In order to show resizing effectively, it is long—and doesn't contain much real information. This is really just intended to convey the idea of text.
Footer
Responsive design is good design—and accessible design!

Contact Us

For help with any stage of a digital humanities project, with any of the methods described here, or with any other questions, feel free to reach out or book a consultation with the DHLab.