section 508 ada compliance for websites

8/8/2019 Section 508 ADA Compliance for Websites

1/20

!"#$%& (#(&"

#)# *+,-./0123 4+5 6378/938!"#$"%#& ()*+,-.* /01 20*3+."# 4"15&.&1* ")6 7&% 8&9


2/20

Executive Summary

! One out of every five Americans have some form of a recognizeddisability.

! Hospital facilities have accommodations for disabled individualshowever their digital presence, even among the top brands, often

fails to facilitate visits from this population.

! Increasingly physicians are becoming sensitive to the interactiveneeds of their disabled patients and are challenging healthcare

marketers and IT teams for enablement.

! Moreover initiatives receiving Federal funding MUST be fully ADAcompliant.

! Net/Net marketers must provide a digital environment that is barrierfree and enhances the customer experience for all visitors.

! Acsys has best practices and experience to accelerate your ADAinitiatives.


3/20

What If

You Could Increase Your Website Audience, Repeat Visits

and Conversions By Up To 20%?

You Can Reach an Audience That Has Twice The

Discretionary Spending Power?

You probably run into the Americans With Disability Act every day. Yourhospital has ramps for wheelchairs; the elevator has Braille buttons forselecting the floor; your interpreter services offers signing; your parentsmay have a cell phone with large buttons; and your favorite location forviewing the game has multiple TV screens with closed-captioning.

Marketers know -- but sometimes forget -- that people with disabilitieshave the same range of preferences, perceptions, attitudes, habits andneeds that drive consumer behavior of people without disabilities. Howeverthis is a population that is often overlooked by marketers. Yet technologythat may be the single greatest asset to disabled people. Designers oftenlack the motivation or awareness to ensure that websites become outfittedfor the disabled.

This white paper provides a background on ADA compliance and will show

how healthcare marketers and IT teams can take simple steps in the designof their interactive content to reach a segment that can become the mostloyal audience and prospective consumer of services. The appendix is avaluable how to reference and provides a list of some free Web basedresources that you can use to check your own site for compliance.

Background

On August 7, 1998, the Workforce Investment Act of 1998, which includesthe Rehabilitation Act Amendments of 1998, was signed into law. Section508 of the Rehabilitation Act Amendments requires that when Federaldepartments or agencies develop, procure, maintain, or use electronic andinformation technology, they must ensure that the technology is accessibleto people with disabilities, unless an undue burden would be imposed onthe department or agency. On June 21, 2001 Section 1194.22 was enactedfor Web-based Intranet and Internet Information and Applications;


4/20

providing standards for Federal agencies to follow when producing webpages. The regulations must be adhered to unless doing so would result inan undue burden.

What The Standards Cover

Section 1194.22 consists of 16 subsections that address mainly technicalparameters of web page programming:

(a) Text Tags(b) Multimedia Presentations(c) Color(d) Readability(e) Server-Side Image Maps

(f) Client-Side Image Maps(g)&(h) Data Table(i) Frames(j) Flicker Rate(k) Text-Only Alternative(l) Scripts(m) Applets and Plug-Ins(n) Electronic Forms(o) Navigation Links(p) Time Delays

In general these are standards that are a generally accepted best practicesfor design. However problems can exist when alternate tags have not beenconsistently utilized through out a web site, or when graphic designers mayhave utilized rapidly changing scenes or animations which exceed thestandards for flicker rates which can have the unwarranted effect oftriggering seizures in some visitors which specific medical conditions.

The appendix contains explains the rationale behind these

requirements and offers code level examples for complying withthe standards.


5/20

Why The Standards Are Important To Hospital Marketers

The latest Census Report (2005) indicates that 54.4 Million out of 296Million US residents have some form of recognized disability this wasroughly 1 out of every 5 people.

Key data points from this report yield the following insights:

These 54.4 million Americans are roughly equal to the combinedtotal populations of California and Florida.

