Guideline for Designing Accessible Systems to Users

with Visual Impairment:

Experience with Users and Accessibility Evaluation Tools

Caroline Guterres Silva, Vinicius Coelho and Marcos Alexandre Rose Silva

Colégio Politécnico, Federal University of Santa Maria.

Avenida Roraima, nº1000, Santa Maria, RS, Brazil

Keywords: Accessibility, Guidelines, Visual Impairment.

Abstract: Nowadays, society uses computer systems in diverse day to day activities, such as shopping, social interaction,

study, research, etc.; however, a considerable number of the population, who has some kind of special

necessity, faces difficulties in using those systems for various reasons, for example, there are codes not written

in a way that allows screen readers to identify the menus, contents, etc., to make the correct reading for users.

In that context, this paper contains the description of a research done to identify guidelines and/or techniques

that address a code document to facilitate interaction between the visually impaired and computer. By

applying those guidelines to a prototype and then submitting it to testing with visually disabled users, it was

observed that the source code was more legible for screen readers and user interaction was facilitated;

however, during user testings, improvements that could be applied to the existing guidelines were observed.

Beside user testings, this paper reports a research on automated validators and their criteria on source code's

accessibility. It is noted that this automated verification does not exclude tests involving users, because both

tests are important in the process of accessibility assurance.

1 INTRODUCTION

The World Health Organization (WHO) (2015),

defines disability as a "restriction or lack (resulting

from an impairment) of ability to perform an activity

in the manner or within the range considered normal

for a human being".

According to a report published by the World

Bank (2011), made by the World Health Organization

considering 59 countries, describes that at least 15.4%

of the world's population has some type of disability,

resulting in about 1.1 billion people around the world.

There are estimates that by 2050, the total number of

people with disabilities will be nearly 50%.

In the workplace, people with disabilities suffer

with higher rates of unemployment (World Bank,

2011), with only 53% of disabled man and 20% of

disabled women employed.

The World Health Organization (2012), in the

search for workplace insertion and quality of life

improvement, defined some main objectives, and one

of them includes the promotion of use and availability

of assistive technologies (WHO, 2015).

There are different types of disability, such as:

vision, hearing, motor, advanced age, dyslexia,

cognitive or neurological, among others. (W3C,

2012).

In the context of visual disability, accordingly to

WHO (2011), 161 million people worldwide are blind

or visually impaired, while another 153 million have

an uncorrected visual impairment. Also, it is

estimated that by 2020, the total of people with visual

disability in the world could double.

Visual disability creates an obstacle to people as

they are excluded or have trouble in accessing the

advantages brought by computing and technology in

general. WHO (2012) states that more than 285

million people in the world, as a result of some visual

impairment, cannot read all the content available on a

web site. This lack of accessibility reflects in disabled

people’s lives granting them less opportunities in

work, education and entertainment.

Given that background, this paper contains the

description of a website prototype developed taking

accessible design guidelines into consideration. The

use of it by users with visual impairment was

Silva, C., Coelho, V. and Silva, M.

Guideline for Designing Accessible Systems to Users with Visual Impairment: Experience with Users and Accessibility Evaluation Tools.

DOI: 10.5220/0006351301510157

In Proceedings of the 19th International Conference on Enterprise Information Systems (ICEIS 2017) - Volume 3, pages 151-157

ISBN: 978-989-758-249-3

151

observed in order to identify difficulties during

interactions, as well as, automated validators were

investigated to identify possible errors that could

become an obstacle in the interaction between people

with visual disability and computer.

2 TYPES OF DISABILITY

Disability may appear on birth or occur during the life

of the individual, and can affect people in different

ways. As mentioned previously, there are some types

of disability. Table 1 shows some characteristics

about them.

Table 1: Types of disability (W3C, 2012).

Disability

Characteristics

Vision

Moderate vision impairment

to complete loss of vision,

color blindness

Hearing

Partial to total loss of hearing

Motor

Mobility impairments in limbs

