A way to keep the longdesc target in the same document

Longdesc footnote 1.

• Back to image 1.

1. Implementing the longdesc feature

Two questions perhaps lays behind this text:

1. How can we generalise the features that longdesc provide?
2. How can we generalise the longdesce attribute for other purposes than just as a feature for non-sighted?

1.1. Longdesc as “accessibility footnotes”

and other thoughts about how to get support for long descriptions of images in HTML 5.

1.1.1. Classic use of longdesc

The traditional longdesc solution is to keep the long description in another, external document. This has some advantages:

1. It allows the author to easily read it and work with it.
2. Since a (longdesc) link does not require JavaScript, it should be widely accessible.
3. For unsighted users, keeping the long description outside the document, ensures that they do not, accidently, start to read the description out of context (for instance, as a continuation of the last paragraph of the page, instead of as a commentary to an image at another location on the page.).

1.1.2. Disadvantages of the classic use.

1. Authors find it cumbersome with many documents. It is handy to build things that belongs together into the one and same document.
2. When kept inside another document, it requires something extra from the user to read it. One are reluctant to load another document.
3. Sighted users especially espect thigns to happen in the same document. So, as simply a dull page at an external URI, longdesc is not likely to develop into something that all users can make use of.

1.1.3. Lack of a proper way to do it.

But, apart from the, till now, shortcomings of most UAs, authors are in lack of good descriptions about how to create good longdesc users experiences. Though, there have been some attemts. (I don't proclaim to know them all.)

1.1.4. Building on an idea

One of the best ideas is the idea of keeping the long descriptions as «accessibility footnotes». I myself made a proposal that reminds about this idea to the HTML5 working group.

The accessibility footnote idea is at least 4 years old. (See Andy Clarke at Stuff and nonsense.) Andy Clarke, in his example page, kept the footnote inside the same page (that is why it is called a footnote), but hides it for sighted users via the the CSS style display:none; .footnotes{position:absolute; left: -9999px;}, which moves the text outside the screen.

1.1.5. Simple. But does ot work?

Andy Clarke's example is close – on the idea level – to what I want to achieve, namely: Somethingh which is hidden for normal users. But I still see 2-3 problems with his particular approach:

1. Does the display:none solution actually work for those that use Screenreaders? Doesn't the screen reader need to be able to see the stuff on the screen, in order to make it avablable to the user?
2. I also want that sighted users shall be able to see the longdesc descrption: The author needs to check it to see that he got it right. At best by activating a link, and not through fiddeling with setting display:block or something, in the code.
3. At the best, the author and all users should be able to click a link to read the longdesc. It should be there. Be visible. But not disturb anyone.
4. Perhaps just another way of phrasing the same thing: Clarke's example is not very interactive. (But then it is 4 years old).

1.1.6. You read this now. So, does my idea work?

This is still an early attemt. In its current shape and form, it works the best in Firefox.

• One of the problems is avoiding that the user has to click inside the window or tab in order to scroll what he want to scroll.
• I have not checked INternet Explorer very much. Internet Exploer 8 beta 1 had prohblems. I don't know about the others.

1.1.6.1. Update: Clarke's method

I have not discussed which kind of CSS I have used in this text. But my first approach was to fiddle with overflow:hidden and overflow:scroll for the HTML and the BODY elements. Clarke, however and as told, set the longdesc footnote to have .footnote{display:absolute;left:-99999px;}. Now have also implemented his method, with the difference that activating the longdesc URI now moves the footnote inside the window, in front of the rest of the page. Perhaps this method is in fact simpler to master. In both implmentations, the CSS :target selector plays a key role.

1.2. Inspiration: A cite attribute implementation

• HTML4 requires that longdesc is available with another method than reguler links. This because images often are used as links. And then you need a way to both access the link, and the long description. (Frankly, I wonder if that particular situation, is an edge case – which therefore only creates "hick-ups" (did I hear "hixie-ups"?) in certain brains which are allergic to unrealistic use cases (or sometihng).)

  For that reason, but mostly because of other reasons, I don't think we should focus soe much on that edge case. We could instead take a look at how Opera Anne van Kesteren has implmented support for the cite attribute of the blockquote element. For instance, take a look at this reader comment in Anne van Kesteren's blog, which quotes another comment. Notice that right-pointing arrow there? I am not certain how Anne does it. Is it Javascript? Apparently. At any rate, this a visible sign that tells that there is source for this text. How about a ! (an exlamation mark) or an i (info-sign) as a link that users can click ot get a long description? (Incidently, the Internet Explorer 8 implementation, which is said to display the longdesc URI as a tool tip, could very good provided it became possible to click that tooltip)

1.3. Longdesc as a general footnote/endnote implementation?

• A longdesc is a footnote, isn't it? Doesn't all users need footnotes? Sighted or not? It is a reason that footnotes and endnotes are not mangled with the text, right? Yes, of course, sometimes footnotes tells you the source of a quote. But other times, footnotes gives extra information. Explain things that normal users can jump over and so on. So how about advocating longdesc as a kind a general "hidden footnote" feature? Perhaps it even could expanded to more elements?

1.4. Longdesc as a HTML 5 Automatic cross referencing feature?

• HTML 5 says:

  The dfn element enables automatic cross-references. … [for] any span, abbr, code, var, samp, or i … [whose] title attribute … equals the term of a dfn element in the same document, … [it] should be presented in such a way that the user can jump … to the first dfn element giving the defining instance of that term.

  My reply:

  1. First, note that vague term should be presented in such a way that the user can jump …
  2. Must we not assume that the idea is that such a way is supposed to differ – in some way – from regular links?
  3. Thus, I think we can conclude with an analogy to how longdesc works

  Hence, why not specify the longdesc feature as part of this cross-referencing feature? In other words, simply let the longdesc feature be understood like this:

1.4.1. IMG as a cross-reference element

• 1. The img element is included amongst the elements (span, abbr, code, var, samp and i) that can enable automatic cross-referencing.
  2. For img, this can be achieved both with and without the longdesc attribute.
  3. However, the longdesc is required when the user wants to link to an external document - as, otherwise, the HTML 5 cross-referening feature only includes links inside the same document. Thus, inside the document, this is not needed.
  4. But the same way, we could also allow the longdesc attribute to be used on all the cross-ferencing element, when those elements needs to reference a source outside the same document.
  5. The long description must then be written using contain the dfn element.

1.4.2. Hiding the long description: A separate issue.

• 1. The issue of hiding the long description from the (regular) user (which is an issue which allready the current status implements, if not per HTML 4's spesification, then at least in practise), can thus be separated from the issue of having the cross-reference at all. We have two options:
     • Either we judge that cross-references/long descriptions for images should be hidden by default.
     • Or we can specify a condiction which should hide the the long description. One natural criteria could be the presence of the longdesc attribute, whose URI is a fagrement uri (#localURI). Thus, when ther isn't a pure (i.e. links to a fragment of another page is another issue) fragment URI inside the longdesc, then the UA should not try to hide the long description.

1.4.3. Possible counter arguments

• 1. Of course, it would be possible for some to argue that we could just wrap the img inside a span element, or even a a element. However,
     1. there is nothing that hinders the a element from being wrapped around span, i, attr var and samp either, and
     2. thus, this argument cannot have more truth about img that it can can have for these other elements.

1.4.4. Possible extensions on the idea

• It would be thinkable to add longdesc/cross-referencing to the new multimedia elements as well: video, audio.

1.4.5. Winning the battle

• Presenting the longdesc URI/issue/feature in the framework of the cross-referencing feature is not only logical, it could also (but hopefully not) serve to tell use whether certain opponenst simply are against longdesc by default – not matter the implementation, or if the are able to see how it compares to cross-referencing.
• Hopefully it could even open someones eyes and ensure support.

1.5. Implementation issues

1.5.1. Backlinks, where should they lead?

• For sighted users, they should lead to something above the image, but not necessarily to the very image. (In other words, is my current design in fact focused on sighted users, as the backlink leads to the neares header/logical place above the images?) But non-sighted users might not find that so handy - they might want to go straight back to the image, or after the images. What do a Jaws user need?

  1.5.1.1. My take

  • I think the link should go straight back to the image.
  • Also, considering the cross referening function, I wonder: Has it not been thought about this issue in that context? Doesn't users need to go back to the context they were reading there also?
  • Or is it thought, and shoud we think, that the browser's back button should be used?

1.5.2. Formal restrictions on the mark-up of descriptions?

• Should there be restrictions on which elements a long description can contain? For instance, should it contain images? If so, then we are taking away the focus of sighted users - as a general footnote feature, they might want to have images now and then. However, I guess, then we could have longdescription of those images again? Certainly possible.

  1.5.2.1. My take

  • It seems to me we need to separate longdesc in the narrow sence - as a help for nonsighted users, and in the broader sence, as part of cross-referenceing.
  • And perhaps leave things to common sense: There is, currently, nothing that hinders that a long description of an image itself contains images.

1.5.3. Backlinks: Restrictions where they can lead?

• Would it be good if the longdesc attribute somehow could fucntion as a «backlink ID»?

  It would at least be good if the backlinking could happen automatically and safely, and always only lead back to the image.

  But fact, including the longdesc feature into the automatic cross-referencing feature ought to ensure that, see above.

1.6. What needs to be done?

1. Improve this, and other examples. Do you see better solutions? Simpler solution? This is "open source" code.
2. Work out the requirements: What exactly does a Screenreader need? Can a Screenreader use JavaScript? I have no clue about that? Because, if it can, then there are many Ajax solutions that possibly could be used, as well
3. Spread the idea. Spread the thoughts.
4. Get vendors involved.
5. Specify a test case.

Regarding the last two points, it should be evident from my post to the HTML5 working group that, that I was inspired by the Acid2 test, especially that part which tests the CSS overflow property, which can entirely hide the scroll bar. But this also shows that in order to get thigns going, we need to get the vendors aboard. We must define sometihng that is useable and userful, and get them aboard to support it.

• Back to image 1.

Longdesc footnote 2

• Back to image 2.

Some other links, to see where you land:

• • a zero height element just after the body tag.,
  • the top of the body element.

long descrption to image 2

This is just fake content, to proof that it is possible with more than one long descriptino per page.

Line 1 of 44 of the 2nd longdesc description

Line 2 of 44 of the 2nd longdesc description

Line 3 of 44 of the 2nd longdesc description

Line 4 of 44 of the 2nd longdesc description

Line 5 of 44 of the 2nd longdesc description

Line 6 of 44 of the 2nd longdesc description

Line 7 of 44 of the 2nd longdesc description

Line 8 of 44 of the 2nd longdesc description

Line 9 of 44 of the 2nd longdesc description

Line 10 of 44 of the 2nd longdesc description

Line 11 of 44 of the 2nd longdesc description

Line 12 of 44 of the 2nd longdesc description

Line 13 of 44 of the 2nd longdesc description

Line 14 of 44 of the 2nd longdesc description

Line 15 of 44 of the 2nd longdesc description

Line 16 of 44 of the 2nd longdesc description

Line 17 of 44 of the 2nd longdesc description

Line 18 of 44 of the 2nd longdesc description

Line 19 of 44 of the 2nd longdesc description

Line 20 of 44 of the 2nd longdesc description

Line 21 of 44 of the 2nd longdesc description

Line 22 of 44 of the 2nd longdesc description

Line 23 of 44 of the 2nd longdesc description

Line 24 of 44 of the 2nd longdesc description

Line 25 of 44 of the 2nd longdesc description

Line 26 of 44 of the 2nd longdesc description

Line 27 of 44 of the 2nd longdesc description

Line 28 of 44 of the 2nd longdesc description

Line 29 of 44 of the 2nd longdesc description

Line 30 of 44 of the 2nd longdesc description

Line 31 of 44 of the 2nd longdesc description

Line 32 of 44 of the 2nd longdesc description

Line 33 of 44 of the 2nd longdesc description

Line 34 of 44 of the 2nd longdesc description

Line 35 of 44 of the 2nd longdesc description

Line 36 of 44 of the 2nd longdesc description

Line 37 of 44 of the 2nd longdesc description

Line 38 of 44 of the 2nd longdesc description

Line 39 of 44 of the 2nd longdesc description

Line 40 of 44 of the 2nd longdesc description

Line 41 of 44 of the 2nd longdesc description

Line 42 of 44 of the 2nd longdesc description

Line 43 of 44 of the 2nd longdesc description

Line 44 of 44 of the 2nd longdesc description

• Back to image 2.