top of page

Accessibility

For museum websites and digital collections

What are best practices in designing museum websites that support accessibility for a diverse range of users?

 

How can museums improve the accessibility of millions of previously digitized resources?

 

By Tess Porter

Accessibility and Inclusive Design

Accessibility of museum websites and digital collections is key to creating museum spaces where the rich information and experiences they hold are truly available to everyone.

The American Alliance of Museums defines accessibility as “giving equitable access to everyone along the continuum of human ability and experience. Accessibility encompasses the broader meanings of compliance and refers to how organizations make space for the characteristics that each person brings.” 


Inclusive design exists alongside accessibility. As defined by Sina Bahram and Corey Timpson, two accessibility leaders, inclusive design is “a design process in which the fact that all individuals interact with the world differently is placed at the heart of the process. Individual people, with their own lived experience, a priori knowledge, and differences, will interact with what we make and put into the world, so we should relax our assumptions about the abilities of the user and instead design with compassion, flexibility, and inclusion at the heart of our practice.”


Both accessibility and inclusive design recognize that visitors enter into spaces, both physical and virtual, with different, equally valuable ways of interacting with the world. Human ability and experience exists along a continuum, and these concepts strive to create inclusive experiences where all are welcome. For a helpful definition of disability, please see our Glossary page
When these concepts are integrated into websites and digital collections, users of assistive technologies can experience the site in a way that is equitable for all visitors. Often, adaptations implemented with these concepts in mind benefit groups outside of those they were originally designed for – for example, captions in videos and clear, organized website design – supporting everyone with a better experience.


This case study discusses techniques for implementing accessibility best practices into museum websites and digital collections. It also discusses techniques for developing alt-text and long descriptions, incredibly important as museum websites depend on images to communicate information with their visitors. Both discussions focus on implementing these practices into museum websites and digital collections where accessibility was not considered in their original development. 


This discussion is not exhaustive, but hopes to present good first steps towards increasing inclusivity. 

Best Practices for Website Accessibility

The Web Content Accessibility Guidelines (WCAG) outline four principles, each with simple guidelines, to guide the development of accessible websites:

  1. Perceivable: “Information and user interface components must be presentable to users in ways they can perceive.”

    • Supporting guidelines include providing text alternatives, providing time-based media alternatives, creating adaptable means for presenting content, and making content distinguishable for different levels of seeing and hearing. 

  2. Operable: “User interface components and navigation must be operable.”

    • Supporting guidelines include ensuring that all functionality is keyboard accessible, providing enough time to read and use content, not including designs known to cause seizures and physical reactions, making the site easily navigable, and make it easier to for users to operate functionality with input modalities beyond keyboards.

  3. Understandable: “Information and the operation of the user interface must be understandable.”

    • Supporting guidelines include making text content readable, making websites operate in predictable ways, and helping users avoid and correct mistakes with input assistance. 

  4. Robust: “Content must be robust enough that it can be interpreted by a wide variety of user agents, including assistive technologies.”

    • Supporting guidelines include ensuring that the website is compatible with current and future user agents.

 

Sina Bahram presents ten best practices for those first steps in increasing the accessibility of museum websites in his article: “10 Best Practices of Accessible Museum Websites.” A summary of those practices follows: 

  1. Include alt text for images: Develop alt-text (discussed in detail in the next section) to provide textual descriptions of images to those who may not be able to see the image.

  2. Use HTML heading levels to organize text: Use HTML heading tags to organize and convey the hierarchy on your page to all users. Heading tags begin at level one (<h1>) and increase to six (<h6>), with each increasing level increasing in specificity.

  3. Caption, transcribe, and describe videos: Use techniques such as subtitles, captions, sign-language interpreters, transcript, and audio-descriptions. For detailed definitions on each of these techniques, visit Mosaic’s Inclusive Design Glossary.  

    • Automatic captions, such as those automatically added by YouTube to videos, are not enough. These commonly lack punctuation, making them very hard to read. However, they can serve as a solid base for cultural heritage professionals to use in developing formal, complete captions – it is possible to download these automatic caption files as .svgs, edit them in a text-editor for clarity, and re-upload them to YouTube. 

  4. Pay attention to color and contrast: Ensure that information is not communicated through only color. Ensure, too, that the contrast of two colors adheres to WCAG’s contrast and color accessibility requirements. (Note, see this website’s Accessibility Recommendations page for a helpful tool to evaluate colors and contrast). 

  5. Label controls: Using programmatic labeling supports visitors using assistive technology to understand what controls on a website do without seeing them. 

  6. Make your site zoom-friendly: Ensure the site is usable when zoomed in at least 200%, using both text-based zoom (where only text is magnified) and optical zoom (where everything is magnified).  

  7. Ensure controls are accessible without a mouse: Visitors must be able to access your site with alternate navigation methods, such as a keyboard. Additionally, the site must display which part of the site is selected through one of these alternate methods, also known as the “point of regard.” This may appear as an outline around a currently selected item in a navigation menu. 

  8. Label and style links: When links appear as text in the middle of passages, this linked text must describe where links go. For example, text such as “Click here” is ineffective, because a visitor would need the context of the surrounding passage to understand where the link leads. Ensure that links are clearly visually indicated; on this site, we've highlighted links in grey to differentiate hyperlinks from other underlined text.

  9. Include page language in the code: This ensures that screen readers correctly output the appropriate language for their users. 

  10. Validate: Use an HTML validator, like the one listed on this website’s Accessibility Recommendations page to ensure that coding errors that would prevent your accessibility-focused coding additions from working as intended. 

 

Visit this website’s Accessibility Recommendations page for helpful tools to evaluate the accessibility of your website and develop ways to begin improvements. 
 

Alt-Text and Long Descriptions: Information and Case Study for Development

Alt-text and long descriptions are visual descriptions that help diverse groups of visitors who are not able to see images access the information contained in them. 

Alt-text, short for “alternative text,” is an HTML attribute that provides a short, visual description of an image for users who are not able to see the image for a variety of reasons. Structured as a sentence fragment of around 15 words, it indicates the most important content of an image (for more information on adding alt-text to HTML, see this webpage about alt attributes from W3). Long descriptions, on the other hand, provide more detailed visual information. Often anywhere between a couple of sentences to multiple paragraphs and written in complete sentences, they extensively describe the most important aspects of the image with attention to detail. 

​

For cultural heritage institutions, whose collections so frequently depend on images to communicate information, including visual descriptions is of the upmost importance. The Cooper Hewitt, Smithsonian Design Museum’s Guidelines for Image Description is the most comprehensive and well-respected guide for cultural institutions developing visual descriptions. Developed in collaboration with accessibility leaders and other museums, the guideline presents a guiding structure and detailed recommendations for creating effective descriptions for complex images. One of the most helpful aspects of the guidelines are their recommendations for describing people with respect to physical features, age, gender, ethnicity and skin tone, and identification. Visit the guidelines for full recommendations alongside practical examples.

​

How can a museum implement visual descriptions and alt-text into previously digitized collections, especially when their number might exist in the thousands (or even the millions)? The Cooper Hewitt’s pilot project for developing alt-text and long descriptions – which led to the development of previously mentioned image description guidelines – provides an intriguing example of how a museum might crowdsource staff expertise to increase the accessibility of their website and digital collections. In the words of Ruth Starr, the museum’s Accessibility Manager, “We had a simple premise: a group of staff would join the image description project; each week they would describe some images; and slowly, incrementally, we’d chip away at the 210,000-plus images” lacking visual descriptions. 

​

Within the first three weeks, the team – consisting of staff from the museum’s visitor experience, digital, SHOP, exhibitions, curatorial, education, and library departments – developed 842 descriptions. For a detailed discussion of this project, read this blog post by Ruth Starr. Guiding ideas and lessons learned from their pilot are as follows:

​

  • A Core Belief: All staff members, regardless of department or prior experience, bring valuable and unique perspectives to the development of visual descriptions. Careful, thoughtful effort in description development was the most important. 

  • Guiding Questions for Description Development: To develop the previously mentioned image description guidelines, the team started with the following guiding questions: 

    • “What is important about the image?”

    • “What word choice best conveys the visual elements?”

    • “How can we use language to best reflect the impression / intentions of the image?”

  • Workflow:

    • For each object, staff developed two descriptions: an alt text and a long description. 

    • Staff were welcome to add as much or as little as they could each week without judgment. 

    • Weekly sprints involved all team members selecting images they wanted to work with from a group of strategically prioritized objects, pulled from current and upcoming exhibitions or available through the Smithsonian Open Access initiative.

    • Bi-weekly project meetings provided opportunities to discuss the process, ask questions, and collaborate with others. Collaborative, discussion-focused meetings were important to rich description development; as Ruth Starr notes, “We recognized that descriptions are inherently enriched through discussion—more perspectives offer deeper understanding of images.” During meetings, they discussed difficult questions such as: “What word choice feels right? What are we assuming? How do we describe what is ambiguous to us? How much design vocabulary is meaningful to include? What are we prioritizing in the hierarchy of an image?”

  • Keeping it Fun: To invite playfulness and support deeply exploring the Cooper Hewitt’s collections, the team chose one object a week to use in responding to a lighthearted challenge prompt. Some examples:

    • “What will keep you cozy at home on a rainy day?”

    • “I Spy: an object you have at home?”

    • “An object you’d like to have if marooned on a deserted island?”

    • “It was Miss Scarlett, in the dining room, with the candlestick. Something red, dining-room related, one of the 243 results when you search ‘candlestick’ in our collection?”

  • Implementation: To ensure newly-developed descriptions were stored and implemented into all of the Cooper Hewitt’s platforms, the team used Coyote, an open-source software project, developed by the Museum of Contemporary Art Chicago, to support the creation and implementation of alt text and other visual descriptions in public museum websites and digitized collections. For more information, visit the Coyote project website

 

As of the blog post’s publication in May 2020, the team was excited about the possibility to scale and continue this work as they move into the future. 

​

For another perspective on developing an alt-text creation process, read this blog post from The Block Museum at Northwestern University. Here, they discuss a pilot project for developing alt-text that also had unexpected benefits for connecting staff across departments.

Author and Editor: Tess Porter, 2021

Sources

​

Bahram, Sina. “10 Best Practices of Accessible Museum Websites.” American Alliance of Museums, 28 Oct. 2021, https://www.aam-us.org/2021/01/07/10-best-practices-of-accessible-museum-websites/


Bahram, Sina and Corey Timpson. “Inclusive Design Glossary – Mosaic.” Mosaic, https://www.m4c.space/?page_id=154. Accessed 7 Dec. 2021. 


“Cooper Hewitt Guidelines for Image Description.” Cooper Hewitt, Smithsonian Design Museum, 23 Aug. 2021, https://www.cooperhewitt.org/cooper-hewitt-guidelines-for-image-description/.


Coyote. Museum of Contemporary Art Chicago, https://coyote.pics/. Accessed 7 Dec. 2021. 


“Definitions of Diversity, Equity, Accessibility, and Inclusion – American Alliance of Museums.” American Alliance of Museums, https://www.aam-us.org/programs/diversity-equity-accessibility-and-inclusion/facing-change-definitions/. Accessed 7 Dec. 2021.

 
“Productive Constraints: Writing Alt Texts at The Block” The Block Museum, Northwestern University, 15 June 2021. https://nublockmuseum.blog/2021/06/15/productive-constraints-writing-alt-texts-at-the-block/.


Starr, Ruth. “Prioritizing Image Descriptions and Digital Equity at Cooper Hewitt.” American Alliance of Museums, 13 May 2020. https://www.aam-us.org/2020/05/13/prioritizing-image-descriptions-and-digital-equity-at-cooper-hewitt/.

“Web Content Accessibility Guidelines (WCAG) Overview.” W3C Web Accessibility Initiative, 29 Apr. 2021, https://www.w3.org/WAI/standards-guidelines/wcag/

​

Website created by Sean H. Gao, Ellysha Leonard, Jesse Ludington, and Tess Porter using Wix in 2021.

bottom of page