or reduced dexterity

Advanced

Age

Reduced vision, hearing,

mobility or any impairment

due to ageing

Dyslexia

Difficulties in reading,

writing, spelling or word

comprehension

Cognitive or

neurological

Disorders in any part of the

nervous system, including the

brain

In that context, Figure 1 presents the total of

individuals that have some kind of disability.

Figure 1: Estimates of adults per type of disability (Center

For Disease Control and Prevention, 2014).

According to Center For Disease Control and

Prevention (2014) 36% of people are visually

impaired. Within this context, Figure 2 shows the

amount of blindness, low vision and visual

impairment people, considering some countries. In

the world, India contains the most of the cases of

blindness a year, because there are 30.000 new cases

every year (World Health Organization, 2012).

Figure 2: Visually impaired people by severity and region

(World Health Organization, 2012).

There are countries, like Brazil, where the amount

of people with visual disabilities overcome every

other disability, as shown in Figure 3.

Figure 3: People with disabilities in Brazil (IBGE, 2000).

ICEIS 2017 - 19th International Conference on Enterprise Information Systems

152

Analyzing that scenario could be inferred how

fundamental to provide technology inclusion of all

people in the society is, because computer takes part

of many people’s activities every day. Therefore, it is

not supposed to find any barriers while interacting

with systems or devices, considering ideal world.

3 DEVELOPMENT STRATEGIES

There are techniques, guidelines, standards, and

others that can be used to back design decisions in

order to support the design of accessible systems.

This topic presents some of them, which can be

employed in scenarios for various types of disability;

however, the emphasis here considers techniques and

information when related to visual impairment.

- WCAG (Web Content Accessibility

Guidelines) (2012): recommendations and

accessibility rules for displaying web content. The

WCAG are accessibility guidelines which define a

standard for how to maintain web accessible content

for every person (WCAG, 2012; W3C, 2011). For

instance, it contains a guideline on how to display

alternative text for images and symbols in the

interface, in a way that a screen reader could identify

and reproduce in an appropriate way what it is shown

on the content.

- UAAG (User Agent Accessibility Guidelines)

(2015): composed by 12 guidelines, each one formed

by orientations called checkpoints. Those guidelines

specify accessibility recommendations to certificate

that the user interface is operable.

One of these checkpoints consists of a sequential

website navigation, making sure that the user can

interact with the website via keyboard. The use of the

key “Tab” is one of the mechanisms that allow people

with visual impairment to use websites, because they

can navigate through menu, content, figures of the

site pressing this key. The navigation sequence via the

key “Tab” must be designed to provide a valid

navigation for the user (UAAG, 2015).

- Accessible Guidelines for People with Visual

Disability: guidelines formalized from experiencing

and observation of users with visual disability while

they had been interacting with various websites.

Those guidelines contain understanding such as the

compared eagerness of people with visual disabilities

and with non-disable people, because both show

impatient behavior, e.g., non-disable people do not

read every word on the content, and disabled people

do not listen to every word (Theofanos, Redish,

2006).

In some countries, such as Brazil, as a state

initiative, a document was elaborated, containing

recommendations to standardize and help

accessibility decisions in the accessible web sites or

systems development. In the case of Brazil there is the

document called eMag.

- eMag (Accessibility Model in Electronic

Government): recommendations and guidelines for

the construction and adaptation of Brazilian

Government content for the internet (eMag, 2014).

One of these guidelines is related to provide links to

navigate to content instead of making the user

navigate through every option in the menu, pressing

the key “Tab” multiple times, before reaching the

desired content.

Considering these and other guidelines, WCAG

represent the most guidelines used to design

accessible sites or systems. There are user testing and

results analysis concluding that websites which

conformed to WCAG guidelines had obtained better

scores on usability, aesthetics, reliability and loading

time; on the other hand, more investigation in this

field is still needed as a means of improving computer

interaction (Schmutz, Sonderegger & Sauer, 2016;

Gonçalves et al., 2013).