28,000,000 (10% of population) are deaf or hearing impaired. 11,400,000 people have visual conditions not correctable by glasses. 6,400,000 new cases of eye disease occur each year. 2,800,000 people are visually handicapped from color blindness. 1,100,000 people are legally blind.

The current estimate of the US population is 307 Million so

the above numbers are much higher now.


6/20

Under ADA, Hospital facilities are required to have physicalaccommodations for these disabled visitors who may represent a significantportion of the patient population they are treating. It is only logical thathospital marketers would be able to reach this population who isconducting an on-line virtual visit to their institution. As an examplepatient with hearing disabilities may have extreme value in being able toview a closed-captioned video discussion of a cochlear ear implant surgicalprocedure. The manager of consumer health information for the NationalLibrary of Medicines MedlinePlus.gov shares,

Of course being a non-governmental organization a hospital

doesn't have to (legally) comply, but it seems like a good idea to

at least check on the issues to serve this audience.

When is compliance mandated?

As noted above the regulations apply to governmental organizations. Theyalso apply to any website content which is being developed as part of aFederally funded initiative. As a healthcare institution, you may have beenthe fortunate recipient of grants from the Health and Human Services aspart of the American Recovery & Reinvestment Act (ARRA) or from theCenter For Disease Control (CDC) a particular research project which willinvolve a reporting requirement. While this report will have specificformatting requirements under Section 508, if communication of thisproject involves an intranet or public website, then compliance is required.The onus is clearly going to be on the marketer to stay aware of anyFederal funds their hospital is receiving for research and understandreporting requirements attached to the grant especially if the grant is beinguse to fund the creation of on-line content.

The Mobile Web

Fast-forward to 2010 and the mobile Web that didnt exist in 2001.

Currently Section 508 compliance for mobile sites is a gray area. Somesmart phones have built in accessibility text-to-voice software (iPhone 3GSand Nexus One), and third-party developers have similar apps forWindows Mobile phones. We reached back out to the National Library ofMedicine to ask how it handled the mobile site for its highly trafficked Website, MedlinePlus.gov. The National Library of Medicine said that it didntstrive to make the mobile site completely 508 compliant because it is not a


7/20

separate Web site but a derivative of the complete MedlinePlus, which iscompliant with Section 508. This approach appears to be very logical.

Considerations For Video

The standards for video require that closed-captioning be employed in syncwith the respective audio. These requirements apply to both on-demandand live streaming video. This is achieved via the creation of a time-stamped transcript, which is converted to a file that is displayed within thevideo player, typically as an optional CC view. Marketers have usedcommercial captioning services, such as CaptionMax or LNS Captioning, toproduce the requisite assets. This was at times a burdensome andsomewhat costly process.

The good news is that Googles YouTube platform is now making thisprocess easier with the roll out of auto-captions. This service was testedlast November on a limited basis; it now is available to all videos uploadedto YouTube where English is spoken. This is a fantastic step forward foraccessibility for deaf Internet users. Says Google Vice President Vint Cerf,who is hearing impaired himself:

Google believes that the worlds information should be

accessible to everyone. One of the big challenges of the

video medium is whether it can be made accessible to

everyone.

YouTube is relying on Googles Speech Technology, which isnt perfect;auto-captions require a clearly spoken audio track so videos withbackground noises or where the speaker uses a muffled voice cant beauto-captioned. Auto-captions arent perfect and just like any othertranscription, the owner of the video needs to check to make sure theyreaccurate and manually correct the captioned text file as required. In othercases, the audio file may not be good enough to generate auto-captions.

The auto-captioning makes the videos accessible not just to deaf people,but also to viewers around the world, who can translate any video thats inEnglish to another language. This feature alone can help hospital marketersreach non-English speaking audiences again the translations will be madeusing machine language software so they will not necessarily be culturallyaccurate.


8/20

An example of YouTubes closed-captioning.

SEO Benefits from Closed Captioning

Search engine spiders can not index the actual content of a video file asthey are only able to index text whether on the a website or in themetadata of a video. When the auto-captioning feature on YouTube is used,a transcript is created and becomes a part of the metadata of the video.That text then appears as closed-captions on the bottom of the video forthe viewers. Since the transcript generated by auto-captioning is now a partof the metadata, the spiders can now index the content of the video.Finally, a way to truly utilize SEO for video.

Tip: If you intend on embedding your video from YouTubeon your companys website, you can download the

transcript from YouTube and post it on the same page as

the video. This will provide another opportunity for the

spiders to index your content, increasing your companys

ranking on the SEO ladder.


9/20

The ADA and Future Requirements

The Federal Government has established an Access Board to publishexisting standards and periodically review and, as appropriate, amend thestandards often taking into consideration harmonization with efforts takingplace around the globe. The Access Board is currently reviewing many newprovisions that will bring the Standards into harmonization with WCAG 2.0guidelines. You can review these proposals at http://www.access-board.gov/sec508/refresh/notice.htm#i4

Further Reference

The U.S. Department of Health & Human Services has created a Section508 portal which is an excellent reference.http://www.hhs.gov/web/508/index.html

Next Steps

Contact us for a full ADA Audit and Analysis of your website.

Alex Fraser

Senior Healthcare [email protected]


10/20

FREE - Tools For The Analysis of Web Sites

TAW is a tool offered by the CTIC Foundation based in Spain that providesa check against W3C Standards versions WCAG 1.0, WCAG 2.0, as well asmobile accessibility. http://www.tawdis.net/ingles.html?lang=en

A compliance check of MayoClinic.com using the TAW tool.

The University of Toronto has an open source code checker athttp://achecker.ca/checker/index.php

http://www.totalvalidator.com/ offers a desktop tool and Firefox plug-in inaddition to a free Web based service.


11/20

Appendix Provisions, Rationale, Examples

(a) A text equivalent for every non-text element shall be

provided (e.g., via "alt", "longdesc", or in element content)

What is meant by a text equivalent? A text equivalent means adding words to represent the purpose of a

non-text element. This provision requires that when an imageindicates a navigational action such as "move to the next screen" or"go back to the top of the page," the image must be accompanied byactual text that states the purpose of the image. This provision alsorequires that when an image is used to represent page content, theimage must have a text description accompanying it that explains themeaning of the image.

How much information actually needs to be in the text

equivalent? The text information associated with a non-text element should,

when possible, communicate the same information as its associatedelement. For example, when an image indicates an action, the actionmust be described in the text. The types of non-text elementsrequiring actual text descriptions are limited to those elements thatprovide information required for comprehension of content or those

used to facilitate navigation. Web page authors often utilizetransparent graphics for spacing. Adding a text description to theseelements will produce unnecessary clutter for users of screenreaders. For such graphics, an empty ALT attribute is useful.

What is meant by the term, non-text element? The text information associated with a non-text element should,

when possible, communicate the same information as its associatedelement. For example, when an image indicates an action, the actionmust be described in the text. The types of non-text elements

requiring actual text descriptions are limited to those elements thatprovide information required for comprehension of content or thoseused to facilitate navigation.

How should audio presentations be treated?

This provision requires that when audio presentations are availableon a multimedia web page, the audio portion must be captioned.


12/20

Audio is a non-textual element, so a text equivalent of the audiomust be provided if the audio is part of a multimedia presentation,Multimedia includes both audio and video. If the presentation is audioonly, a text transcript would meet this requirement.

(b) Equivalent alternatives for any multimedia presentation

shall be synchronized with the presentation.

What are considered equivalent alternatives? Captioning for the audio portion and audio description of visual

information of multimedia presentations are considered equivalentalternatives. This provision requires that when an audio portion of amultimedia production is captioned, as required in provision (a), thecaptioning must be synchronized with the audio. Synchronized

