Accessibility Guidelines

ACCESSIBILITY GUIDELINES

Creating and Communicating with Accessibility in Mind

May 2017

Tarjan Center Access Committee
Rachel Flores
Katharine Hayward, PhD
Beth Stoffmacher


Accessibility should be like the air we breathe; I should not have to wonder if it will be there when I wake up in the morning.

(Afi-Tiombe Kambon, Berkeley Art Museum, Pacific Film Archive, 1995)


Acknowledgements
The Tarjan Center would like to thank Patrick Burke and Lloyd Nicks at UCLA’s Disabilities and Computing Program (DCP) for their expertise and support as we improve accessibility within our center, and for assisting us with the development of these Guidelines. We would also like to thank the Tarjan Advisory Committee for their input and comments on this document. We also acknowledge the work of Danny Chalfen, who founded the DCP in 1984 for his leadership and guidance to the Tarjan Center and UCLA regarding accessibility for people with disabilities.

Note re: Document Updates
This is a living document that will be periodically revised. If you have feedback email Beth Stoffmacher bstoffmacher@mednet.ucla.edu at the Tarjan Center. Thank you!


Table of Contents


Introduction

The Tarjan Center at UCLA is a federally designated University Center for Excellence in Developmental Disabilities and is part of a network of 67 Centers around the United States and territories. The Tarjan Center is a catalyst for collaboration, innovation, and systems change to advance the self-determination and inclusion of people with disabilities. We are a resource to UCLA and to national, state, and local policymakers, professionals, and individuals with disabilities and their families. Central to our work is the sharing of what is learned through our research, evaluation, training, and model programs.

Creating an integrated and inclusive environment where people from diverse backgrounds and abilities are valued and supported is paramount to the work of our Center. We are committed to making sure that people with disabilities have the same access to and use of websites, electronic information, publications, and information for which the Tarjan Center is responsible. Towards this end, we have created these Accessibility Guidelines to implement both the spirit and requirements of the ADA/504 in order to produce documents and presentations in a way that makes information easily accessible to a wide range of audiences. While this document is intended to help Tarjan Center faculty and staff, we hope the information will be of use to the UCLA community, our collaborators, and stakeholders.


Purpose

We created these Accessibility Guidelines to improve the dissemination efforts of the Tarjan Center so that individuals with a variety of learning styles and sensory, physical, and cognitive needs can access and use our materials more quickly, easily, and independently. The work of the Tarjan Center engages diverse audiences who may need to be able to access our information in a variety of ways. For example people who are blind may use a screen reader, people with cognitive disabilities may require plain language, and people with physical disabilities may use an adapted keyboard. For the purposes of these guidelines, and consistent with the ADA, 504, and 508, we define “accessible design” as a process in which the needs of people with disabilities are specifically considered in the services and products produced to ensure that communication with people with disabilities is equally effective as communication with people without disabilities (Do-It 2013; DOJ, ADA Requirements: Effective Communication, 2014). Our presentations and events should also reflect inclusiveness for all.

How should this information be used?
Use this guide when creating internal and external print and electronic documents such as:

  • outreach and marketing materials
  • resource lists that will be shared and posted
  • reports and briefs that will be distributed and posted
  • newsletters and periodic publications
  • tables and spreadsheets
  • presentations and handouts
  • emails and listserv announcements
  • web resources, electronic forms, and websites
  • lectures and conference presentations

Guiding Legislation to Accessible Communication

This section briefly reviews federal laws and their requirements that ensure equal opportunity for people with disabilities. Within each section, there is a brief description of the legislation with links to more detailed information about each of the legal requirements. Of specific relevance to the Accessibility Guidelines are the laws, standards, and regulations that pertain to communication access.

Section 504 of the Rehabilitation Act and the Americans with Disabilities Act
Both Section 504 of the Rehabilitation Act of 1973 (as amended) and the Americans with Disabilities Act (ADA) are civil rights laws that prohibit discrimination against people with disabilities and ensure equal opportunity in the area of employment, public services, transportation, public accommodations, and telecommunications. The Rehabilitation Act prohibits discrimination on the basis of disability in programs conducted by federal agencies, in programs receiving federal funding, in federal employment, and in the employment practices of federal contractors. Built upon the foundation created by 504, the ADA goes further by expanding the covering entities to state and local governments (Title II), and businesses and nonprofit organizations that serve the public (Title III). Both 504 and the ADA require effective communication and the provision of auxiliary aids and services, such as real-time captioning, enlarged text, or electronic document. “The purpose of effective communication rules is to ensure that a person with a vision, hearing or speech disability can communicate with, receive information and convey information to, the covered entity” (ADA Requirements: Effective Communication. See also 2011 DOJ Revised ADA Tile II and Title III Regulations).

