Search results for: longdesc

Longdesc Links, History, Future

Recently I Twittered daily about longdesc, the classic unsung HTML attribute which supports long descriptions of images. Here’s a summary of the tweets/links:

Some History

To make a long story short (pun intended), longdesc was made obsolete in HTML5 but then returned. I applaud @JohnFoliot, @Laura_Carlson, and @Chaals in their dedicated efforts to return longdesc. I agree it should remain as there is no sufficient ARIA replacement.

Here are more great links on the topic on long description over the last few years.

The Future

Check out the ARIA 1.1 spec for aria-describedat ARIA 1.1 spec for aria-describedat! The aria-describedby attribute is like a combination of longdesc and aria-describedby. I’m pretty excited about this as it seems to provide a method for long description that we can all agree on.

AAP Provides Longdesc Feedback to W3C

There’s a debate over whether or not the longdesc attribute should be made obsolete in HTML5. I wrote a bit about it a few months ago in the article Longdesc & Other Long Image Description Solutions.

Recently the Association of American Publishers (AAP) submitted feedback on longdesc to the W3C HTML 5 Working Group. It’s very well written and thought it should be shared. I obtained permission to publish the response (thanks Suzanne and Ed). Here is the main part of it:

Use of structured text as a text alternative for an image is supported in HTML through the longdesc attribute. Though there are other options for presenting structured-text, the longdesc attribute provides following benefits:

For User Experience

  • The longdesc attribute is a dedicated mechanism for just this purpose, and it always works in the same way:
    • Students and instructors will find the same user interface throughout all materials, so they will not need to learn new interfaces product-to-product, which takes time and attention away from the learning content.
    • The longdesc attribute can be revealed programmatically through browser extensions, providing access for users who do not use screen readers. Many users benefit from text alternatives, especially users with low vision.
    • The longdesc attribute does not impact the visual design. So, authors do not have to worry about how the text might impact the visual user experience. Authors can, therefore, focus on the experience of students and instructors with visual impairment while they write text alternatives. This focus on the primary audience helps authors create text that is well-suited for its purpose.

For Production Processes and Quality Assurance:

  • The longdesc attribute is easy to code. There is no need for custom scripting.
  • The longdesc attribute works with assistive technology today. If the longdesc attribute continues to be supported, content that works well for users today can be used in future products without editing.
  • The longdesc attribute can be programmatically recognized and tracked, allowing publishers to locate existing long descriptions and to test for the presence of long descriptions.

We are using longdesc increasingly in our products. Unless a different mechanism is created that meets all these requirements, we urge the W3C to keep the longdesc attribute in HTML specifications moving forward.

We do acknowledge that user agent support for the longdesc attribute should be improved. In particular, users who have low vision or who find image descriptions helpful for any reason should be able to set their user agent to reveal the descriptions. The HTML 5 specification should clarify that user agents should provide this functionality in addition to passing information to assistive technologies. In this case, publisher documentation for products with numerous longdesc attributes might include tips about use of these user agent settings.

Evaluating Other Solutions

We discuss the aria-describedby attribute following to illustrate that solutions that at first seem to duplicate the qualities of the longdesc attribute may not actually be as useful when implemented.

The aria-describedby attribute takes the unique indentifier (“ID”) of another object on the same page as its value. In other words, it points to another object (e.g. a paragraph or a link) on the page. This attribute could become an effective way for developers to indicate that the information provided by an image is actually redundant with other information on the page.

Screen reader developers might implement this attribute so that it is silent in screen readers when used on an image by default. They might also allow those who want additional information to set their screen reader to announce aria-describedby and to provide a way to jump to the object indicated by the attribute. An instructor, for example, might choose this setting to be aware of what sighted students will be experiencing.

But, the aria-describedby attribute falls short as a mechanism to link to a separate page of structured text. The aria-describedby attribute could point to a link on the same page as the image, but:

  • Hiding the link visually would require custom CSS or scripting. The mechanism for hiding the link would therefore differ product-to-product, making browser extensions or features to show the links more complex to code and less reliable for users.
  • The link would have to be present on the page for screen reader users, creating redundancy for those users.
  • Since the aria-describedby attribute points to a link or to other content on the same page, its structure implies a two-step process to reach the text alternative. Compared with longdesc, the two step process is more tedious:
    • The user moves to the object that aria-describedby references.
    • If the object is or contains a link or a button, the user interacts with that object to move to the text alternative.