Research and guideline usage gives benefits in

usability to both disabled and non-disabled users,

because they describe how to display information

with visbility, color constrast, as well as, how to

organize it, among others. Next section reports the

use of these described development strategies to

design prototype.

4 PROTOTYPE

The investigated guidelines and techniques were

applied for designing the first website’s prototype,

where visually disabled users had the opportunity to

navigate. The results from usage tests observation

were considered to improve the prototype, in a second

version.

According to Bai, Mork & Stray (2016) it is

possible to use automated tools for error identification

as a means to save resources and maximize benefits.

Thus, for the second version of the prototype, a study

on automated validators was made, identifying their

characteristics and, consequently, using those tools

for prototype tests.

It should be noted that automated validators does

not replace tests with users, but they could be used to

complement the evaluation process. In this case, the

Guideline for Designing Accessible Systems to Users with Visual Impairment: Experience with Users and Accessibility Evaluation Tools

153

goal was to identify errors and improve the

prototype's source code before submitting to users,

avoiding errors that could be fixed before the tests had

started.

4.1 The First Prototype Version

The prototype was made contemplating the

information obtained in the development strategies,

for example, the use of “Tab index”, which permits

the user to navigate the content in a sequential way;

buttons with the functions to increase or decrease the

typography size in the screen, as well as, alternate

between more contrasting colors in the interface,

allowing users with visual impairment improve the

readability of the content as they need; division of the

content in blocks containing areas of information,

making the navigation between content easier;

alternate describing text for images, by using the

attribute “alt”; website responsiveness to make a

readable and logical content website if it be resized;

insert focus on content; link that allows the user to

explore more about the information described - this

option, added to the end of the paragraph, is clicked

when the user accesses a small block of text and wants

to know more about it.

In order to observe the use of the site,

Comprehension Test and Key Test were performed

with users of an association of the blind and visually

impaired (Krug, 2014). The Comprehension test’s

objective is to allow users navigate in the website and

observe/ask if they understand what is its meaning

and organization. The Key-Task test is used to verify

if users can accomplish previous elected tasks on the

website

The content of website was related to soccer

teams, soap opera, crafts, etc. In the Key-Task test

was requested that the user navigate the website to

find a specific topic about a determined subject, e.g.,

to find a resume about a soap opera. While the users

were doing the required tasks to accomplish the

result, observation of the process and behavior of the

users took place.

The user group was composed of 4 males and 2

females. They interacted with the website through a

screen reader called NVDA (NVDA, 2017).

User 1 was a male blind person, with knowledge

in internet navigation for reading e-emails, working,

playing game and talking using chats and Skype. He

has experience with various screen readers, such as

Dosvox, NVDA and Virtual Vision.

User 2 (male) was a blind person, with little

knowledge in computer use. He was doing a typing

course at the time the test were done. The test was his

first access to a website, and he had difficulty with the

keyboard, not having memorized the localization of

important keys like “Tab” and “Enter”.

User 3 (female) was also blind, and had

knowledge in internet navigation for reading e-emails

and news using screen readers such as Jaws and

NVDA.

From the rest of the users in the group, two of

them had low vision, being one of them the User 4

(male), who had 20% of vision capacity and little

familiarity with computers, and at the time of the test,

just starting web navigation classes. The other low

vision user, User 5 (male), had 10% vision capacity

in the right eye, and 5% in the left eye. User 5 already

was familiar with computer use and could access

news websites and social networks. The last user in

the group, User 6 (female), was blind and no

familiarity with computer use, and was just starting

typing classes.

During the tests, only User 2 could not figure out

the website’s objective and neither accomplishes the

requested task. The other users did finish the

presented task.

After the ending of the tests, the users could point

out any difficulties they had during the website

navigation:

1 – By using “Tab”, the screen reader NVDA

could read the information displayed, but the same

task was unsuccessful when using the keyboard

arrows instead, like  or . For example, there were

some options as A+ to increase size in the screen and

