链接和超文本
链接文本和外观

链接文字

避免不提供信息的链接短语

当链接在上下文中有意义时,链接会更有用作者应避免使用非信息性链接短语,例如:

  • 点击这里
  • 这里
  • 更多
  • 阅读更多
  • 链接到[某个链接目的地]
  • 信息

事实上,“点击这里”这个短语是不必要的,即使它在一个更有意义的短语之前For example, a link that says "click here to access today's weather" can be shortened to "today's weather." In some cases it may make sense to precede a link phrase with "more" or "read more about," (e.g“更多关于全球变暖”,但如果可以避免这些额外的话,最好避免它们(例如“全球变暖”可能传达与“更多关于全球变暖”相同的含义,具体取决于具体情况。

url的链接

Web地址或URL提出了两种类型的挑战:

  1. 可读性
  2. 长度

URL并不总是人类可读或屏幕阅读器友好许多URL包含数字,字母,&符号,破折号,下划线以及对脚本和数据库有意义但对普通人来说几乎没有意义的其他字符的组合在大多数情况下,最好使用人类可读的文本而不是URL人类可读的链接Constructing 万博体育官网网址 Web Sites比在Amazon.com上以相同标题购买书籍的链接更加用户友好,该链接包含一个108个字符的链接,其中包含数字,斜线和文字,这些链接不是非常易读的(http://www.amazon.com/exec/obidos/ASIN/1590591488/qid=1116957951/sr=2-1/ref=pd_bbs_b_2_1/103-5755258-8204633)

Does this mean that URLs should never be used as links? No如果URL相对较短(例如站点的主页),则URL可以用作链接文本关键是要考虑屏幕阅读器用户,他们必须倾听更长,更不易理解的网址。

链接外观

链接应该是什么样的链接,而不是其它如果用户试图点击看起来像链接但不是链接的文字短语或图形,则可能会感到沮丧如果他们不得不在整个页面上移动鼠标试图发现看起来不像链接的链接,他们也会感到沮丧。

下划线

浏览器默认为超文本链接加下划线可以使用层叠样式表(CSS)删除下划线,但这在大多数情况下都是一个坏主意用户习惯于看到带下划线的链接在正文中,如果不使用下划线约定,它们可能或可能无法确定链接了哪个文本。

Although users are accustomed to seeing links in the main content underlined, they are also accustomed to seeing tabs and main navigational features (oftentimes created as graphics rather than text) without underlining在这些情况下,有关项目应设计成很明显,用户可以点击执行一个动作。

请注意

WCAG 2.0有两个额外的要求身体默认不强调文本链接:

  1. 链接文本必须与周围的非链接文本具有3:1的对比度。
  2. 该链接必须在鼠标悬停和键盘焦点上呈现“非颜色指示符”(通常是下划线的引入)。

这两个要求有助于确保所有用户都可以将链接与非链接文本区分开来,即使它们视力不佳,颜色不足或页面颜色被覆盖也是如此。

悬停和聚焦效果

许多网站已经实现视觉鼠标悬停效果的链接,如添加背景光、阴影、颜色变化,或强调这些影响帮助用户知道该产品可以被点击,鼠标焦点是一个特定的链接。

这些影响与设备无关,它是必要的,以确保它可以激活通过鼠标或键盘在CSS中,这意味着使用的:徘徊:专注伪类。

重要

几乎任何时候答:悬停(或其他悬浮效果)中定义CSS,它应该被修改a:悬停,a:焦点确保键盘用户导航或“标签”链接时可以使用相同的视觉演示。