captioning would be required so someone reading the captions couldalso watch the speaker and associate relevant body language with thespeech.

If a website offers audio files with no video, do they have to

be captioned? No, because it is not multimedia. However, since audio is a non-text

element, a text equivalent, such as a transcript, must be available.Similarly, a (silent) web slide show presentation does not need to

have an audio description accompanying it, but does require textalternatives to be associated with the graphics.

(c) Web pages shall be designed so that all information

conveyed with color is also available without color, for

example from context or markup.

Why is this provision necessary When colors are used as the sole method for identifying screen

elements or controls, persons who are color blind as well as those

people who are blind or have low vision may find the web pageunusable

Does this mean that all pages have to be displayed in black

and white? No, this provision does not prohibit the use of color to enhance

identification of important features. It does, however, require that


13/20

some other method of identification, such as text labels, must becombined with the use of color. This provision addresses not onlythe problem of using color to indicate emphasized text, but also theuse of color to indicate an action. For example, a web page thatdirects a user to "press the green button to start" should also identifythe green button in some other fashion than simply by color.

(d) Documents shall be organized so they are readable

without requiring an associated style sheet.

What are the potential problems posed by style sheets? Style sheets can enable users to define specific viewing preferences

to accommodate their disability. For instance, users with low visionmay create their own style sheet so that, regardless of what web

pages they visit, all text is displayed in an extra large font with whitecharacters on a black background. If designers set up their pages tooverride user-defined style sheets, people with disabilities may not beable to use those pages.

For good access, therefore, it is critical that designers ensure thattheir web pages do not interfere with user-defined style sheets.Ingeneral, the "safest" and most useful form of style sheets are"external" style sheets, in which the style rules are set up in aseparate file.

An example of an external style sheet is:Example of source code:


14/20

own alternative text, just like a picture can have alternative text. Bycontrast, clicking on a location of a server-side image map onlyspecifies the coordinates within the image when the mouse wasdepressed. The ultimate selection of the link or URL must bedeciphered by the computer serving the web page

Why is this provision necessary? When a web page uses a server-side image map to present the user

with a selection of options, browsers cannot indicate to the user theURL that will be followed when a region of the map is activated.Therefore, the redundant text link is necessary to provide access tothe page for anyone not able to see or accurately click on the map.

(f) Client-side image maps shall be provided instead of

server-side image maps except where the regions cannot bedefined with an available geometric shape.

Why do client-side image maps provide better accessibility? Unlike server-side image maps, the client-side image map allow an

author to assign text to each image map hot spots. This featuremeans that someone using a screen reader can easily identify andactivate regions of the map.

(g) Row and column headers shall be identified for datatables.

(h) Markup shall be used to associate data cells and header

cells for data tables that have two or more logical levels of

row or column headersWhy are these two provisions necessary?

Paragraphs (g) and (h) permit the use of tables, but require that thetables be coded according to the rules of the markup language beingused for creating tables. Large tables of data can be difficult to

interpret if a person is using a non-visual means of accessing the web.Users of screen readers can easily get "lost" inside a table because itmay be impossible to associate a particular cell that a screen readeris reading with the corresponding column headings and row names.

Section 1194.22 (g) and (h) state that when information is displayedin a table format, the information shall be laid out using appropriatetable tags as opposed to using a preformatted table in association


15/20

with the "" tag. Web authors are also required to use one ofseveral methods to provide an association between a header and itsrelated information.

How can HTML tables be made readable with assistive

technology? Using the "Scope" Attribute in Tables Using the "scope" attribute is

one of the most effective ways of making HTML compliant with theserequirements. It is also the simplest method to implement. The scopeattribute also works with some (but not all) assistive technology intables that use "colspan" or "rowspan" attributes in table header ordata cells.

Using the Scope Attribute The first row of each table shouldinclude column headings. Typically, these column headings are