A- to decrease it.

The describing information in the HTML tag was

presented to the user when he navigated using “Tab”,

i.e., NVDA could read the meaning increase or

decrease; on the other hand, with the arrows only the

raw content of the tag was presented, as A and A for

both options, providing no useful context to the user.

2 – Users did not know how to use the Access key,

which are shortcut keys for accessing options, for

example, by pressing Alt + A to access the

“Artesanato” menu, in English Crafts menu.

With respect to the tests carried out, it allowed to

analyze the results, as well as to develop a second

version of the prototype, which sought to improve the

user interaction with the system.

4.2 The Second Prototype Version

Through the analysis of the previous user group tests

and observation of these users and others who were

part of the same organization, while they used various

websites, including Facebook and Gmail,

ICEIS 2017 - 19th International Conference on Enterprise Information Systems

154

improvements were identified with the objective of

facilitate the user interaction:

- Use of audio cues to inform that the web page

loaded. The audio cue works as a signal that the page

is ready to be interacted with, as this question is very

common among the users.

- Descriptive text in the accessibility buttons. In

the tests, the users could not identify the meaning of

some of them as they were not displayed as intended

for the users with disability. Thus, each button

function was described literally, altering the “A+”

button into “Increase Text Size”.

- Menu items sorted in alphabetic order. It

facilitates the identification of a logic order during the

navigation. Visually disabled users related that they

form a logic way when navigating, to make the

interaction easier. For instance, if the current item

starts with “A” and the user knows that the content is

sorted alphabetically, he would know what is at the

beginning of the content, thus, he could use the

shortcut keys to jump back to the start without having

to navigate between intermediate items. If there is no

perceptible logic, they must go through all the items.

- Separate items in well-defined categories,

improving accessibility as the content is better fitted

for its audience, requiring less clicks for the users to

reach its goal. For example, considering soap operas

from different TV channels. It is better to choose one

TV channel to access its soap operas, than to navigate

through all soap operas from all TV channels to find

one. In the second example, many “Tab” pressing is

required.

- Inhibit access to the accessibility buttons

initially by the keyboard, as blind users do not find

use in the options of auto contrast, increase font size,

etc. In this case, these buttons increase the number of

items to be covered.

- After a menu item is selected, it should directly

progress to an inner menu with its own items or

progress to the specified content. Users in the Key-

Test had difficulties in realizing that after the main

menu selection, they should navigate to the selected

category’s own sub-navigation.

- The most important information should

anticipate any other information. Disabled users are

impatient as non-disabled users, because they hear the

first words in a link or text block and, if it does not

seem relevant, they advance their navigation

(Theofanos, Redish, , 2006). For example, ‘name of

the soap opera’ image, instead of image ‘name of the

soap opera’. Because, when user listens image firstly,

he can think that it is an image related to

advertisement, icon menu, etc. There is not a specific

meaning.

After previous improvements were identified, a

redesign of the site was done. One of the resultant

screens can be seen in Figure 4.

Figure 4: Website’s prototype second version.

Figure 4 shows a screen with alphabethic order

menu as Artesanato, Músicas, Novelas and Times, in

English, Craft, Music, Soap opera and Soccer Teams.

Accessibility options as increase or decrease font

size are not recognized through “Tabs” before

content, because blind people do not use them; on the

other hand, after reading the content of the page, these

options are recognized, if users keep pressing “Tab”.

In this example, screen readers will identity menu

option as Craft, then the three Highlighted News and,

after, accessibility options.

If user chooses a menu option as Craft, he does

not need to navigate through menu options again or

to find a link to go to content, because he will

conducted automatically to content of the Craft page.

According to Preece et al. (2011), the usability

validation, as well the accessibility, should be

designed with the use of tools and human revision.

Tatcher et. al (2002) asserts that the use of automatic

code validation tools is important to verify that the

syntax of web pages conforms to the accessibility

recommendations, guidelines and standards.

In this context, for the second version of the

website’s prototype, research was made to identify

automatic code validators and their characteristics,

with the intent of using them on the web pages before

the user tests take place.

5 CODE VALIDATORS

The automatic tools, from the code validation to

verify that the syntax of the web pages conforms to

Guideline for Designing Accessible Systems to Users with Visual Impairment: Experience with Users and Accessibility Evaluation Tools

155

the recommendations, standards, etc., provide reports

with the problems found and that must be corrected,

making the site suitable. The use of these validators

is simple, since they are all web-based, that is, no

software installation is required. It is only necessary

to insert the Uniform Resource Locator (URL) in the

available text area (Thatcher et al., 2002). Thus

follows, a list of tools as their characteristics.

The Figure 5 displays a relation of these tools and

its characteristics, such as the standards and

technologies each validator allows the website to be

compared against, target website or code input

method allowed and which types of accessibility

guidelines validation each tool offers.

Figure 5: Comparison of tools with input data.

The validator DaSilva (2014) was selected

because it is the first tool to allow evaluation through

the WCAG guidelines and eMag, and, therefore,

evaluates the code considering a greater number of

guidelines.

Thus, validation was performed with the tool

DaSilva on the prototype, by inserting the website’s

URL on the validator interface. Figure 6 shows

DaSilva’s interface and its report on the prototype

found errors, verification points, source code

localization and total of occurrences.

Figure 6: Error reporting.

The report provided by the validator shows an

interface where the errors found were displayed in a

table, defining the total of issues found and details

about each error, such as the line position in the

source code where it was found and which guideline

the tested website was not in conformity.

In Figure 7, another interface of the validator is

shown. This interface contains all warnings found in

the website’s code. One of the warnings in the report

refers to the color use, asserting that " Color is not

used as the only visual means of conveying

information, indicating an action, prompting a

response, or distinguishing a visual element.", that is,

any information provided by using color, must also be

evident also without color.

These warning refer to points where the validator

cannot be sure about the existence of an accessibility

non-conformance or syntax error, due to software

limitation in this regard. The warnings require a

human to make the decision if each issue identified is

a real problem or a misinterpretation from the tool.

Figure 7: Warning report.

The validators are an important tool, but they

cannot be the only method in asserting the conformity

of accessibility guidelines or identifying errors in the

website’s code.

6 FINAL CONSIDERATIONS AND

FUTURE WORK

There is a latent need to investigate and discuss about

what more could be done to aid people with

disabilities in their interaction with computer

systems, because every concept, strategy and

innovation can result in better interaction. Therefore,

investigation and propagation of experiences and

findings in the field should be encouraged, like some

improvements, reported in this paper. They were not

identified or expressly described in the researched

guidelines, mentioned in Development Strategies

section.

These improvements can be considered as

complements to the guidelines presented in this

paper, for instance, in the guideline that recommends

ICEIS 2017 - 19th International Conference on Enterprise Information Systems

156

providing sequential navigation. In this case, through

the findings in this paper, was identified that defining

an alphabetical order for the sequence had better

results.

In another example, the guideline that

recommends the increase font/decrease font buttons

could be improved by using a literal description on

the names of buttons instead of the common approach

of using its abbreviations (A+ or A-), as they could be

ignored by the screen reader or misinterpreted by the

user during navigation.

Besides the guidelines suggested improvements,

another contribution by the paper was to present a

comparison between some of existing validators,

contemplating each own criteria on guidelines and its

particularities.

User tests and automated tools provide major

contributions in the making of an accessible website

for visually disabled people, each providing useful

insights on how accordance to the guidelines and

knowledge of the target audience are essential to

increase the reach and value of the web content.

There is a need to investigate and discuss what

can be done to auxiliary people with disabilities in the

interaction of computer systems. Strategy and

innovation can result in a profound change in quality

of life, increasing their participation in the labor

market and consumption.

Should be noted that the computer accessibility

concern is a growing trend, once the population of

disabled people will continue to increase as the world

population grows bigger and ages.