Section 508 of the Rehabilitation Act
Section 508 of the Rehabilitation Act (1998) requires that federal agencies' electronic and information technology be accessible to people with disabilities. They serve as a model for standards by educational institutions in the design of accessible technology. Section 508 contains technical criteria specific to various types of technologies such as software applications and operating systems, web-based information and applications, computers, telecommunication products, video and multi-media. Information about assistive technologies and accessibility under Section 508 is available at section508.gov.

UCLA-Based Accessibility and Compliance Resources

  • The UC Policy re: Information Technology Accessibility was established in August 2013 to create a system wide policy across the UC about electronic accessibility. Under the policy, all UC locations must adhere to IT Accessibility Requirements as set on each university campus. UCLA is currently developing its own structure and practices.
  • The UCLA ADA/504 Compliance Office, created in 1986 by Chancellor Charles Young, coordinates and monitors campus compliance, provides guidance, and evaluates efforts to improve access to campus facilities and programs. It develops procedures to identify access issues and recommends appropriate actions.
  • The UCLA Disabilities and Computing Program works to ease the integration of adaptive computing technology into the areas of instruction, study, research, and employment at UCLA. It serves in making information including printed and electronic text accessible to all students, faculty, and staff.
  • The UCLA Committee on Disability was established in 1982 as an advisory group. It is comprised of alumni, members of the UCLA community, staff, faculty, and students. The committee’s charge is to analyze and identify problems, propose solutions, and make recommendations on matters of concern to persons with disabilities.


General Guidelines

The following serve as general guidelines that are useful across electronic and printed materials and products. However, it is advised that you always ask your audience their preferred method of communication and preferred format. Within each section the key actions are identified followed by additional implementation guidelines.


Fonts and Text

Use simple, universal fonts like Arial or Verdana at a 12-point minimum. Large print documents should use an 18-point font size.

Check for the following:

  • Font selection is simple and easy to read. Do not use compressed, complicated, decorative, or cursive fonts.
  • Display materials contain standard serif or sans-serif fonts with familiar, easily recognizable characters. Some font styles are naturally smaller than others. The examples below show different font styles in 14-point size.
    • Serif: Times New Roman, Bookman, Courier New
    • San-serif: Arial, Century Gothic, Verdana
  • Print material font size is at least 12 point. When possible, use 14 point font.
  • Large print materials should be in 18 point font. When possible, it is a good idea to ask large print users which font size is best for them, as some people require up to 36-point font. Examples of font sizes are: 12 point, 14 point, 16 point, 18 point
  • Text is written using upper and lower case letters. Sentences or headings set in all capitals can make text harder to read.
  • Italics, bold, and underline should be used very little. Avoid using these formats for entire sections and documents. Bold is preferred over italics and underlining if bringing attention to text.


Color Contrast and Paper

Color contrast can have a major effect on how your document or presentation is experienced.

Check for the following:

  • Light yellow or off-white non-glossy/matte paper is used for printing. Glossy paper can give a glare and make it difficult for some to read.
  • Dark text is used on a light background and light text is used on a dark background. There is good evidence that for many readers who are older or partially sighted, light (white or light yellow) letters on a dark (black) background are more readable than dark letters on a light background. Examples of easy-to-read colors.
  • Color text is used mainly for headlines and titles where an accompanying larger font size can be used. Don’t use color as the only way to distinguish information.
  • High color contrast (70 percent) between text and background is best. Examples of effective color contrast.
  • If colored print and colored paper are both used, two shades of the same color should be avoided and a light color should be used for the background.
  • Test for color contrast and color readability by printing your work in black and white.
  • When printing a two-sided document, ensure that your paper is heavy enough in weight (80 or 90 gpm [grams per meter]) to prevent text and color showing through on the other side.


Page and Text Layout

Materials should be designed with clear margins and spacing so that the reader feels a sense of ease in finding the beginning of the next line.

