访客至上的网页设计秘笈

现在网页设计师除了把页面做的漂亮以外,越来越注重“用户体验”,就是要做“别让用户思考”的网页,使网站真正做到“可用性”。望望结合几年的工作经验,粗谈这方面的一些问题,和大家共勉!

一、人们如何浏览网页

首先本书说明了上网的人是如何浏览网页的,这似乎跟我们想象有很大的差距,因为我们觉得“用户会盯着每个网页,仔细阅读我们精心制作的文字,领会我们页面的组织方式”,事实上大部分时间用户看网页就象“高速公路看广告牌一样”,没时间仔细阅读,当然也不会用心思考。因而,我们必须为“扫描”而设计。做到这点须注意以下几点:

1、尽量符合用户习惯的设计,让人接受陌生的东西需要代价,除非我们觉得这个代价是必须的。

2、在页面把越重要的东西越突出,建立清楚的视觉层次。

3、可以点击的地方必须突出,让人明显知道可以点击。

4、把页面划分成明确定义的区域

5、省略多余的文字

二、关于导航的设计

导航显然是网站最重要的部分,“如果在网站上找不到方向,人们就不会使用你的网站”。现在WEB导航的习惯用法基本形成了,虽然还会继续演化下去,但基本元素以产生:网站LOGO、网站栏目、返回主页、搜索、实用工具或帮助。

网站LOGO,通常是页面左上角,出现在页面可视层级的首要位置,可以采取两种方式:让它成为本页最显眼的内容,或者让它涵盖页面所有其他元素,当然网站LOGO设计的好坏对人产生心理影响就不用说了。

网站栏目,也称导航条,站点层级结构的最顶层。导航条很多时候可以包容二级导航(下拉菜单的方式)。很多时候标签的设计是导航采用的很好表现方式,Amazon.com几乎把它发展到完美的状态。用标签的方式设计导航时要注意几点:

1、进入网站时,有一个标签已经选中;

2、正确绘制,激活的标签页要位于其他标签页之前;

3、颜色区分,可以让每个栏目使用一种不用的标签颜色,并把这种颜色用在页面其他导航元素上,让它们浑然一体;

搜索功能,如果有提供搜索功能的网站,要记住一个简单的公式:一个输入框、一个按钮、还有“Search”(搜索)两个字,不要弄的太复杂。比如把“搜索”换成“查找”、“快速查找”、“快速搜索”、“关键字搜索”都会让用户产生思考。如果必须为搜索框提供选项(缩小搜索范围)一定要三思,谨慎提供选项,以便以何种方式提供最为合理,还有就是要保证这些选项的确有用,否则会挫伤用户心理。

值得注意的是,很多网站到了二级页面以下,导航便会变了支离破碎,随意发挥。这个问题非常普遍,以至于很难找到良好的三级导航的例子。事实上,用户在底层页面上花的时间通常和花在顶层页面上的时间相同。除非我们一开始就自顶向下进行导航设计,否则以后很难添加,也很难保持一致性。这就意味着我们在讨论主页的颜色方案之前,拥有显示网站所有潜在级别的导航的DEMO设计非常重要。要做到这点,必须设计师和相关策划人员紧密结合,设计师必须提前知道整个站的概貌和细节内容。

有一点,设计师常常忽略,就是记得为每个页面加个名称。好像每个拐角处有一个路牌一样,随时让驾驶者知道在哪里,无需思考。页面的名称应该出现在涵盖该页内容的位置,要引人注目,在大多数情况下,它应该是该页面最大的文字。

总之,一个拥有良好导航系统的网站,一眼就能告诉用户这些信息:

这是什么网站?(网站LOGO)

我在哪个网页上?(网页名称)

这个站主要栏目有哪些?(导航栏目清单)

在这个层次上我有哪些选择?(页面导航)

我在导航系统的什么位置?(页面里的“你在这里”的指示符号)

我怎么搜索?

三、关于主页设计

首先要承认,主页不由我们控制。因为每个人都有个一个看法,如果要使每个人都满意,那么就算最优秀的主页设计也无法达到。因此设计主页时不可避免地要做一些折衷。但有一件事情不要忘记——传达整体形象,即一眼可以让人感受到这个站是干什么的。越快越好,越清楚越好。所以当浏览者进入主页时,我们好不费力(几秒钟让人了解)地告诉他四个问题:

这是什么网站?

网站上有些什么?

你能在这里做什么?

为什么你在这里,而不是在其别地方?

那么如何传达这些信息呢:

1、口号,即靠近网站LOGO的地方。一条精炼、个性、生动的口号可以让人立即联想网站的内容。但也有例外,如果某个公司的品牌已达到家喻户晓的地步,可以省略口号。

2、欢迎广告,即对网站的简要描述,在主页首要的位置显示,不需要滚动屏幕就能看到。

3、应从哪里开始?当进入一个新站后,浏览者快速扫描主页之后,应该明白无误地知道:

如果想搜索,可以从这里开始。

如果想扫描,可以从这里开始。

如果想扫描本站最精彩的内容,可以从这里开始。

在设计主页时,注意几个问题:

主页的导航可以与下级的导航有点不同,但必须要有内容和视觉上的一致。

可以不用下拉框就不用,因为那是隐藏的信息。

共2页: 上一页 1 [2] 下一页

时间: 2024-08-07 10:38:05

访客至上的网页设计秘笈的相关文章

访客至上的网页设计秘笈 转载_网站运营