If the issues above are resolved and aria-describedby is used as a way to access descriptions that are otherwise hidden from all users (including screen reader users), another problem emerges. In that case, aria-describedby cannot be silent by default in screen readers when used on images, compromising its use to illustrate that the content of an image is already available on the page. Developers may not realize the distracting and frustratingly circular user experience that this would cause and might use aria-describedby to point to, for example, a paragraph just above the image. Users would then likely follow the aria-describedby announcement, expecting to find additional content, but they would arrive, instead, at a paragraph that they have likely just read.

We urge the W3C HTML Working Group to write out the expected implementation and user experience details of any proposed replacements for the longdesc attribute to be sure that they will be at least as effective as the longdesc attribute in practice.

Podcast #83: Fate of Longdesc in HTML5

What’s the fate of the “longdesc” attribute in HTML5? Can or should the “aria-labelledby” ARIA attribute replace it? These are some of the controversial issues discussed by Dennis and guests John Foliot (@johnfoliot), Everett Zufelt (@ezufelt), and Joe Dolson (@joedolson).

Download Web Axe Episode 83 (Fate of Longdesc in HTML5)

[transcript of podcast 83]

Related Links

Open Web Camp 6 – a brief review

Recently I attended Open Web Camp 6 (@OpenWebCamp) at the beautiful PayPal headquarters in sunny San Jose, California. Like every year, the event is coordinated by @JohnFoliot. If you want to review the Twitter feed, the hash tag is #OWC6.

Like last year, the cost of the event was only $10, and attendees get a nice lunch, a t-shirt, and some other swag. The networking was good and the energy was great!

Featherstone standing in front of a projected slide
Derek Featherstone presenting at OWC6

There was a variety of topics but accessibility was the most prominent. Here are the highlights:

  • Derek Featherstone (@feather) presented Accessible Design: Which “everyone” do you mean? where he discussed accessibility challenges for users of assistive technology such as voice recognition and screen magnifiers.
  • Dylan Wilbanks (@dylanw) presented a thought-provoking session Meditations on making fire-proof, failure-proof, future-proof things.
  • Dirk @Ginader presented Teach your Browser new tricks where he discusses longdesc and browser extensions.
  • @KarlGroves spoke about accessibility testing and his app Tenon.
  • The Twitter talk “Connecting to the pulse of the planet” was disappointing. It was much more of a 25-minute sales pitch than a tech talk.

All in all, it was another successful web event. Hoping for an OWC7!

Factoid: I’ve attended every OWC event since its inception at the first Open Web Camp at Stanford, and spoke about the then newly created @EasyChirp (then called Accessible Twitter).

Easy Chirp now provides accessible images for your Tweets

Although improving, accessibility of Twitter and third-party applications has been an issue over the years, and even more so, the images within tweets.

You can now provide accessible images for your Tweets using the web-accessible Twitter client Easy Chirp (@EasyChirp) which allows a title (a short description) and a long description to be entered along with the image. The title is required.

EasyChirp2 logo beta

This announcement comes on May 15 in recognition of Global Accessibility
Awareness Day (#GAAD).

Web Axe author Dennis Lembree is also the founder of Easy Chirp. Last month, Mark Sadecki of the W3C (@cptvitamin) approached Dennis with an idea for authoring/posting accessible images on twitter. Together they brainstormed a plan.

Dennis implemented the plan within a couple weeks but ran into issues during testing. Proper support for the longdesc attribute is still behind in some browsers and assistive technologies. To ensure that everyone has access to the long description, it will also appear directly in the content of the page. Addendum: Here’s an example of the final image page.

Easy Chirp also provides a help page which explains the difference between a short and long description and provides information on a couple limitations of the feature.

To create a tweet with an accessible image:

  1. Log in to Easy Chirp with your Twitter account.
  2. Select Write Tweet.
  3. Select Add Image.
  4. Select an image from your device.
  5. Enter a title of the image (short description).
  6. If necessary, enter a long description of the image.
  7. Click the Upload Image button. A URL will be inserted in the tweet input (textarea).
  8. Finish writing the tweet and click the Post button.
  9. Happiness!

Please help the accessibility of the Twittersphere and write a long description or two. Need some ideas? Here are some tweets with interesting images that you can re-post. But be sure to credit the original author!

The image hosting service itself is provided via the Imgur API.