HTML 链接和可用性
网页上的链接是否应该始终带有下划线？
我不认为这应该是一个硬性规定！
不久前，我在我的 博客 上就此发表了评论另一位开发人员抱怨我没有遵循网络标准。 它又出现了，我想知道你的想法。 她的论点是，为了一致性和可用性，所有链接都必须始终加下划线。 我的经理同意了，所以我在 CSS 中更改了两行，就完成了。 我不介意做这项工作，但我认为该网站的可用性现在较低。 有太多的事情在尖叫着吸引你的注意力。
我应该提到的是，这是一个包含许多数据输入页面的网站。 有问题的链接是页面左侧标题为“菜单”的框中的导航链接。 当您将鼠标悬停在链接上时，下划线确实会出现，并且当用户将鼠标悬停在链接上时，背景颜色会发生变化。 我真的不敢相信我竟然在进行讨论。 当我的经理同意时，我更加震惊。
我错了吗？ 我还应该提出什么其他论点？ 谢谢！ :)
Should links on a web page ALWAYS be underlined?
I do not believe this should be a hard and fast RULE!
I wrote a comment on my blog awhile back about this after another developer complained that I was not following web standards. It is coming up again, and I want to know what you think. Her argument was that for consistency and usability, ALL links had to be underlined ALL the time. My manager agreed, so I changed two lines in a CSS, and it was done. I did not mind doing the work, but I think the usability of the site is less now. There are way too many things screaming for your attention.
I should mention that this is a web site with many pages of data entry. The links in question were navigation links to the left of the page in a box that was titled "Menu". The underline did appear when you hovered over the link already, and the background colour changed when the user hovered over the link. I really could not believe I was even having the discussion. I was even more shocked when my manager agreed.
Am I wrong? What other arguments should I have made? Thanks! :)
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（11）
我认为所有链接都需要与普通文本区分开，但不一定带有下划线。 菜单和导航栏在网站上是相当标准的，并且通常是可以识别的，所以我认为它们有点太教条了。
I think all links need to be distinguishable from normal text, but not necessarily underlined. Menus and navigation bars are pretty standard on websites, and are usually recognisable as such, so I think they are being a little too dogmatic.
询问 Jakob Nielsen，他会说是的，所有链接都必须带有下划线且为蓝色。 不过，看看他的网站。 毫无疑问，它是完全可用的，但是（他认为）它走极端来证明他的观点。
我同意这里的人，因为您首先必须清楚地区分整个页面中的其他文本的链接，但将它们全部加下划线可能有点过分了。
我的建议：在文本主体中的链接下划线，因为这些需要更多的努力才能脱颖而出。 导航链接如果在悬停时加下划线应该没问题，或者根据情况（以及您的整体设计是否良好且足够一致）甚至考虑根本不加下划线。
最后，一切都归结为取决于。 你的老板刚刚同意了最有可能、无风险的路径。
Ask Jakob Nielsen and he'll say yes, all links must be underlined and in blue. Still, look at his site. It's downright usable, no doubt, but (and he assumes it) it goes to extremes to prove his point.
I second the people here in that you must above all clearly distinguish links from other text throughout the page, but having them all underlined might be overkill.
My suggestion: underline links within the main body of text, because these need a bit more effort to stand out. Navigation links should be fine if underlined when hovered or, depending on the case (and whether your overall design is good and consistent enough) even consider not underlining them at all.
At the end, it all boils down to depends. Your bosses just agreed on the most probable, no-risk path.
我认为你需要一个很好的理由不以某种方式让链接脱颖而出。 也许没有下划线，但一眼就能看出某个东西是一个链接。 没有什么比进入一个新网站并在整个页面上移动鼠标试图找出应该单击的内容更糟糕的了。
另请参阅神秘肉导航
I think that you would need a very good reason not to have links standout in some way. Maybe not underlines, but it should be very apparent at a glance that something is a link. There is nothing worse that going to a new site and moving the mouse all over the page trying to figure out what should be clicked on.
See also Mystery Meat Navigation
我不认为所有链接都必须始终带有下划线，但它们应该与周围的文本分开。 通常，蓝色和/或下划线表示链接，但这取决于您网站的布局。
不过，我警告您在强调非链接内容时要非常小心。 这可能会误导用户。
@Brad Wilson 提出了关于色差和色盲用户的一个很好的观点。 我可能是错的，但我相信大多数（全部？）色盲的人只能看到某些颜色之间的差异，但不是全部。 也许您可以选择始终呈现对比的颜色？ 当然，我认为使用屏幕阅读器的用户也会丢失颜色差异（可能还有其他格式属性，例如下划线）。
至少可以说，可访问性带来了许多有趣的挑战。 无障碍倡导团体对这些问题有何建议？
I don't think all links must always be underlined, but they should be set apart from the surrounding text. Generally, blue and/or underline will indicate a link, but it depends on the layout of your site.
I would warn you to be very careful about underlining things that are not links, though. That may mislead users.
@Brad Wilson brings up a good point about color differences and color-blind users. I could be wrong, but I beleive most (all?) color-blind people are only unable to see the difference between certain colors, but not all. Perhaps you could choose colors that always show contrast? Of course, I imagine that color differences (and probably other formatting attributes, such as underlining) are also lost to users using screen readers.
Accessibility brings up a lot of interesting challenges, to say the least. What do Accessibility advocacy groups recommend for these issues?
我想你是对的。 如果有一条“硬性规定”，那就是：网页上的链接应该始终具有可供性。
换句话说，如果用户明白他要点击它，那么它就可用，即使它没有下划线。 它可以看起来像一个按钮，或一个标签（如本网站每个页面上的标签），或带有箭头的方框菜单，或用户根据经验识别为单击的任何其他内容。
（请记住，这不足以在悬停时显示可供性。这只是部分功劳。用户不必将鼠标悬停在页面上并查看悬停在其上方时哪些文本“执行某些操作”。）
You're right, I think. If there is a "hard and fast rule," it's this: links on a web page should always have an affordance.
In other words, if the user understands he's meant to click on it, then it's usable, even if it's not underlined. It can look like a button, or a tag (like the ones on each page of this site), or a boxy menu with an arrow, or anything else a user recognizes from experience as something that's clicked on.
(Keep in mind that it's not enough to show affordance on hover. That's only partial credit. The user shouldn't have to mouse around the page and see which text "does something" when hovered over.)
一般来说，链接应该带有下划线（并且是蓝色的！）。 如果您不想在它们下划线，也可以，只要它们是可识别的即可。
为非链接的文本添加下划线比不为链接添加下划线要糟糕得多。
Generally speaking, links should be underlined (and blue!). If you don't want to underline them, that's fine, as long as they're identifiable.
Underlining text that isn't a link is far worse than not underlining links.
我同意，我认为下划线不应该用于非链接的任何内容。
有些事情不需要强调。 页面导航、菜单中的项目、上一个/下一个链接（尤其是带有箭头的链接）只是一些示例。 我仍然建议在悬停时给他们一个下划线是强制性的。
I agree, I don't think that underline should be used for anything that is not a link.
There are certain things that need not be underlined. Page navigation, items in menus, prev/next links, especially if they have arrows are just some examples. I would still suggest that giving them an underline on hover be mandatory.
最好的选择是从蓝色开始并带有下划线的链接，只有当你有理由这样做时才改变。 人们期望蓝色/下划线，所以显然这将是“最好的”，特别是就正文中的链接而言。 然而，建议链接必须是这种方式是荒谬的。 我想说下划线比蓝色更重要，因为与常规文本的对比度才是重要的（对比度指的是形状、粗细以及颜色。
只要它看起来相当有联系，人们就会认为它是 链接，因此不必太担心严格遵循默认值，但如果有疑问，使用熟悉的内容无疑是最好的方法。
The best bet is to start with blue and underlined for links and only deviate when you have a reason to do so. People expect blue/underlined so obviously this would be "best", particularly as far as links in body text go. However, it would be absurd to suggest that links must be this way. I would say that underlining is more important than blue, since the contrast with regular text is what's important (contrast refers to shape and weight as well as colour.
As long as it looks fairly linky people will assume it is a link so don't worry too much about strictly following the defaults, but using what's familiar is certainly the best way to go if in doubt.
可用性最困难的方面是每个站点/项目都是不同的，并且每个元素都有不同的目的。 我同意带下划线的链接可以促进可用网站的观点，但是我不认为不带下划线的链接会导致任何可用性问题，只要它们的样式与文本或其他内容区分开来。他们周围的元素。 这些是应该在设计时做出的决定； 当您等到实施才决定链接颜色时，您就将可用性置于危险之中。 设计应该经过深思熟虑和精心设计，以便用户清楚地了解导航方案。 这是否意味着您必须在链接下划线？ 嗯，这取决于您的用户或受众。 如果您的目标受众是精通互联网的类型，我认为您在链接外观方面有更多的灵活性。 对于公共信息和/或政府网站，我倾向于采用“标准”外观。
就你的情况而言，我认为你有一个非常有力的论据； 有问题的链接位于一个名为“菜单”的框中，因此如果用户单击该框中的某个项目，他们就已经期望会发生一些事情。 您可以提出的一个论点是，它为了可用性而牺牲了网站的外观和感觉，从而降低了整体用户体验。
The most difficult aspect of usability is that every site/project is different, and every element serves a different purpose. I agree with the sentiment that underlined links foster a usable site, however I don't think that links that aren't underlined would cause any usability issues as long as they are styled in such a way that sets them apart from the text or other elements that surround them. These are decisions that should be made design-time; when you wait until implementation to decide on link colors, you put usability at stake. Designs should be well thought-out and carefully crafted in such a way that the navigation scheme is clear to the user. Does this mean you have to underline links? Well, that depends on your user or audience. If your intended audience is internet-savvy types, I would think that you have a little bit more flexibility when it comes to link appearance. For public information and or government sites, I would tend to go with "standard" appearances.
In your case, I think you have a pretty strong argument; the links in question were in a box entitled "Menu," so the user already would have an expectation of something happening if they had clicked an item in that box. One argument you could make is that it sacrifices the look and feel of the site for usability, which decreases the overall user experience.
我对此的一般看法是：
为链接选择一种醒目的颜色，使其在整个网站中保持一致。
悬停时下划线仅适用于菜单、选项卡等。
并且（可选）始终在段落内的链接上加下划线。
My general take on this:
Pick a standout color for the links, make it consistant trhough all the site.
Underline on hover only for menus, tabs, etc.
And (optionally) underline always on links that are inside paragraphs.
链接，就像任何指定某种交互的东西一样，应该在页面的其他内容中脱颖而出。 但这并不一定意味着链接应该带有下划线。 冷漠而严格地遵守标准（下划线和蓝色）通过定义绝对边界来限制创新。 如果你从人机交互设计的角度来思考，用户会在视觉上被那些看起来与周围事物不同的元素所吸引。 根据如何将不同的视觉元素布局在一起，您可以实现相同级别的自动功能感知，而无需依赖这些标准样式定义。 当然，尝试重新发明标准的挑战是，如果你失败了，那么你最终只会让用户感到困惑。
Links, like anything that designates some sort of interaction, should standout among the other content of the page. This does not necessarily mean that the links should be underlined though. A cold and hard adherance to standards (underlined and blue) limits innovation by defining absolute boundaries. If you think of it in terms HCI design, users are visually drawn to those elements that look different then those things around them. Depending out how you layout different visual elements together, you can achieve that same level of automatic awareness of functionality without relying on those standard style definitions. Of course the challenge of trying to reinvent the standards is if you fail, then you are just going to end up confusing the user.