inserted in tags, although tags can also be used. Thesetags at the top of each column should include the followingattribute:scope="col

By doing this simple step, the text in that cell becomes associatedwith every cell in that column. Unlike using other approaches(notably "id" and "headers") there is no need to include specialattributes in each cell of the table. Similarly, the first column of everytable should include information identifying information about eachrow in the table. Each of the cells in that first column are created byeither or tags. Include the following attribute in thesecells:scope="row"By simply adding this attribute, the text in that cellbecomes associated with every cell in that row. While this techniquedramatically improves the usability of a web page, using the scopeattribute does not appear to interfere in any way with browsers thatdo not support the attribute.

(i) Frames shall be titled with text that facilitates frame

identification and navigation.

Why is this provision necessary? Frames provide a means of visually dividing the computer screen into

distinct areas that can be separately rewritten. Unfortunately, frames can also present difficulties for users with

disabilities when those frames are not easily identifiable to assistivetechnology.


16/20

For instance, a popular use of frames is to create "navigational bars"in a fixed position on the screen and have the content of the web siteretrievable by activating one of those navigational buttons.

The new content is displayed another area of the screen. Because thenavigational bar doesn't change, it provides a stable "frame-of-reference" for users and makes navigation much easier. However,users with disabilities may become lost if the differences between thetwo frames are not clearly established.

(j) Pages shall be designed to avoid causing the screen to

flicker with a frequency greater than 2 Hz and lower than 55

Hz.

Why is this provision necessary?

This provision is necessary because some individuals withphotosensitive epilepsy can have a seizure triggered by displays thatflicker, flash, or blink, particularly if the flash has a high intensity andis within certain frequency ranges.

The 2 Hz limit was chosen to be consistent with proposed revisionsto the ADA Accessibility Guidelines which, in turn, are beingharmonized with the International Code Council (ICC)/ANSI A117standard, "Accessible and Usable Buildings and Facilities", ICC/ANSIA117.1-1998 which references a 2 Hz limit. An upper limit wasidentified at 55 Hz.

How can flashing or flickering elements be identified? Flashing or flickering elements are usually added through

technologies such as animated gif's, Java applets, or third-party plug-ins or applications.

Java applets and third party plug-ins can be identified by the presenceof or tags.

Animated gif's are images that download in a single file (like ordinaryimage files), but have content that changes over short periods of

time. Like other images, however, they are usually incorporatedthrough the use of the tag.

(k) A text-only page, with equivalent information or

functionality, shall be provided to make a web site comply

with the provisions of these standards, when compliance

cannot be accomplished in any other way. The content of


17/20

the text-only page shall be updated whenever the primary

page changes.

What must a text-only page contain to comply with this

provision? Text-only pages must contain equivalent information or functionality

as the primary pages. Also, the text-only page shall be updated whenever the primary page

changes. Example HTML source code:

Text Only

(l) When pages utilize scripting languages to display content,or to create interface elements, the information provided

by the script shall be identified with functional text that can

be read by assistive technology.

What accessibility problems can scripts cause? Web page authors have a responsibility to provide script information

in a fashion that can be read by assistive technology. When authors do not put functional text with a script, a screen

reader will often read the content of the script itself in a meaninglessjumble of numbers and letters. Although this jumble is text, it cannot be interpreted or used.

How can web developers comply with this provision? Web developers working with JavaScript frequently use so-called

JavaScript URL's as an easy way to invoke JavaScript functions. Typically, this technique is used as part of anchor links

(m) When a web page requires that an applet, plug-in or

other application be present on the client system tointerpret page content, the page must provide a link to a

plug-in or applet that complies with 1194.21(a) through (l)

Why is this provision necessary? While most web browsers can easily read HTML and display it to the

user, several private companies have developed proprietary file


18/20

formats for transmitting and displaying special content, such asmultimedia or very precisely defined documents.

Because these file formats are proprietary, web browsers cannotordinarily display them.

