Web Uses For People With Disabilities Computer Science Essay

Published: Last Edited:

This essay has been submitted by a student. This is not an example of the work written by our professional essay writers.

This chapter concentrates on the concerning issues and previous studies related to providing alternative description of images. It starts off by reviewing the issue of how blind people use Web and then giving brief overview of Web accessibility and its guidelines. Various problems faced by blind people while accessing web, different types of images on web pages, importance of describing images, and ways of providing alternate description of images are also discussed in detail. It concludes with brief discussion over previous research, different tools supporting web developers and aims for the current study.

2.2 How blind people use the Web:

People with visual impairment or complete blindness use screen readers to access the Web. Screen readers are 'software used by individuals who are blind or who have dyslexia that interprets what is displayed on a screen and directs it either to speech synthesis for audio output or to refreshable Braille for tactile output' (W3C, 2005). Normally it reads aloud all text content, as well as the types and states of complex Webpage elements e.g., 'textbox blank', 'list with 10 items', etc. (Borodin, Bigham, Dausch, Ramakrishnan, 2010) .

However a screen reader not only reads what is on the screen but allows users to navigate through the web content in many ways such as (WebAIM, 2010):

' Read everything in linear way top to bottom

' Using tab key users can navigate from link to link

' Move from one heading to another

' Move from one frame to another

JAWS and Window Eyes are some of the most commonly used screen readers. (WebAIM, 2010)

Similarly, people with some degree of residual vision (partial or low vision) use screen magnifiers to access the Web. Screen Magnifier is software which magnifies a portion of the screen for easier viewing. It also makes presentations larger, and reduces the area of the document that may be viewed by removing surrounding context. Some screen magnifiers offer two views of the screen: one magnified and one default size for navigation (W3C, 2005).

With the help of technology now blind people can do all their work independently for example: reading newspaper, magazine, bank statements etc. Screen readers have made life easier and comfortable to use the Web for blind people.

2.3 Web Accessibility:

'Web Accessibility means that people with disabilities can use web. More specifically, web accessibility means that people with disabilities can perceive, understand, navigate and interact with the web and that they can contribute to the web'(WAI, 2005).Web accessibility is important to be taken into consideration so that the Web should be accessible to all users including people with any disabilities. The main motive behind web accessibility is to design web sites which are easily adaptable by all web users. It is important in order to provide equal access and opportunity to the people with disabilities

Many web pages are not comfortably accessible by people with disabilities, which makes it difficult for such users to contribute to the Web. This is probably a big issue to be considered. There are millions of people with disabilities that affect their use of the Web. Besides people with disabilities web accessibility is also beneficial for people without disabilities. 'A primary goal of web accessibility is websites that are flexible, adaptable and usable to meet different user needs. This flexibility also increases general usability and let's people with disabilities use websites according to their preferences, such as using whichever browser they want and using keyboard shortcuts. Web accessibility also provides financial and technical benefits to organizations'(Henry, 2006). Another important aspect of accessible website is that, it is more likely to be compatible with new browsing technologies (ex: mobile phones, PDAs.), therefore accessible by many more users.

In order to make the web content more accessible there are guidelines for web developers to be followed while designing websites. These are Web Content Accessibility guidelines (WCAG 1.0) and WCAG 2.0. The main purpose of guidelines is that the issues related to accessibility are all discussed and solutions for accessible design are given.

2.4 Brief about Web Content Accessibility Guidelines (WCAG 1.0 & 2.0)

The Web Accessibility Initiative (WAI) of the World Wide Web Consortium (W3C) in late 1990's set out an international standard defining Web content accessibility for people with disabilities. The first version of guidelines WCAG 1.0 was set up in 1999 and the second version WCAG 2.0 were set up in 2008. These guidelines aim to show developers how to make web content accessible for people with disabilities. These guidelines are specially set up for Web content developers and developers of authoring tools (HTML editors, document conversion tools, tools that generate Web content from databases).

WCAG 1.0:

There are a total of 14 guidelines in WCAG 1.0. Each guideline has checkpoints and each checkpoint have priority levels namely Priority 1 (Satisfying this checkpoint is a basic requirement for some groups to be able to use Web documents.), Priority 2 (Satisfying this checkpoint will remove significant barriers to accessing Web documents.), Priority 3 (Satisfying this checkpoint will improve access to Web documents.). There are three levels of conformance Level A (all Priority 1 checkpoints are satisfied), Level Double-A (all Priority 1 and 2 checkpoints are satisfied), Level Triple-A (all Priority 1, 2, and 3 checkpoints are satisfied).

Level A conformance was a basic requirement for all groups to be able to use web documents. Level Double-A conformance indicated better accessibility and removal of significant barriers to accessing the content. Level Triple-A conformance provided improvements to web content accessibility.

The first guideline in WCAG 1.0 is:

'1.1 Text Alternatives: Provide text alternative for any non-text content so that it can be changed into other forms people need, such as large print, Braille, speech, symbols or simpler language' (WCAG 1.0,1999).

The five checkpoints under the first guideline are as follows:

'1.1 Provide a text equivalent for every non-text element (e.g., via "alt", "longdesc", or in element content). This includes: images, graphical representations of text (including symbols), image map regions, animations (e.g., animated GIFs), applets and programmatic objects, ascii art, frames, scripts, images used as list bullets, spacers, graphical buttons, sounds (played with or without user interaction), stand-alone audio files, audio tracks of video, and video. [Priority 1]

1.2 Provide redundant text links for each active region of a server-side image map. [Priority 1]

1.3 Until user agents can automatically read aloud the text equivalent of a visual track, provide an auditory description of the important information of the visual track of a multimedia presentation. [Priority 1]

1.4 For any time-based multimedia presentation (e.g., a movie or animation), synchronize equivalent alternatives (e.g., captions or auditory descriptions of the visual track) with the presentation. [Priority 1]

1.5 Until user agents render text equivalents for client-side image map links, provide redundant text links for each active region of a client-side image map. [Priority 3]'

WCAG 2.0:

There are four key principles in WCAG 2.0.

The principles are [POUR] as follows: (WCAG 2.0)

'P-Perceivable: Information and user interface components must be presentable to users in ways they can perceive.

O-Operable: User interface components and navigation must be operable.

U-Understandable: Information and the operation of user interface must be understandable

R-Robust: Content must be robust enough that it can be interpreted reliably by a wide variety of user agents, including assistive technologies (Ex: Screen readers)'

There are 12 guidelines and for each guideline a number of success criteria are set.

The first guideline under first principle Perceivable is:

'Guideline 1.1 Text Alternatives: Provide text alternatives for any non-text content so that it can be changed into other forms people need, such as large print, Braille, speech, symbols or simpler language' (WCAG 2.0).

The success criteria for the first guideline are:

'1.1.1 Non-text Content: All non-text content that is presented to the user has a text alternative that serves the equivalent purpose, except for the situations listed below. (Level A)

' Controls, Input: If non-text content is a control or accepts user input, then it has a name that describes its purpose

' Time-Based Media: If non-text content is time-based media, then text alternatives at least provide descriptive identification of the non-text content.

' Test: If non-text content is a test or exercise that would be invalid if presented in text, then text alternatives at least provide descriptive identification of the non-text content.

' Sensory: If non-text content is primarily intended to create a specific sensory experience, then text alternatives at least provide descriptive identification of the non-text content.

' CAPTCHA: If the purpose of non-text content is to confirm that content is being accessed by a person rather than a computer, then text alternatives that identify and describe the purpose of the non-text content are provided, and alternative forms of CAPTCHA using output modes for different types of sensory perception are provided to accommodate different disabilities.

' Decoration, Formatting, Invisible: If non-text content is pure decoration, is used only for visual formatting, or is not presented to users, then it is implemented in a way that it can be ignored by assistive technology.'

The success criterion must be satisfied in order to gain conformance level. The conditions that must be met for a Success Criterion to be satisfied are as follows:

' All Success Criteria must be important access issues for people with disabilities that address problems beyond the usability problems that might be faced by all users. In other words, the access issue must cause a proportionately greater problem for people with disabilities than it causes people without disabilities in order to be considered an accessibility issue (and covered under these accessibility guidelines).

' All Success Criteria must also be testable. This is important since otherwise it would not be possible to determine whether a page met or failed to meet the Success Criteria. The Success Criteria can be tested by a combination of machine and human evaluation as long as it is possible to determine whether a Success Criterion has been satisfied with a high level of confidence (WCAG 2.0).

The Success Criteria were assigned to one of the three levels of conformance by the working group after taking into consideration a wide range of interacting issues (Reid, Snow-Weaver, 2008).

2.5 Problems faced by blind people in using the Web:

Mostly the problems faced by blind people are due to the structure or design of a website while using the assistive technologies (such as screen reader). Despite the guidelines (e.g. Web Content Accessibility Guidelines) and laws are designed to ensure that all websites are accessible to all users, many web developers and many mainstream websites are not adhering to them.

While accessing the Web by using a screen reader blind people spend more time on a page than sighted people as the screen reader reads all content of the page in a linear way. In order to interpret images on a Web page, screen readers search for the HTML <IMG> element associated with images. If the IMG element is spotted by the screen reader then looks for the alternate description provided in the ALT attribute of the IMG element. The alternate description is read aloud for the user describing the image. It is been observed that the most common complaint for images without description was users experiencing frustration when screen reader informed them there was an image but description was not offered because of lack of ALT-text (Petrie, Harrison & Dev, 2005). Very often the ALT attribute for images is unhelpful as the alternative description provided for image is not related to content of page or not related to image. Incorrect or non-existent labeling of links, form elements and frames also create problem for screen reader users.

Incompatibility between screen readers and web sites (DRC, 2004). Some old version screen readers do not support image maps and so it is difficult for user to understand it (WebAIM, 2010). Some media do not have alternatives such as video that is not accompanied with a text or audio description (W3C, 2005).

2.6 Types of images on web pages:

As the use of the Web is increasing rapidly, web developers are using many images and animations on the websites to make it more attractive and visual.

There are different types of images on web pages serving different purpose with different functions. (Petrie, Harrison & Dev, 2005)

For example:

Informative image types:

' Informative: is an image that provides important information that is not explicit in the main text

' Graphic text: is an image with text information encoded in the image

' Advertisement: is an image that is a promotion for a company, organization, product or service other than that owning the web site

' Logo: is an image representing the company or organization

Decorative image types:

' Decorative: is an image that only adds to the aesthetic value or flavor of the page, the content of the image is not important.

' Spacer (filler): is an image that is indistinguishable as a discrete picture, for example 1-bit images that have an <IMG> tag in html but are not meaningful in themselves, or background images that cannot stand alone

2.7 Importance of describing images and missing image description:

As discussed in section 2.5 every IMG element has an ALT-text attribute which contains alternate description of images. If the ALT-text attribute is provided but is an empty string, (i.e. left blank: ALT =' ') the screen reader does not inform the user there is an image at all. ALT-text is easily added to HTML either directly or using the picture properties dialogs in web publishing software (Petrie, Harrison, Dev, 2005).


Figure 1: Syntax for ALT attribute.

The very first checkpoint of the World Wide Web Consortium's Web Accessibility Content Guidelines (WCAG1, 1999) as mentioned before states that a web site must 'Provide a text equivalent for every non-text content'. So it is necessary to describe all images on the page.

There are several reasons why a user cannot see the image: (Al-Rasbi, 2007)

' Person is blind, low sighted or color blind.

' Using text only browsers (e.g. Lynx or browsing from a mobile).

' Turn off images option on the browser because of slow internet connection.

If images are not displayed then the description for the images will be displayed. Thus suitable descriptions are necessary in such abnormal situation (i.e. where images are not displayed) in order to make the browsing experience convenient and adaptable for all the Web users. (Al-Rasbi, 2007)

We can distinguish three types of relationships between the information content of an image and an alt text:

1. text that just describes the image;

2. text that communicates verbally the same thing as the image;

3. ALT text that partially communicates the same thing as the image, hopefully the most important information. (Korpela, 2005)

If alt attribute is missing, then blind or low-sighted web users who cannot see the image will have problem to understand the purpose of image on the page.

For the missing ALT attribute of the img element the screen reader will just read the source file name for that image and the users will not understand the purpose of the image.

If the alternate description provided is a link 'http://www.xyz.com' then the main purpose of the image is unclear to the screen reader users as it just reads aloud the link in the alternate description. If a web page contains a form then the form buttons should be given proper description instead of just alt='Button' as it doesn't clear the purpose of the button on the form for users who cannot see the image. Because screen readers announce 'image' when they reach an <img> tag, an ALT-text description that includes the words image or picture is providing redundant information and can irritate users (Korpela, 2002). Also file names should not be used in ALT-text descriptions: such as "smiley.gif" or even "building.jpg" as they provide no useful information to users (Korpela, 2002). Thus an alternate description of an image should not contain a link, file name and descriptions starting with word image. Such wrong ways of describing images will result in users missing the main purpose of image on the page.

Therefore failing to provide an alt attribute for an image proves the page is missing the basic accessibility principle and hence reducing the users of the website (Watson, 2005).

2.8 Ways of providing alternate descriptions of images:

The most used way of providing alternate description for images is including an Alt attribute with the img element (as mentioned before).

Long Description (longdesc)

Another possible way available in the HTML code is the LONGDESC attribute of the <IMG> tag. The syntax for longdesc attribute is described in figure 2.

Although this attribute is not yet widely supported by browsers and assistive technology, it allows for a longer description of an image to be provided on a separate hyperlinked page. Users can access it if interested and ignore it if they are not. LONGDESC are especially useful for graphs and charts which may require a fuller explanation. Because some screen readers do not yet recognize the LONGDESC attribute, web authors can use a 'd-link' or description link that opens the description file (Thatcher, 2003).

Figure 2: Syntax for the LONGDESC attribute

Title Attribute

Another way to present image descriptions to the user is through the use of the TITLE attribute which generates onscreen 'tool tips' and can be applied to many HTML elements including images (Hudson, 2003). It has been suggested that ALT-text can be used to provide a brief description and TITLE can provide more detailed information (Clark, 2002). However, this approach is not entirely supported by current browsers or assistive technology and it is unclear whether the ALT or TITLE text would be presented to the user as this appears to differ based on the software being used. Therefore, TITLE should not be used in place of the ALT attribute (Hudson, 2003).

Decorative images used in a webpage do not have any important content they have non-informative information. So the alt attribute for decorative image is generally having null alt text as (alt='') (WAI, 2005). It is suggested that when the image is decorative it should be added to the background CSS as it will remove the image from the flow of page and the user using a screen reader would not get confused by the non-informative images on the page.

If a page contains a form then the form image buttons should have relevant alternate description as what the button exactly says. Ex. <input type='image' alt='Submit form'> will be appropriate for the submit button on the form. Similarly, if the image is a link, i.e. the only content is an <a href='>'</a> element, write an alt text that corresponds to the destination of the link (Korpela, 2005). For describing a logo of a company, complete name of the company should be provided in the alternate description.

In year 2005 an interview was conducted by Petrie, Harrison and Dev with 5 participants about describing images on the web in 10 different web sites for about 100 images.

The interviewees suggested that the following elements would require description in the majority of cases:

' Objects, buildings, people in the image

' What is happening in the image?

' Purpose of the image

' Colors in the image

' Emotion, atmosphere of the image

' Location depicted in the image

This can be considered as an important checklist for web developers while describing image on website.

The most useful information to be included in descriptions was thought to be context dependent. For example, retail websites with images of products should provide detailed descriptions of aspects such as size, color etc, while travel sites should provide details of the type of accommodation seen in the images (Petrie, Harrison & Dev, 2005).

'There is no one right alt text for any particular image. It all depends upon the context and the purpose of the image' (WebAIM(b), 2010). Thus, if same image is used several times on same page for different reasons then it should have appropriate text content in the alt attribute. ALT text must be accurate and concise. Long ALT text makes it difficult for users of assistive technology (ex: Screen reader) to understand the content of website. (McEwan, Weerts, 2008).

