Graphs pose particular challenges for those with reduced vision. The University of Illinois has a useful website that provides best practices on overcoming these challenges.
For accessible graphs, ALT text equivalent to a good title for the graph must be provided. Also required is a longer description with either a table of the graph data (using accessible table markup) or a long description of the relationships in the data the graph was intended to convey. This could be something as simple as, “The graph indicates sales rose steadily from January 2000 to March 2003, from 2 million units to 3 million units.” The long description should be linked to the image by the longdesc attribute or included in the source document.
At the Web Accessibility Best Practices page of the Campus Information Technologies and Educational Services (CITES) and Disability Resources and Educational Services (DRES), they provide an example of an Accessible Graph Example.
The graph of the IBM Stock Price and Volume indicates that the stock price rose to a peak of $120 in early June, fell to a low of $105 in early July, rose to the maximum price of $133 in September, and fell to the minimum price of $87 in late October. The share volume was relatively constant with larger, transient peaks near the minima in July and October. The table of data used to generate this graph is available.
Example HTML Source
<img src=”images/image-longdesc-003.gif” alt=”IBM Stock Price and Volume for July 2000 to November 2000″ longdesc=”images/image-longdesc-003.html” />
Following this recommendation will greatly enhance the material that you are presenting to all audiences. Business writing will almost always improve with better and clearer description. While this recommendation will make your graphs accessible, all of the recommendation improves the communication of information to all audiences.
We welcome your feedback. Please leave us a comment below. If you haven't already, there is no time like the present to subscribe to the RSS feed.
Category and Tags
This post filed in the following categories:
- Visualization - Visualization is any technique for creating images, diagrams, or animations to communicate a message.
Related Posts
You may be interested in the following related posts:







{ 1 comment… read it below or add one }
I agree that a good text alternative for graphics is necessary, but I doubt if using the longdesc is really best practice since it is not always clear how to access it. Would it not be more appropriate to make this description available to everyone, e.g. in visible text?