Future work include improving the prototype’s

interfaces to conduct new user testing, as well as

continue research, with the aim of identifying and

applying new improvements to enhance the

interaction of visually impaired people and computer.

ACKNOWLEDGEMENTS

We would like to thank Colégio Politécnico from

Federal University of Santa Maria for the financial

support; as well as, Vinicius Diehl de Franceschi for

supporting prototype development.

REFERENCES

Bai, A., Mork, H. C., & Stray, V. 2016. A Cost-benefit

Evaluation of Accessibility Testing in Agile Software

Development. ICSEA 2016, 75.

Center For Disease Control And Prevention. 2014. Adults

with Disabilities infographic. Viewed 04 Jan 2017,

https://www.cdc.gov/vitalsigns/disabilities/infographic

.html.

DaSilva, 2014. O primeiro validador de acessibilidade em

português. Viewed 05 Jan 2017,

http://www.dasilva.org.br/.

Emag 2014. Modelo de Acessibilidade em Governo

Eletrônico. Viewed 12 Jan 2017, http://emag

.governoeletronico.gov.br/.

Gonçalves, R., Martins, J., Pereira, J., Oliveira, M. A., &

Ferreira, J. J. P., 2013. Enterprise Web accessibility

levels amongst the Forbes 250: Where art thou o

virtuous leader?. Journal of Business Ethics, 113, 363–

375. doi:10.1007/s10551-012-1309-3.

IBGE - Instituto Brasileiro de Geografia e Estatística. 2000.

Censo Demográfico 2000: Características gerais da

população. Rio de Janeiro. Viewed 05 Jan 2017,

http://www.ibge.gov.br/home/estatistica/populacao/ce

nso2000/populacao/censo2000_populacao.pdf.

Krug, S. 2014. Don´t make me think: A Common Sense

Approach to Web Usability. New Riders Publisher. 3

edition.

NVDA. 2017. Home of The Free NVDA screen reader.

Viewed 10 Jan 2017, https://www.nvaccess.org/.

Schmutz, S., Sonderegger, A., & Sauer, J., 2016.

Implementing Recommendations From Web

Accessibility Guidelines Would They Also Provide

Benefits to Nondisabled Users. Human Factors: The

Journal of the Human Factors and Ergonomics Society,

58(4), 611-629.

Thatcher, J.; Bohman, P.; Burks, M., 2002. Constructing

accessible web sites. 1ª Edição, Glausshaus Ltda.

Theofanos, M. F., Redish, J., 2006. Guidelines for

Accessible and Usable Web Sites: Observing Users who

wotk with screen readers. Viewed 12 Jan 2017,

http://www.redish.net/images/stories/PDF/Interactions

PaperAuthorsVer.pdf.

UAAG., 2015. User Agent Accessibility Guidelines.

Viewed 11 Jan 2017, https://www.w3.org/TR

/UAAG20/.

WCAG., 2012. Web Content Accessibility Guidelines –

WCAG. Viewed 11 Jan 2017, https://www.w3.org

/WAI/intro/wcag.

World Health Organization. 2015. WHO Global Disability

Action Plan, 2014-2021: Better Health for All People

with Disability.

World Health Organization. 2012. Global Data On Visual

Impairments 2010. Viewed, 04 Jan 2017, http://www

.who.int/blindness/GLOBALDATAFINALforweb.pdf

World Bank. 2011. Main report. Washington, DC: World

Bank. Viewed, 28 Dec 2016. http://documents.

worldbank.org/curated/en/665131468331271288/Main

-report.

W3C. 2011. Consortium World Wide Web. Sobre W3C

Viewed 10 Jan 2017, http://www.w3c.br/Sobre.

W3C. 2012. Diversity of web users. Viewed 03 Jan 2017,

http://www.w3.org/WAI/intro/people-

useweb/diversity

Guideline for Designing Accessible Systems to Users with Visual Impairment: Experience with Users and Accessibility Evaluation Tools

157