2.9 Previous Work:

This section highlights some of the previous work that is done in the area of image description. Different studies over how to provide alternate description of images is also discussed below.

In 2006 Watson described about instructions on how to describe specific categories of images were provided such as images with text and graphical links. For content rich images that required a longer description, there was no available guidance. For describing logo there was no particular definite way 'You can either put the company name alone, for example, 'Microsoft', or 'Microsoft logo'.

Also many web developers are confused as how to describe the images as of art work, photographs, paintings, and graphs. However, an interesting guideline that was mentioned (Petrie, Harrison & Dev 2005) was the introduction of 'templates' to describe photos of people, places and objects. An example of a template to describe photos of people is as follows:

This {black and white/color} photo shows {a number of}

{people/children/adults/women/men/girls/boys} {standing/sitting ...}

They are described in order from {left to right/front to back/clockwise from the top}

In 2001 Alonzo conducted a research based on describing 100 pieces of art. There were some interesting guidelines illustrated. An example was 'avoid redundant phrases such as "rectangular in shape" or "blue in color," simply using "rectangular" or "blue" instead.' These kinds of tips are useful as they are practical advice.

Regarding the length issue WebAIM (2010) stated that 'Typically no more than a few words are necessary, though rarely a short sentence or two may be appropriate'.

In 2006 Cherim had a rather different approach. It starts off by inviting the web developers to assess the image and classify it into different types (as mentioned before) which, in essence, is more preferable than other approaches since it trains the web developer to think about the image and therefore give it the proper treatment.

In the year 2004 a survey was conducted by Lazar while a research on 'Improving Web Accessibility', among 175 web developers for testing their knowledge of accessibility. About 38% of the web developers worked in educational organizations. Several questions were asked to the participants to investigate their knowledge about accessibility. 65.7% participants indicated that they had previously created an accessible website for users with visual impairments. 56% participants answered that their present website is accessible by visually impaired users but only 38.9% said they have tested their website using a screen reader.

Table 1: Shows the familiarity of the Web developers with accessibility guidelines

According to the statistics of the survey discussed above indicates that only few web developers perfectly follow the WCAG guidelines and take efforts to make their website accessible to all users including the disabled users.

2.10 Tools to support web developers

There are many automated testing tools designed for web designers to find accessibility errors like checking the code for common problems while interaction with assistive technology ex: 'A-Prompt', aDesigner, Fireyes (Deque) etc. These tools check website for conformance, color-contrast, and font-size are changeable and simple accessibility but they fail to check whether the alternative text for images is meaningful, or if an image is decorative then should it have or should not have alternative text. All these problems cannot be solved automatically. (Borodin, Bigham, Dausch, Ramakrishnan, 2010)

In 2007 Bigham developed a tool 'classifier' to judge the quality of alternative text, which uses features based primarily on the alternative text content and on the context of where it is located on the web. The tool was developed that used machine learning techniques to aid in the semantic markup of images, but this tool assumed that labels were not already given and that the purpose of labeling the images was for the semantic web. (Marques, Barman, 2003)

The tool basically examined 'if the arbitrary alternative text is more likely to be appropriate or inappropriate given its context and the use of the alternative text as an equivalent substitute for the image (Bigham, 2007).' This information could be useful for web developers to check the alternate text if its equivalent to the visual content of the image. It also checks alternative text to the content similarity as it should be similar to the content of the page. 'For example: The text 'Click Here' is a commonly used for alternative text, but, unless the image contains the text 'Click Here,' this alternative text neither conveys the content of the image nor what will happen if the image is clicked (Bigham,2007).'

2.11 This study

This study aims to

' Develop a tool for web developers who have no or little knowledge about accessibility to provide a proper alternate description for images on web pages.

This tool will

' Detect the presence of images on a web page

' Assess whether an appropriate alt text is provided for each image

' Provide guidance to the developers on how to provide good alternative description for their images.