Table of Contents

• Introduction
• 1. Conformance
  • 1.1 Dependencies
• 2. Use Cases and Requirements
• 3. The longdesc Attribute
  • 3.1 Extensions to the HTMLImageElement interface
    • 3.1.1 Attribute
• A. Acknowledgements
• B. References
  • B.1 Normative references
  • B.2 Informative references
• C. Change History

1. Conformance

As well as sections marked as non-normative, all authoring guidelines, diagrams, examples, and notes in this specification are non-normative. Everything else in this specification is normative.

The key words must, should, and may in this specification are to be interpreted as described in [RFC2119].

2. Use Cases and Requirements

There are many ways users can successfully interact with images even if they cannot see, or see well. The alt attribute is designed to ensure that for everyday work, a user has enough information to replace an image, and often this is more helpful than a detailed description of every image. The longdesc attribute is designed to complement this functionality, to meet the following use cases.

Use Cases

Identifying a well-known image

Identifying an image is often important context for a discussion. There are many well-known images which are widely reproduced and well known. In some cases, such as "Mona Lisa", "Gerníka", Cubbin's "Lost", Leunig's "ramming the shears", the most effective way to identify an image is to use its title, creator, and similar information that would be found in a catalog. But different people know images by different titles, and some titles are not well known. Where the image itself cannot be seen, a description can often be used to offer easier recognition than the cataloging information, for example "Washington crossing some river, standing heroically in the boat, while soldiers do the hard work", or "the Da Vinci picture of the guy in a square and a circle".

Requires: Discoverability

Helped by: Inline, Reuse

Describing a complex diagram

In many environments diagrams are used to explain a concept or transmit information efficiently. For a user with a reduced ability to see the image (poor contrast vision and other conditions are as relevant here as a complete lack of vision), a description can enable that user to understand the information being presented.

Requires: Structured Markup, Inline, Reuse, Simple Return

Teaching Accessible Development

In many environments producing content that is accessible to users regardless of disability is a legal and/or market requirement.

Requires: Maintenance, Backwards compatibility

A self-describing artistic work

The visual design of many pages is an important part of the message the author intends to convey to a fully-sighted user. Many authors would like to convey as much of that design as possible to a user with low or no vision.

Requires: No visual encumbrance, Structured Markup

Helped by: Reuse, Simple Return

Referring to an existing description

Many well-known images are already described by other sources. The copyright on those sources may not be compatible with re-publishing the description, but there is little value in making a new one.

Requires: Reuse, Structured Markup, Simple Return, Optional Consumption

Helped by: No Visual Encumbrance

Linking to a description included within a page

If an image already has a description included within a page, making the linkage explicit can provide further clarity for a user who is not able to interpret the default layout. For example this happens when users force a re-layout of the page elements because they have magnified the content, or because they do not see the default visual relationship between the element and its description.

This practice also enables description to be provided for all users.

By keeping the association clear the content maintainer can more easily check that the description and link are actually correct.

Requires: Inline, Simple Return, Structured Markup, Optional Consumption

Localizing descriptions

When content is localized to multiple languages, it is important that metadata intended for human consumption, such as image descriptions, can be readily localized.

Helped by: Structured Markup, Reuse, Maintenance.

Requirements for an Image Description functionality

No visual encumbrance

It must be possible to provide a description for an image without forcing the description to be rendered on the page.

Structured Markup

It must be possible to include rich markup (e.g. HTML5) in the description of the image.

Inline

It must be possible to associate a description in the body of a page with an image in that page.

Reuse

It must be possible to re-use a single description for multiple occurrences of an image.

Maintenance

It must be simple to maintain a library of images and descriptions for dynamic assembly, or dis-assembly and re-assembly, of content.

Discoverability

It must be simple for a user agent to automatically discover a description provided for a given image.

A user should be able to determine that there is a description available for a given image.

Optional consumption

A user must be able to choose not to read the long description of a given image.

Simple return

A user must be able to return from the description to the image.

Backwards Compatibility

It should be possible to use existing tools and techniques to associate an image with its description.

3. The longdesc attribute

Note that this extension changes the definition of a hyperlink in HTML, by allowing a longdesc attribute to occur inside a hyperlink.

3.0 Implementation

3.0.1 Authors and Conformance checkers

partial interface HTMLImageElement {
             attribute DOMString longdesc;
};

/*Make the first internal longdesc reference absolute*/

var baseURL = document.location.origin + document.location.pathname
var someImage = document.querySelector('img[longdesc^=#]');

someImage.longdesc = baseURL + someImage.longdesc;

/*Open new windows for each longdesc found*/

var describedImages = document.querySelectorAll('img[longdesc]');

for (i in describedImages) {
  if (i.longdesc)
    window.open(i.longdesc);
}

/*Tries to repair errors where the longdesc isn't a URI*/

var describedImages = document.querySelectorAll('img[longdesc]');

for (i in describedImages) {
  if (i.longdesc && !(validURL(i.longdesc)) { //assumes some URL validating function
    var theData = encodeURIComponent(i.longdesc);
    i.longdesc = "data:text/plain;charset=";
    i.longdesc += document.charset;
    i.longdesc += theData;
  }
}