Check for the following:

  • Main (body) text is left aligned. Avoid centered, right aligned, and justified text, which is difficult for some people to follow.
  • Spacing between lines should be at least 1.5 lines or 2 lines (double-spaced).
  • Gutter margins (adjoining margins in two facing pages) are a minimum of 7/8 of an inch, and the outside margins are at least half an inch.
  • Space between columns is at least half an inch.
  • Hyphenations are not used on non-hyphenated words to fill space at the end of text lines.
  • Each line of text is no longer than six inches (50-60 characters).
  • Hyperlinks that link text to other elements should concisely communicate the purpose of the link (such as more about hyperlinks, AUCD 2014 Conference). Relatively short understandable URLs may be used as hyperlinks (such as https://www.semel.ucla.edu/tarjan/cecy/about).
  • Links should look like links and nothing else should look like them.


Images

Your materials should reflect the diversity of your intended audience and be responsive to the community you are trying to reach. This means that images should include pictures of people with disabilities, different cultural groups, and people of all ages. Avoid background graphics. Images should have captions, and must have alternative text unless they are purely decorative.

Check for the following:

  • Background graphics do not make text difficult to read. Graphics such as watermarks are not used over or behind any other images, photographs, graphics, or text.
  • Images have a wide range of color contrast or gray-scale variation.
  • Captions are provided for images in at least a 12-point font size.
  • Alternative text is provided for each informational image, including logos.
  • Purely decorative images can have an empty alternative text box.

Captions are used to contribute to or enhance the storytelling. They are often used to connect an image with the narrative.

Alternative Text (alt-text) is text that serves the same purpose and conveys the same essential information as the image itself. Context is key when writing alt-text: including “why” can give more meaning than just describing the “what” of an image. This means that alt-text for the same image may be different based on the context and surroundings of the image itself.


Caption: Youth advisor contributing to group discussion at a CECY meeting.
Alt-text: Youth Advisor speaking into a microphone at a CECY meeting.


Check for the following:

  • Alt-text is concise and does not use extraneous words like “image of” in the description.
  • If the content of the image is included within the content of the text that surrounds the image, there is no need to restate that content in the alt-text.
  • When an image contains only text, the text being displayed in the image can be entered as the alternative text.
  • When an image is used to direct the reader (e.g., an arrow), provide alt-text that states where the arrow is pointing or leading the user.
  • If the image is a hyperlink, stating its function is more important than its content.
  • A hyperlink must always be identified so that the user understands where the link is taking them. Hyperlinks can be read out of context from surrounding text, so they need to be free-standing.
  • Decorative images that are used for layout or non-informative purposes, and that have no links, can have an empty alt-text box.


Readability

Use plain English and short sentences to convey your message. You want to communicate information that is technically accurate and also understandable.

Check for the following:

  • Consider your audience when writing materials. Material for academic audiences will not be written at the same literacy level as material for the general public.
  • Aim for a 5th grade reading level if the general public is your audience. This will allow greater reach of your materials, including those with low literacy or intellectual disabilities.
  • Spell out or explain acronyms or jargon on first use.
  • Consider how using pictures with simple text can be another way to convey information.
  • Avoid run-on sentences. Short sentences are clearer. They have more impact.
  • Use active verbs instead of passive verbs.
  • Wherever possible, use “we” or “you” rather than “consumer” or “the Center”.
  • Check readability of materials using built-in readability checkers.
  • Consider how white space on the page improves legibility. Pages cluttered with text can be hard to read and overwhelming. White space can help communicate page structure.


Access Symbols

It is important that your audience is aware that your documents, as well as your events, are accessible. One way to do this is to include access symbols on the documents and at your events. Below are examples of access symbols that are also useful to advertise accessibility.


Access symbol of a moving wheelchair.


Access symbol indicating that large print is available.


Access symbol indicating that open captioning is available upon request.


More information on the new moving wheelchair accessible symbol. Download any of the 12 accessibility symbols.


Working with Computer Applications

Source Material

The source material of your document’s text matters. Do not use text that is embedded in a graphic. Text may not remain as text when you paste it from one document into another, especially across applications. Text can be converted into an image or bring unwanted formatting codes into the final document. The more you re-use text via copy and paste, the more it can be corrupted. Using “styles” will help with consistency and structure in your document.

Check for the following:

  • Stay as close to the source material as possible.
  • Text imports as text when copying and pasting from one file or application to another (e.g., cutting and pasting text from a PowerPoint into a Word document, or vice versa). You can check this by running an accessibility test or testing on a screen reader.
  • You work in “styles” to assure consistency and structure.


Word Documents

Word has built-in tools that can help you format an accessible document as you are creating the document itself. It is best practice to create with accessibility in mind, rather than to create a document and then rework it to be accessible.

Check for the following:

  • Use the General Guidelines section of this document when creating a Word file.
  • Include hyperlinks and alt-text for all links and images accordingly.
  • Use Word’s built-in formatting styles and outline levels when creating your document. They provide the ability to format text consistently and to structure the hierarchy of your document, and are important for screen readers and other adaptive technology.
  • Do not use tables for layout purposes. It is best to use them to show data relationships only.
  • Whenever possible, format images so that they are positioned in line with the text.
  • Get into the habit of checking accessibility via Microsoft Office’s Accessibility Checker (for Word, Excel, and PowerPoint). This is not the only step you should take in ensuring accessibility, but it is a good way to begin in checking the status of your document’s accessibility.


Excel Charts

Excel charts should have alt-text that states not only what your charts are showing, but also what they are saying (i.e., what a sighted person would interpret about what they see on the chart). Keep your worksheets simple and clear for screen readers. (This section is largely drawn from the California Department of Rehabilitation’s Disability Access Services’ “Seven Steps to Creating an Accessible Excel Worksheet.” More at the Disability Access Services Website).

Check for the following:

  • Images, charts and graphics in an Excel document have alt-text.
  • Alt-text for Excel elements should present the content (what) and function (why) of the chart. Consider: What is the graphic showing? What would a sighted person see from the graphic? What would they interpret about what they see?
  • Clear column headings help to provide context and assists navigation of the table’s contents.
  • Avoid blank cells, rows, and columns, which may lead someone to believe there is nothing more in the table. When you need to include them, adding fillers like “N/A” or “intentionally blank” will help the reader understand the blank items. TIP: Make your fillers the same color as the table’s background color (e.g., white on white) so that they can be read by screen readers but are invisible otherwise.
  • Do not merge or split cells. This makes navigating tables with assistance technologies difficult. Keep cells simple and consistent.
  • Give your sheet tabs unique names to make it easier to move through your Excel workbook.
  • Include alternate formats for multimedia if any audio or video components are included in the worksheet.
  • Check accessibility via Microsoft Office’s Accessibility Checker (for Word, Excel, and PowerPoint). Consider that charts included in reports, publications, PowerPoints, and presentations that are posted online should be accessible to people with visual disabilities.


PowerPoints and Presentations

Consider that every aspect of a dynamic PowerPoint – its text, graphics, tables, charts, videos, audio – should be accessible to all. Consider readability and color contrast for your slides, particularly if they will be presented at live events where people will be seeing them from a distance. (Guidelines, resources, and sample templates for accessible PowerPoints and Presentations are available from the American Public Health Association at (https://www.apha.org/events-and-meetings/annual/presenter-information/oral-session-guidelines/access-information-for-presenters).

Check for the following:

  • Maintain PowerPoint’s default heading font size of 44-point bold when possible.
  • Use 32-point font size or higher for bullets.
  • Have no more than 6 lines of text on each slide.
  • Have sufficient alt-text for all graphs, tables, and images before posting online or sending digitally.
  • Check for color contrast and readability of all slides. Consider color blind people who may be seeing your slides at a live event from a distance.
  • Describe the content of graphic slides orally during presentations.
  • If using video, make sure it is captioned.
  • Use Microsoft Office’s Accessibility Checker (for Word, Excel, and PowerPoint) as a first step to toward creating an accessible PowerPoint.


Desktop Publishing Programs

Desktop Publishing Programs are used to create graphic materials (e.g., flyers, newsletters, brochures) that are typically converted to PDFs for use and distribution. If an outside graphic designer is creating your material, you may want to ask if they know how to build in document accessibility for screen readers. Otherwise, you will need to “remediate” the document after it is created to make it accessible. Microsoft Publisher and Acrobat InDesign are two popular desktop publishing programs used to create graphic material.


Converting Documents into PDFs

Word, Excel, and PowerPoint files, among others, are increasingly being converted into PDFs before being distributed or posted. Unfortunately, many of us do not realize how the method we use to convert a file to a PDF may serve or disserve its accessibility. You should always test your document’s accessibility after converting it.

Check for the following:

  • CRITICAL: When converting a Microsoft Office document (Word, Excel, PowerPoint) to PDF, go to the “Acrobat” tab and select to first tab to “Create PDF.” Saving as a PDF in the print menu flattens your document, thereby eliminating accessibility you may have built into the document as you created it.
  • Accessible PDF documents are comprised of “tags” that screen readers read to communicate the elements of your document (e.g., headers, texts, hyperlinks, lists, tables, images, captions, and alt-text). Tags must be structured in a logical reading order that will allow people using screen readers to understand your document as a sighed person would.
  • UCLA faculty and staff have access to Lynda.com’s excellent trainings, including Creating Accessible PDFs by Chad Chelius. Sign into UCLA’s portal to Lynda.com trainings at https://www.lynda.com/signin/organization. You can login on training sections you want to watch via the outline listed on the training’s home page. We highly recommend viewing at least a section of this training for a well-executed demonstration on creating accessible PDFs.


Web-Based Material

Email

Emails sent to a listserv or eblasts to distribution lists that people can join on your website are examples of web-based material that need to routinely incorporate elements of accessibility, including alt-text for images and descriptive hyperlinks.

Check for the following

  • Emails sent to a listserv or to a group, should be sent using the plain text option or using a universal font such as Arial in at least 12 point font size. The exception is for individual or workgroup emails to known people without disabilities or working drafts. Alternative or accessible formats should be made available on request.
  • Files or forms on the web that are linked from within an email should be accessible. However, you are not responsible for links to sites that are outside of your direct control.
  • Images in the email should have alt-text or be captioned beneath the image. Images or graphics that are strictly decorative (holly leaves on a holiday party announcement) can be tagged with alt=“” so that screen readers ignore them.
  • Broadcast emails and emails generated by web applications (“Email this page,” etc.) must follow applicable Section 508 standards.


Online Forms

Online registration pages and web-based surveys are examples of online forms that need to reflect that all are invited to participate. They should be designed with correct markup to be accessible via adaptive technologies. See this WebAIM.com resource on creating accessible forms.


Websites

While instruction on how to create an accessible website is beyond the scope of these guidelines and not applicable to most Tarjan Center faculty and staff, it is important that you have a basic understanding of what comprises a website that is accessible to people with disabilities including but not limited to those with visual, auditory, physical, speech, cognitive and neurological disabilities.

Check for the following:

  • Your website creator should have knowledge about how to create a site that is 508 compliant.
  • An accessible website allows all users to navigate through its sections, pages, listings, calendars, and trainings.
  • It lets users experience all content on its pages and in any linked material. This includes any documents, videos, audio files, and presentations.
  • See WebAIM’s Principles of Accessible Design to familiarize yourself with elements that come into play when creating an accessible website. These principles include items covered in these guidelines and also website-specific elements such as allowing users to skip repetitive elements on a page. You can learn more about web design and accessibility at WebAIM.org.


Advertising and Marketing Events

It is important to create events that are a welcoming and inclusive experience for all. Addressing accessibility in your marketing and advertising, as well as at the event itself, sends a signal to people with disabilities that they are included and that their necessary accommodations have been considered. See NADC’s webpage, How to Advertise and Market Accessibility, for a list of things to consider and address when creating an inclusive event for all.


Additional Resources

Beginner Level

Advanced Level


Testing for Accessibility

Beginner Level

  • Test documents for Section 508 Compliance, from the U.S. Department of Health and Human Service.
  • Cynthia Says is designed to identify errors in your content related to Section 508 standards and/or the WCAG guidelines. This free tool meant for educational purposes, is an online test which only validates one page at a time. This service will expose you to the underlying technology and the benefits of using HiSoftware's full-featured solutions for automated content compliance and Web governance.
  • Snook.ca’s Colour Contrast Check Tool allows to specify a foreground and a background color and determine if they provide enough of a contrast "when viewed by someone having color deficits or when viewed on a black and white screen"[W3C].
  • W3c Easy Checks helps you assess the accessibility of your web page with guidance and next steps.
  • WCAG 2.0 Checklist has WebAIM’s interpretation of WCAG guidelines, success criteria and recommendations for creating an accessible web page.

Advanced Level

  • There is an automated accessibility checker tool, available for free to all UC webmasters/developers. It gives an overview of possible accessibility problems. It can be used to monitor a site in (almost) real time as you create it. Go to the UC AMP site. Once logged in with UCLA credentials, you can directly access the UC AMP accessibility check page to view any projects you have.


For More Information

  • If you have questions about creating accessible desktop material or related resources, contact Beth Stoffmacher, Communications and Program Manager, at bstoffmacher@mednet.ucla.edu
  • If you have questions about creating accessible events, event advertising and marketing material, or related resources, contact Beth Stoffmacher, Data and Event Coordinator, at bstoffmacher@mednet.ucla.edu