现在网页设计师除了把页面做的漂亮以外,越来越注重"用户体验",就是要做"别让用户思考"的网页,使网站真正做到"可用性".望望结合几年的工作经验,粗谈这方面的一些问题,和大家共勉! 一.人们如何浏览网页首先本书说明了上网的人是如何浏览网页的,这似乎跟我们想象有很大的差距,因为我们觉得"用户会盯着每个网页,仔细阅读我们精心制作的文字,领会我们页面的组织方式",事实上大部分时间用户看网页就象"高速公路看广告牌一样"

ps永不过时抠发丝实用设计秘笈

  ps永不过时抠发丝实用设计秘笈!教你用PS两个轻松抠出头发丝方法技巧,<技巧一:简单背景图片抠图 ><技巧二:背景复杂图片抠图>,方法简单粗暴,实用易学,值得借鉴学习

看图说话 – Android UI 设计秘笈 :Part I

Android 的官方开发者博客发了一份幻灯片,介绍了一些 Android UI 设计的小贴士,Roger 在这里以http://www.aliyun.com/zixun/aggregation/12897.html">看图说话的形式发出来,有兴趣的读者就继续往下翻吧.整个 PPT 共分5个部分,Part I 翻译的是前两个部分. 作为开发者,为啥我们要关心UI,前面的一堆通通可以忽略掉,直接跳到最后一条.因为好的UI设计可以帮助我们卖出更多拷贝,赚到更多钱^_^ 这个 PPT 包含5个部

网页设计创业者大有作为

设计|网页|网页设计 面对网页设计方兴未艾的现状,不少专家指出,对有志于自己创业的人来说,网页设计不失为一个极具潜力的领域.与此同时,已经创业的人们也应注重网页设计在企业成长中的重要性. 个人:在家里搞创业 网页设计的点点星火已经燃起,在它成为燎原之势的过程中,引起了业余设计者的浓厚兴趣.而网页设计本身的特点,更为创业者提供了一展身手的天地. 一些来自学校.企业各个领域的业余选手对网页设计的把握令专家赞叹,他们创作出的优秀作品完全可以进行商业运作.有关专家建议,如果将网页设计作为创业的领域,不失

学习网页设计必知的20个教学资源站

  好在伟大的互联网让全世界苦逼的互联网er都联合起来,一起解决问题.在线课程社区正是在这种情况下诞生的,应对不同需求的在线社区为需要学习的用户们提供了大量的辅助学习资料以及名师们的课程视频和文字教程,在社区中,你会发现一些传统经典的问题的解决方案,还能找到新兴技术和趋势的深度解读. 这些网站里有大量的第一手的学习资料,只要你用心学习,它们绝对不会让你失望. 1. Udemy Udemy是一个在线学习平台,如果你是技术大牛,可以在此销售自己的教学视频;如果你想在此学习技术,可以购买符合自己需求的

平面设计和网页设计在视觉传达方面的差异

文章描述:这段时间,一直在做印像派的商品设计,如照片书.台历之类.从网页产品设计转行过来的我,时常在想,平面设计和网页都是设计,但区别又是那么大,那不就与大自然中的猫和老虎一样嘛,它们都属于猫科动物,但又不是同一种生物,有着很大的差别. 这段时间,一直在做印像派的商品设计,如照片书.台历之类.从网页产品设计转行过来的我,时常在想,平面设计和网页都是设计,但区别又是那么大,那不就与大自然中的猫和老虎一样嘛,它们都属于猫科动物,但又不是同一种生物,有着很大的差别. 现在就让我们来分析一下同样作为视觉

视觉传达设计:平面设计和网页设计的区别

文章描述:浅析·平面与网页设计的差异性. 这段时间,一直在做印像派的商品设计,如照片书.台历之类.从网页产品设计转行过来的我,时常在想,平面设计和网页都是设计,但区别又是那么大,那不就与大自然中的猫和老虎一样嘛,它们都属于猫科动物,但又不是同一种生物,有着很大的差别. 现在就让我们来分析一下同样作为视觉传达设计,她们之间的差异性. 1.视觉元素 在色彩方面平面设计与网页设计使用的色彩模式完全不同,平面设计因为后期的实现依赖于印刷,所以采用CMYK的色彩模式,而网页根据其显像方式使用RGB的色彩模

浅析平面与网页设计的差异性

这段时间,一直在做印像派的商品设计,如照片书.台历之类.从网页产品设计转行过来的我,时常在想,平面设计和网页都是设计,但区别又是那么大,那不就与大自然中的猫和老虎一样嘛,它们都属于猫科动物,但又不是同一种生物,有着很大的差别. 现在就让我们来分析一下同样作为视觉传达设计,她们之间的差异性. 1.视觉元素 在色彩方面平面设计与网页设计使用的色彩模式完全不同,平面设计因为后期的实现依赖于印刷,所以采用CMYK的色彩模式,而网页根据其显像方式使用RGB的色彩模式.平面设计时的色彩运用注重视觉的冲击力及

网页设计(web design)和用户界面设计(UI design)

这是两个现在网页设计领域使用频率非常高的词.在大多数情况下,它们被相互替代.这个领域内外的很多人都认为这是两个意义基本一样的词.但是它们真的可以互相混淆么?我并没有为一些名词而去纠结的习惯,比方说我不会在"美工"和"设计师"之间与别人争论.但是我想网页设计和用户界面设计这两个词包含了很多东西,这两个词的对比可以引申出一些设计领域的发展过程和思考. 注:这篇网志所指的用户界面设计在无特殊说明下特指网页中的用户界面设计. 回到用户界面设计的原点 这里不做考古,只是回想一