To make it possible for these files to be viewed by web browsers,add-on programs or "plug-ins" can be downloaded and installed onthe user's computer that will make it possible for their web browsersto display or play the content of the files.

This provision requires that web pages that provide content such asReal Audio or PDF (Adobe Acrobat's Portable Document Format)files also provide a link to a plug-in that will meet the softwareprovisions.

It is very common for a web page to provide links to needed plug-ins.For example, web pages containing Real Audio almost always have a

link to a source for the necessary player. This provision places a responsibility on the web page author to

know that a compliant application exists, before requiring a plug-in.

(n) When electronic forms are designed to be completed on-

line, the form shall allow people using assistive technology

to access the information, field elements, and functionality

required for completion and submission of the form,

including all directions and cues.

Why do electronic forms present difficulties to screen

readers? Currently, the interaction between form controls and screen readers

can be unpredictable, depending upon the design of the pagecontaining these controls.

HTML forms pose accessibility problems when web developersseparate a form element from its associated label or title.

For instance, if an input box is intended for receiving a user's lastname, the web developer must be careful that the words "last name"

(or some similar text) appear near that input box or are somehowassociated with it.

Although this may seem like an obvious requirement, it is extremelyeasy to violate because the visual proximity of a form element and itstitle offers no guarantee that a screen reader will associate the twoor that this association will be obvious to a user of assistivetechnology.


19/20

How can developers provide accessible HTML forms?

The first rule of thumb is to place labels adjacent to input fields, notin separate cells of a table.

For the web developer who does not wish to place form elementsimmediately adjacent to their corresponding titles, the HTML 4.0specification includes the tag that lets web developersmark specific elements as "labels" and then associate a form elementwith that label.

There are generally two ways to use the label tag: explicit labels andimplicit labels.

Experience has shown that implicit labeling should be avoided fortwo reasons. First, implicit labeling is not reliably supported by manyscreen readers and, in particular, does not work well if explicit labels

are simultaneously used anywhere on the same web page. Often, theoutput can be wildly inaccurate and confusing. Second, if any textseparates a label from its associated form element, an implicit labelbecomes impractical and confusing because the label itself is nolonger easily identified with the form element.

(o) A method shall be provided that permits users to skip

repetitive navigation links.

Why do navigational links present impediments to screen

readers and other types of assistive technologies? This provision provides a method to facilitate the easy tracking of

page content that provides users of assistive technology the optionto skip repetitive navigation links.

Web developers routinely place a host of routine navigational links ata standard location often across the top, bottom, or side of a page.

If a nondisabled user returns to a web page and knows that he or shewants to view the contents of that particular page instead of selectinga navigation link to go to another page, he or she may simply look

past the links and begin reading wherever the desired text is located. For those who use screen readers or other types of assistive

technologies, however, it can be a tedious and time-consuming choreto wait for the assistive technology to work through and announceeach of the standard navigational links before getting to the intendedlocation. In order to alleviate this problem, the section 508 rule


20/20

requires that when repetitive navigational links are used, there mustbe a mechanism for users to skip repetitive navigational links.

(p) When a timed response is required, the user shall be

alerted and given sufficient time to indicate more time is

required.

Why do timed responses present problems to web users

with disabilities? Web pages can be designed with scripts so that the web page

disappears or "expires" if a response is not received within aspecified amount of time.

Sometimes, this technique is used for security reasons or to reducethe demands on the computer serving the web pages. Someone's

disability can have a direct impact on the speed with which he or shecan read, move around, or fill in a web form.

For instance, someone with extremely low vision may be a slower-than-average reader. A page may "time out" before he is able to finishreading it.

Many forms, when they "time out" automatically, also deletewhatever data has been entered.

The result is that someone with a disability who is slow to enter datacannot complete the form.

For this reason, when a timed response is required, the user shall bealerted via a prompt and given sufficient time to indicate whetheradditional time is needed.