您现在的位置是：网站首页> 编程资料编程资料
网页设计制作之改进超级链接效果_HTML/Xhtml_网页制作_
2023-10-07
261人已围观
简介 Hyperlinks enable people to jump instantly from page to page, or site to site. Such power can create anxiety. 超链接可以使访问者从一个页面跳转至另外一个页面，或从一个站点跳转至另外一个站点。但是，这种频繁的跳转可能使人们产生焦虑。 To help users
Hyperlinks enable people to jump instantly from page to page, or site to site. Such power can create anxiety.
超链接可以使访问者从一个页面跳转至另外一个页面，或从一个站点跳转至另外一个站点。但是，这种频繁的跳转可能使人们产生焦虑。
To help users browse with confidence, links should be absolutely clear and explicit.
为了方便用户更好的浏览页面，超链接必须绝对的简洁明了。
Principles
法则
1. Text hyperlinks should be clearly distinguishable from normal text.
超链接文字必须与普通的内容文字相区别
2. Any mouseover behaviour should have a highlighting effect.
鼠标移动到超链接上时必须要显示突出效果
3.Hyperlink content should be as short as possible, yet long enough to identify either:
超链接的具体内容必须要言简意赅（短而精）：
·Where you'll go [跳转地址]
·What you'll get [希望获取什么内容]
·What you want to happen [希望产生什么效果]
4. Hyperlinks with different targets should be clearly distinguishable.
指向不同目标的超链接必须要清晰可辨
5. Hyperlinks should give an indication of any unanticipated consequences, e.g.:
对点击超链接后会出现的特殊情况加以解释，如：
·Links to files [链接至一个文件]
·Links that open or close windows [点击链接后会打开或关闭窗口]
What do you make a link?
考虑一下制作这个超链接的目的是什么
Hyperlink content example: Amapproved.com
超链接内容举例：Amapproved.com
A site for locating approved Aston Martins, and it's good on the whole. This is the search results screen. Guess how you get from search results to see the details on a particular vehicle? The only link is the vehicle model (in the Vehicle summary column).
这个案例是Aston Martins [阿斯顿·马丁] 汽车的网站。可以这样说，它的整体外观设计堪称经典。这是一个搜索结果显示页面。那么现在，你想象一下，该如何通过搜索结果的方式来查阅有关车辆的详细介绍。这里仅有的超链接就是关于“Vehicle summary column [车辆基本列表]”中的“vehicle model[车辆模型]”。
The first, and biggest problem, is that you can't distinguish the hyperlinks, breaking Principle 1. You don't know where to click to get more information: you have to guess.
首先所面临的最大问题就是，你不能区分那个是超链接。这违反了法则1，即：你不知道该点击那里来获取更多的信息，因此，你必须先考虑这个问题
The second problem is: The links look the same although they point to completely different targets (each one is a different used Aston Martin). This breaks Principle 4. Because all the links on this page have the same content (the vehicle model), it's even less obvious that they might be the link.
第二个问题是：尽管这些链接指向完全不同的目标（每个不同的链接都使用了名称“Aston Martin”），但它们看上去几乎一样，这就违反了上述的法则4；再加上所有的链接都包含了相同的内容（vehicle model [车辆类型<
超链接可以使访问者从一个页面跳转至另外一个页面，或从一个站点跳转至另外一个站点。但是，这种频繁的跳转可能使人们产生焦虑。
To help users browse with confidence, links should be absolutely clear and explicit.
为了方便用户更好的浏览页面，超链接必须绝对的简洁明了。
Principles
法则
1. Text hyperlinks should be clearly distinguishable from normal text.
超链接文字必须与普通的内容文字相区别
2. Any mouseover behaviour should have a highlighting effect.
鼠标移动到超链接上时必须要显示突出效果
3.Hyperlink content should be as short as possible, yet long enough to identify either:
超链接的具体内容必须要言简意赅（短而精）：
·Where you'll go [跳转地址]
·What you'll get [希望获取什么内容]
·What you want to happen [希望产生什么效果]
4. Hyperlinks with different targets should be clearly distinguishable.
指向不同目标的超链接必须要清晰可辨
5. Hyperlinks should give an indication of any unanticipated consequences, e.g.:
对点击超链接后会出现的特殊情况加以解释，如：
·Links to files [链接至一个文件]
·Links that open or close windows [点击链接后会打开或关闭窗口]
What do you make a link?
考虑一下制作这个超链接的目的是什么
Hyperlink content example: Amapproved.com
超链接内容举例：Amapproved.com
A site for locating approved Aston Martins, and it's good on the whole. This is the search results screen. Guess how you get from search results to see the details on a particular vehicle? The only link is the vehicle model (in the Vehicle summary column).
这个案例是Aston Martins [阿斯顿·马丁] 汽车的网站。可以这样说，它的整体外观设计堪称经典。这是一个搜索结果显示页面。那么现在，你想象一下，该如何通过搜索结果的方式来查阅有关车辆的详细介绍。这里仅有的超链接就是关于“Vehicle summary column [车辆基本列表]”中的“vehicle model[车辆模型]”。
The first, and biggest problem, is that you can't distinguish the hyperlinks, breaking Principle 1. You don't know where to click to get more information: you have to guess.
首先所面临的最大问题就是，你不能区分那个是超链接。这违反了法则1，即：你不知道该点击那里来获取更多的信息，因此，你必须先考虑这个问题
The second problem is: The links look the same although they point to completely different targets (each one is a different used Aston Martin). This breaks Principle 4. Because all the links on this page have the same content (the vehicle model), it's even less obvious that they might be the link.
第二个问题是：尽管这些链接指向完全不同的目标（每个不同的链接都使用了名称“Aston Martin”），但它们看上去几乎一样，这就违反了上述的法则4；再加上所有的链接都包含了相同的内容（vehicle model [车辆类型<
相关内容
- 网页表格或div层在网页中被撑开解决之道_HTML/Xhtml_网页制作_
- HTML网页的基本组成概述_HTML/Xhtml_网页制作_
- XHTML入门学习教程:简单网页制作_HTML/Xhtml_网页制作_
- XHTML常用标签介绍_HTML/Xhtml_网页制作_
- 网页设计之网页音乐的实现技巧_HTML/Xhtml_网页制作_
- 超链接图标规范:提升文章的可阅读性_HTML/Xhtml_网页制作_
- 标记语言——网页应用CSS样式_HTML/Xhtml_网页制作_
- 标记语言——为文字指定CSS样式_HTML/Xhtml_网页制作_
- 标记语言——为_HTML/Xhtml_网页制作_
- CSS标准：vertical-align属性_HTML/Xhtml_网页制作_
