Raising Our Web Standards

Image of Bar graph with words Raising our web standards

Image of Logo: W4A TPG Accessibility Challenge Delegate AwardTPG Accessibility Challenge Delegates Award at the 12th Web for All Conference

In today’s world of technological advancements and digitization, nearly every resource uses the Web as a base platform, including education, research, entertainment, health and daily life. Staying connected is of pressing importance, so the Web needs to benefit and be accessible to everyone, including people with disabilities. Out of this need the term Web Accessibility has emerged, and led to the development of standards such as the Web Content Accessibility Guidelines (WCAG).

Upwards of 285 million people across the globe are estimated to be visually impaired, according to a report by the World Health Organization (WHO). Unfortunately, most websites still have accessibility barriers that make it difficult for this population to access many important resources. In an empirical study of the problems encountered by blind users on the Web, results indicate that only 50.4 percent of the difficulties experienced by users were covered by the success criteria in the WCAG.

One major barrier the visually impaired encounter is access to information-embedded pages. Graphs have always been used in many different forms and variations to provide pictorial representation of data and information. The growing trend and demand for data visualization, through graphs as opposed to text, has led to further expansion of their various forms. To date, graphs are widely used across the Web, but most commonly as simple images. Consequently, a major goal of web accessibility is the adequate representation of graphs by screen readers.

While screen readers are somewhat adequate tools for recognizing text on web pages, they are still limited in extracting information from visual content, such as graphs. When graphs are displayed as images, their designers rely heavily on the ALT tag for screen readers to recognize them. However, to be most effective, the Web pages must follow and respect the guidelines recommended by WCAG.

Several algorithms have been devised to recognize the graph images on a web page and translate them into text format that can be read by screen readers. Owing to the algorithms limitations and strict requirements, a widely acceptable practical solution has yet to be proposed. Furthermore,

check this out

in case of an omitted ALT tag, or an ALT tag with an empty value, the screen reader skips over the image element, causing users with visual impairment to miss some content completely.

evoGraphs is a jQuery plugin that allows creation of dynamic and stylish graphs with the capability of being screen reader friendly. The plugin is fully customizable to the needs of the user, and it’s comprised of HTML, CSS and jQuery components, which reduce page-load time significantly. Furthermore, the plugin’s design is universal, in that it can easily read SVG graphs, which are widely used on the Web to render high-quality, two-dimensional graphics.

Extensive testing has shown that, compared to traditional image-based graphs, the plugin is nearly twice as fast in terms of page-load times. Various screen readers were tested for accessibility across multiple platforms by a control group of sighted and visually impaired users.

The concept behind evoGraphs is not just to present the elements of a graph to the user, but also to present the elements on the basis of their significance. For example, in a graph of 10,000 elements, visual users can identify the largest and smallest elements with little or no difficulty. However, for people with visual impairment, finding the largest and smallest elements entails going through the entire set of elements, which is not practical. The ability of customization allows the developers to present only the most significant elements, as per their perception, to the screen readers. Understanding that this does not necessarily reflect a user’s definition of significant elements, we’re working to create a browser extension to allow the users to select the information that they wish to extract from the graph.

The plugin presently supports only horizontal and vertical bar graphs, as well as pie charts. Conversion of imagebased graphs to evoGraphs is not supported dynamically, but could be achieved by manually plugging in the values. In terms of future improvements, plans are under way to include more graph types, to import a CSV file, and to develop a conversion tool for image-based graphs. Extension of this plugin to incorporate D3 Visualizations and maps is also in the works.

check this out

by Ather Sharif

Ather Sharif is the founder of EvoXLabs and Spinal Cord Injury Video Blog. He’s pursuing a graduate degree in computer science at Saint Joseph’s University. A quadriplegic, software engineer, freelance web developer, researcher, and Google scholar, he has a passion for consulting on Web accessibility.



Read more articles from the Ed Asner Issue.

sharing is caring

we did our part - now do yours and share

like a good neighbor, share

Related Articles: