如何使网页中的脚注可访问? [英] How to make footnotes accessible in an web page?
问题描述
在 PDF 文档中，有时会在每页的末尾放置脚注，以阐明某些术语或添加附加信息.
<块引用>例如:
我希望创建一个与脚注等效的 HTML 网页.
页面必须符合 Web 内容可访问性指南 (WCAG) 2.0 下的可访问性指南，AA 级.网页也必须是 HTML4.
我的第一个想法是像维基百科上的参考资料部分那样创建脚注.但是，我的网页可能很长，我担心这样做可能会使人们迷失方向，并导致他们在需要一直向下滚动然后再向后滚动时忘记正在阅读的内容.因此，这将无法访问.(如果我错了，请纠正我.)
Javascript 显然是行不通的，因为有些用户可能选择禁用它，因此无法访问依赖它.
我考虑使用提供的附加信息打开一个新窗口.然而，打开一个新窗口也会在可访问性方面打开一个全新的蠕虫罐头，所以如果可能的话，我宁愿避免它.
我知道有一个 <cite> 标签，但根据我的理解，这个标签是为了引用参考文献，如果我的目的是提供附加信息，则不合适.(再次，如果我错了，请纠正我.)
所以我的问题是，添加到我的网页的最佳方式是什么，相当于 PDF 文档上的脚注 - 前提是我的网页必须是可访问的?
我会这样做:
第一个链接将读者带到脚注，脚注链接回到文本位置.
<头><title>标题</title><style type="text/css">.向上{垂直对齐:超级；}</风格><身体><div>Lorem ipsum dolor sat <a href="#note1" id="number1">amet<span class="up">1</span></a>, consetetur satipscing elitr, sed diam nonumy eirmod temporinvidunt ut Labore et dolore magna aliquyam erat, sed diam voluptua.在 vero eos et accusam et justo duo dolores et ea rebum.Stet clita kasd gubergren，无海 takimata sanctus est Lorem ipsum dolor 坐 amet.Lorem ipsum dolor sat amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut Labore et dolore magna aliquyam erat, sed diam voluptua.在 vero eos et accusam et justo duo dolores et ea rebum.Stet clita kasd gubergren，无海 takimata sanctus est Lorem ipsum dolor 坐 amet.Lorem ipsum dolor sat amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut Labore et dolore magna aliquyam erat, sed diam voluptua.在 vero eos et accusam et justo duo dolores et ea rebum.Stet clita kasd gubergren，无海 takimata sanctus est Lorem ipsum dolor 坐 amet.<div><div><a href="#number1" id="note1">1 更多信息</a></div>
</html>
In PDF documents, footnotes are sometimes placed at the end of each page to clarify certain terms or add additional information.
For example:
I wish to create an HTML web page with the equivalence of footnotes.
The page must meet the accessibility guidelines under Web Content Accessibility Guidelines (WCAG) 2.0, Level AA. The web page must also be in HTML4.
My first thought is to create footnotes like the References section on Wikipedia. However, my webpage could potentially be very long, and I fear that doing so may disorient people and cause them to lose track of what they were reading if they need to scroll all the way down and then back up. Thus, this would not be accessible. (Please correct me if I'm wrong.)
Javascript is obviously a no-go since some users may chose to disable it, so relying on it will not be accessible.
I considered opening a new window with the additional information provided. However, opening a new window opens a whole new can of worms in regards to accessibility as well, so I would prefer to avoid it if possible.
I am aware that there is a <cite> tag, but from my understanding, this tag is to cite references, and would not be appropriate if my purpose is to provide additional information. (Again, please correct me if I'm wrong.)
So my question is, what would be the best way to add to my web page, something equivalent to footnotes on PDF documents - provided that my web page must be accessible?
I would do something like this:
The first link brings the reader down to the footnote, the footnote link back to the text-position.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Title</title>
<style type="text/css">
.up
{
vertical-align: super;
}
</style>
</head>
<body>
<div>
Lorem ipsum dolor sit <a href="#note1" id="number1">amet<span class="up">1</span></a>, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
</div>
<div>
<div><a href="#number1" id="note1">1 Some more info</a></div>
</div>
</body>
</html>
这篇关于如何使网页中的脚注可访问?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
