Introduction: The Accessible Technology Webinar Series is sponsored by the Great Lakes ADA Center and the Pacific ADA Center, both members of the ADA National Network. The content and materials of this training cannot be used and/or distributed without permission. This training is develop under NIDRR grant #H133A060097. For permission to use training content or obtain copies of materials used as part of this program please contact us by email at gldbtac@uic.edu or toll free (800) 949-4232 (V/TTY) in IL, IN, MI, MN, OH and WI or 312-413-1407 (V/TTY) other locations. Slide#1 Best Practices in Developing and Disseminating Documents Electronically Sponsored By: 2010 Accessible Technology On-line Seminar Series by National Network of DBTAC: ADA Centers March 10, 2010 Slide#2 Who among you are Content Creators? * Websites * Digital Documents * Print Media * E-mail * Listservs * Blogs * Forums * RSS(Note: If you are involved in creating any of the above applications, you are a Content Creator.) Slide#3 Who is this information intended for? Digital content is often created for use by: * Employees * The Public * Customers * Contractors * Human Resources * Legal Professionals * Government (Federal, State, Local) * Job Applicants Slide#4 What about people with disabilities? Digital content, when developed, needs to take into account the needs of people with the following types of disabilities: * Hearing * Sensory * Motor * Cognitive(Note: As our population ages, many will experience one or more of these functional limitations.) Slide#5 Accessibility is the Law The following laws may apply: * California Government Code 11135 * Section 508 of the Rehabilitation Act of 1973, as amended (29 U.S.C. 794d) * The Americans with Disabilities Act (Title I) * California Unruh Civil Rights Act(Note: Numerous states already have laws in place that mimic or exceed federal civil rights laws.) Slide#6 Do these laws apply to us? * Let’s see… Slide#7 Do these laws apply to us? California Government Code 11135 * Yes… * If your entity’s program or activity is conducted, operated, or administered by the state or by any state agency, or funded directly by the state, or receive any financial assistance from the state of California. Slide#8 Do these laws apply to us? Section 508 of the Rehabilitation Act of 1973, as amended (29 U.S.C. 794d) * Yes… * If your entity receives federal funds or is a California State Government agency or department, or if you receive State Funds, or contract with the State of California. Slide#9 Do these laws apply to us? Americans with Disabilities Act (Title I – regarding Employment) * Yes… * If you are a private employer, state and local government, employment agencies or labor union. Slide#10 Do these laws apply to us? California Unruh Civil Rights Act * Yes… * Applies to all California businesses, including but not limited to hotels and motel, restaurants, theaters, hospitals, barber and beauty shops, housing accommodations, public agencies, and retail establishments Slide#11 Issues to be concerned about: Adobe PDF files, Microsoft Power Point presentations and Microsoft Word documents are the most common formats for digital documents. * To be accessible, they must be perceivable, operable, understandable and robust. Slide#12 Ah-hah! As content creators… * We all play an important part in complying with the law and ensuring that our customers and employees have access to our programs and services. Slide#13 4 Principles to Consider #1. Perceivable * Your digital documents must be perceivable. That is, visible to any person’s one or more senses, even if she is a blind user, or one with low vision. Slide#14 4 Principles to Consider #2. Operable * Digital content must be operable. That is, any user should be able to perform the necessary interactions with it. This most often involves interactive forms and navigation. Slide#15 4 Principles to Consider #3. Understandable * Information presented must be understandable by those attempting to use the information. That is why it is important to anticipate user-interaction. Targeted users should include people with learning disabilities and people with cognitive limitations. Slide#16 4 Principles to Consider #4. Robust * Digital documents should be designed for presentation to people with disabilities using different, current and future assistive technologies. Slide#17 Best Practices for PDF, Word, and PPT PDF (Portable Document Format) * Tagged Reading Order * OCR all Scanned content * Identify document language Slide#18 PDF Accessible PDFs -Quick Reference Review & correct the Document Properties File > Properties or Keyboard shortcut –Ctrl + D Slide#19 PDF Accessible PDFs -Quick Reference Under “Description” tab: * Determine if the document has been tagged * Give the title of the document a meaningful name -which will be displayed on search results pages * Add the author’s name * Give a meaningful subject of the document * Apply keywords to the document separating each word by a comma –no spaces. Ex. keyword,keyword,keyword Slide#20 PDF Accessible PDFs -Quick Reference * Apply tags to the document -if no tags are present from the Document Properties. * Advanced > Accessibility > Add Tags to Document * Correct tags and fix -from the tags panel. Slide#21 PDF Accessible PDFs -Quick Reference Correct tags and fix -from the tags panel Most common tags used:

tags are used for paragraphs of content

tags are used for form fields
  • tags are used for objects that are listed on a page
    ,

    ,

    ,

    tags are used for headers in a document Slide#22 PDF Accessible PDFs -Quick Reference
    tags are used for images inside of a document tags are used for contents that pages that contain tables
    tags within a represent Table Headers tags within a
    represent Table Rows represent Table Data Slide#23 PDF Accessible PDFs -Quick ReferenceForm fields always need the following: Tooltips –provide a description to the viewer using an assistive technology tool for what the form field means and the action to apply to it. Example: a first name field should have a tooltip of, “Enter First Name:” Screen readers will read the tooltip as, “Enter First Name Colon” Correct tab order –Document should have a tab order that will flow top to bottom, left to right. Slide#24 PDF Accessible PDFs -Quick Reference * Alternative Text for figures (images) located on a page * If the figure (image) has importance to a page, then Alternative Text (Alt Text) must be applied to it. Slide#25 PDF Accessible PDFs -Quick Reference * Create the tag from the tags panel or Create the tag from the “Touch Up Reading Order Tool” * Apply the Alternative Text by right-clicking the
    tag that is created and going to properties * Under the “Tag” tab, enter a meaningful description in the “Alternative Text” box. Slide#26 PDF Accessible PDFs -Quick ReferenceAdd Bookmarks to a document that consists over 10 pages Tables must have the proper tags identified within the
    tags within a
    tag for Table Rows
    for Table Headers
    considered Table Data within the Table Row Slide#27 PDF Accessible PDFs -Quick ReferenceEntire document must flow in a logical reading order. * Top to Bottom * Left to Right Slide#28 Best Practices for PDF, Word, and PPT Word * Stop using “BOLD” and Instant Font and Font Size * Instead… create Style Sheets * Identify Table Headings using styles * Label image content by: * Right-click on the image * Select “Format Picture” option * Click on the “Alt Text” tab and provide a brief description. Slide#29 Best Practices for PDF, Word, and PPT PowerPoint * Create a text or HTML equivalent * Label image content Slide#30 What about E-mail? There are various email formats available. * But for those who use screen readers, some formats may hinder access to email content and prevent the reader from making sense of the messages received. Slide#31 What about E-mail? HTML Email: * The most common email formats are HTML and Plain Text. * HTML-formatted email is usually easier to navigate through links, headings, and tables if created with accessibility in mind. Slide#32 What about E-mail? HTML Email: * Accessible emails in an HTML format enable the recipient to use the full functionality of their assistive technology. * If the HTML-based email contains non-text elements such as images or links, then they must include alternative text descriptions ("alt-attribute") so that the information will make sense. Slide#33 What about E-mail? Plain Text Email: * Plain Text emails are accessible to recipients that require assistive technology to read the content. * When several links are included within the email, screen reader technologies are apt to read the URL links without associating any textual description to those links. Slide#34 What about E-mail? Plain Text Email: * This tedious task requires a screen-reader user to navigate through the entire message to determine which link is associated with which text. * If the plain text email contains dialog from forwarded messages, then those messages may include different symbols (such as the "greater-than symbol") to represent headings or the beginning of paragraphs. * Screen-reader technologies read each individual character aloud creating extraneous noise. Slide#35 What about Listservs? To create an accessible listserv, make sure that: * A text equivalent for every non-text element shall be provided (e.g., via “alt”, “longdesc”, or in element content). * Listervs contain equivalent alternatives if they include any embedded multimedia presentation. These equivalent alternatives shall be synchronized with the presentation. Slide#36 What about Listservs? To create an accessible listserv, make sure that: * HTML-formatted listervs should be designed so that all information conveyed with color is also available without color, for example from context or markup. * HTML-formatted listervs should be organized so they are readable without requiring an associated style sheet. Slide#37 What about Listservs? To create an accessible listserv, make sure that: * Row and column headers should be identified for any data tables contained within HTML-formatted listservs. * Use Markup language to associate data cells and header cells for listserv data tables that have two or more logical levels of row or column headers. Slide#38 What about Listservs? To create an accessible listserv, make sure that: * HTML-formatted listserv content should not cause the screen to flicker with a frequency greater than 2 Hz and lower than 55 Hz. * Provide a text-only e-mail attachment, with equivalent information or functionality, to make HTML-formatted listservs accessible, when compliance cannot be accomplished in any other way. Slide#39 What about Listservs? To create an accessible listserv, make sure that: * Design listserv content that utilizes scripting languages to display content, or to create interface elements, so that the information provided by the script is identified with functional text that can be read by assistive technologies. Slide#40 What about Listservs? To create an accessible listserv, make sure that: * When a listserv requires that an applet, plug-in or other application be present on the client system to interpret page content, provide a link to a plug-in or applet that complies with Section 508 [1194.21(a) through (l)]. * Provide a method that permits listserv subscribers to skip repetitive navigation links if present. Slide#41 What about the Web? * Validate to XHTML 1.0 Strict * Use Cascading Style Sheet (CSS) and make sure to validate your CSS code! Slide#42 What about the Web? Careful using JavaScript… Issues include: * Navigation: Inability or difficulty navigating using a keyboard or assistive technology. * Hidden content: Presentation of content or functionality that is not accessible to assistive technologies. Slide#43 What about the Web? Careful using JavaScript… Issues include: * User control: Lack of user control over automated content changes. * Confusion/Disorientation: Altering or disabling the normal functionality of the user agent (browser) or triggering events that the user may not be aware of. Slide#44 What about the Web? Broken Hyperlinks: * Outdated web content may not have the most up-to-date links to external information. * Web sites heavy with external links are most prone to this dilemma. * If information on your web site is not current, visitors are likely to go somewhere else to get the information they are seeking. Slide#45 What about the Web? Color Contrast: * People with color blindness and low-vision may not be able to clearly read or understand web content that has poor contrast. * Be careful with Red and Green! Slide#46 What about the Web? Luminosity: * Sometimes color combinations do not provide sufficient contrast between background and foreground colors. Slide#47 What about the Web? Photosensitive Epilepsy and Animations: * Some web animations or video may cause seizures to people with Epilepsy. * Content that contains video or animation should be evaluated, especially if that content contains flashing or rapid transitions between light and dark background colors. Slide#48 What about the Web? Bandwidth: * Web pages that have not been optimized for easy download through slow modem connections quickly frustrate visitors and online customers -turning them away to resort to other alternative websites for information. * This includes large downloadable files such as PDF, video, audio and image files. Slide#49 What about the Web? Image Optimization: * Image file size can quickly bloat a website if not properly optimized. * Remove unused pixels. * Change the overall size of the image so it downloads faster while remaining viewable and undistorted. Slide#50 What about the Web? The following list addresses key features of web development that enhance the accessibility and compliance with state and federal web accessibility standards. They are in no particular order of priority, and each is equally as important as the rest. Slide#51 What about the Web? * A visible “skip to” navigation feature should exist at the top of each web page. This should be the first link that a visitor arrives to and allow access to content, accessibility features used within the website, and to the footer. * For example: skip to: content | site accessibility for this website | footer Slide#52 What about the Web? Alt-attributes should not include the following words within their description: * “image of”, “picture of”, “.JPEG of”, “.GIF of” or “Photo of”. * Instead, label exactly what the image is (“Mickey Mouse” instead of “Picture of Mickey Mouse”). Slide#53 What about the Web? * For alt-attributes describing structural images that do not contribute any meaning, such as a white 2x2 pixel spacer, use empty-quotes (“”) without any description. For example: “” Slide#54 What about the Web? Make the search engine accessible and format input elements and buttons in a logical reading order. * The title should come first, followed by the search field visibly labeled as “” to describe what input is needed. This should disappear (use the “onmousedown” event handler) when the user clicks in the field to type their search word. * Place the search button after the search within “yourwebsite.com” radio button. * Use relative sizing for the button and field size instead of static or exact sizing. Slide#55 What about the Web? If incorporating an accessibility feature such as: * “Click to change text size to: small| medium| large” * Be sure to use the title-attribute to provide greater meaning to the destination of these one-word links for when screen reader technologies are set to navigate by hyperlink-only mode. Slide#56 What about the Web? * Translation tools such as “Babelfish” are not accessible to people who are blind and should be removed. * If translation is going to be offered, then content should be translated by qualified interpreters * Incorporate translated textual images, text on buttons and labels, and translated alt-attribute descriptions. Slide#57 What about the Web? * Remove the redundant words “click here” from all alt-attributes descriptions. Instead, provide concise and meaningful descriptions for hyperlinked content to minimize confusion. * Alt-attribute descriptions should contain 7-81 characters. If more characters are needed, then the “longdesc” attribute or a “d-link” should be used. Slide#58 What about the Web? All adjacent hyperlinks should be separated with a non-hyperlinked dash or hyphen so that the two links are not perceived as one single link if the content is significantly magnified for someone with low-vision. * Example: Instead of: SmallMediumLarge, use: Small| Medium|Large * Add a hyperlink to navigate to the top of the page from the footer (“Top of page”). Slide#59 What about the Web? Alt-attributes need to be understandable when read out of context. For example, hyperlinked images with the alt-attribute of “Click here to start” are not accessible. * Imagine a webpage with ten adjacent links and images featuring links to various services and applications. * If each image and/or hyperlink has an alt-attribute labeled as “Click here to start”, then a screen reader operating in “hyperlink mode” will read “Click here to start” ten times and not offer the user much insight into what each link is. Slide#60 What about the Web? * It is important for the web developer to understand that a screen reader navigating from hyperlink to hyperlink cannot associate any meaning that may be intended by placement or color. * Directions or cues to the user should be very clear so as not to leave the individual guessing as to what is expected of him or her. Slide#61 What about the Web? * Styles should not be forced on the web page. User preferences should be allowed to override the webmaster’s styles. * Therefore, external cascading style sheets should be used for each webpage. This is done be creating a link to the style sheet from within the header area of the XHTML code. For example: Slide#62 What about the Web? As a best practice, any defaulted font sizes for the content should be set to at least 12 point font. * This will be appreciated by the many “aging eyes” that might choose to visit the website. Slide#63 What about the Web? Web pages should be coded to XHTML Strict 1.0. * This allows for fewer validation errors, better browser compatibility across the board, and easier maintenance in general. Slide#64 What about the Web? * Identify row and column headers for data tables. For complex data tables with two or more logical levels of row or column headers be sure to use markup to associate the data cells and header cells. * Make sure web pages utilizing scripts (such as JavaScript) run when scripts are disabled from the user’s web browser. * Provide both a Rich Text Format (.RTF) and a Microsoft Word (.doc) copy of downloadable documents when possible. Slide#65 What about the Web? Make sure videos are captioned whenever possible. * Otherwise, provide a text-equivalent transcript of the video. Slide#66 What about the Web? All pages should be tested, whenever possible, by live users with disabilities representing a diverse range of disability types such as: * Total blind screen-reader user * Low-vision, magnifies the screen to access * Color blind user * User with dyslexia * Non-mouse users (keyboard-navigation only) * Deaf and hard of hearing Slide#67 What about the Web? Identify content headings accordingly in order to assist screen reader users in navigating through website content, especially lengthy web pages. * It can be very frustrating when a web page does not have headings to assist one in finding the different sections of content. Slide#68 What about the Web? Remember--testing should be performed before uploading or updating any content to the web. * Automated testing utilities lack the human experience, are unable to test every Section 508 standard, and may deliver erroneous results. * However, automated testing utilities, when paired with human testers, can be very effective. Slide#69 What else can we do? It is important, as a start, to: * Train all content creators * Create accessibility policy with top-level buy-in. * Do not procrastinate! Slide#70 What’s in it for us? Visitors with disabilities generate revenue. * Content providers vastly underestimate this market. * Online shopping and services are very important to people with disabilities, who often can't drive or face other difficulties shopping in a brick-and-mortar environment. * Companies that fail to reach this market are losing out on a powerful source of revenue and a key demographic of loyal repeat-customers. Slide#71 What’s in it for us? Reach a larger audience. * Approximately one in five Americans (20%) has some type of disability, and as the country ages that percentage is expected to increase. * People with disabilities span ethnic, economic and geographic boundaries. * Failing to provide access to this diverse and numerous segment of the American population is contrary to the interests of anyone providing online content or services. Slide#72 What’s in it for us? It's the law. * Failure to take reasonable steps to provide access to web content for visitors with disabilities is a violation of the ADA and Section 508. * Content providers who do not comply with these laws may be subject to costly lawsuits that invariably lead to the revision of the web content, loss of government funding, or termination of government contracts. Slide#73 What’s in it for us? It's not as difficult as you might think. * Many web content providers don't provide access for the people with disabilities because they believe that the cost of updating their site to bring it "up to code" is prohibitive, or that their web site's visual appeal will suffer adversely from the changes. * This is simply untrue. * Compared with potential revenues generated by visitors with disabilities, the cost of revamping web content to meet accessibility standards is insignificant and need not interfere with the site's appearance at all. Slide#74 Policies and Procedures Organizations should have effective policies and procedures in place and publically posted to ensure that people with disabilities have access to information. Four Policies and procedures to include: * Accessibility Help * Accessibility Policy * Reasonable accommodation and alternative format request policy and procedures * Privacy Policy Slide#75 Policies and Procedures Post policies and procedures to your website and make them available for distribution as print and electronic document formats. Slide#76 Policies and Procedures Accessibility Help: Describes accessibility features incorporated in the design of your website to help a visitor with a disability make the most of these features while using their assistive technologies. Slide#77 Policies and Procedures Accessibility Policy: Describes steps taken to deliver accessible content. Slide#78 Policies and Procedures Reasonable accommodation and alternative format request policy and procedures: * Describes how an individual may request alternative formats and timelines needed to provide alternative formats of Web content. * Be sure to include phone and TTY numbers, mailing address, and email address. Slide#79 Policies and Procedures Privacy Policy: Describes steps taken by your organization to ensure that any information provided electronically will remain private and secure. Slide#80 Resources * The Access Board: Section 508 (1194.22 a-p) * Website: www.section508.gov * “The Accessibility Checklist” –Neal Albritton Request a copy from the Alliance for Technology Access: * E-mail: ATAinfo@ATAccess.org * Phone: (800) 914-3017 * TTY: (707) 778-3015) Slide#81 Questions? Slide#82 Contact Information Neal AlbrittonADCS LLC Phone: (916) 947-9008 Fax: (916) 689-8219 Email: neal@Section508Guru.com Web: http://www.section508guru.com Conclusion: Thank You for Your Attention Today Please complete the evaluation form at: http://ada-conferences.March102010eval.sgizmo.com You may also send comments and/or suggestions to: jpete@uic.edu Next Session is May 12, 2010 “Successful Accommodations: Assistive Technology and Accessibility Working Together