首页 > 建站资源 > 网站运营 > 网站页面重构中如何创建良好的用户体验

网站页面重构中如何创建良好的用户体验

时间:2012-03-11    来源:新浪UED

在工业化设计融入人们生活的现今,用户体验一词就常常出现在人们的视线里,随着互联网web2.0时代的到来,大大小小的网站设计中也都开始关注用户体验的方面,对什么是用户体验(百度这四个字,比我写什么解释都好)就不做详细赘述了,相信大家比我了解的更加丰富。

用户体验从产品设计阶段便开始介入进来,如原型设计中交互模式设计、功能实现方式设计都融入了设计人员对用户的关怀,听过这样的一句话:“具有良好用户体验的产品,不仅仅取决于一个有着丰富交互设计经验的产品设计师,还与产品生产过程中的每一个环节是否都具备良好的用户体验意识有一定的关系”。

今天我想从一个页面重构工程师的角度出发,从两个方面去谈谈在我的工作中,我所理解的用户体验,以及我做了哪些和用户体验有关的事情。

一、 从可用到易用的细节处理

1. 按钮、链接、导航菜单的鼠标触发状态、鼠标手型等

随着视觉设计的发展,对按钮、链接、或者导航菜单的表现方式变得异常丰富,比如:

这些图片丰富了对鼠标点击形式的视觉表现力。在基于功能可用的前提下,逐渐通过视觉渲染达到美化的效果,有了精美的设计图后,就需要页面重构工程师们加以切割,在代码化的过程中,通常要做如下考量:

  • 可点击区域大小,例如(下图)尽管风格上似乎按钮只有10*10,但是在实现时,要考虑用户操作起来是不是很容易获取锚点,而不是点来点去找不到

  • 鼠标操作类型的提示,鼠标输入提示、手型提示、文本区域提示、不可点击提示,尽管整个页面的视觉引导更重要,但用户在操作时,人眼一直跟随着鼠标或键盘的操作而转换,如果能伴随着正确的鼠标操作提示,更可增强引导作用。从而提升交互体验。
  • 按钮风格的一致性,按钮当前状态和点击状态的统一,按钮按照功能所作的统一,
    设计师天马行空的想象力,赋予了他们创造性,而我们既要保留他们的创造力还要抽象出一些共用特征,在我看来按钮类型有3种,如果能有效区分,对网站的整体风格的建立和强化交互感受方面都会有一定一致性,同时在页面构建过程中会抽离成公用信息,非常便于管理和维护。
  1. 1)如确认、取消等,可称之为贯穿型
  2. 2)如登录、加关注等,可称之为点睛型,这一型在实际工作中通常从视觉上都略强于贯穿型,所以会建议设计师做一定统一,有时候是风格上,有时候是结构上,再甚者就是大小比例上
  3. 3)如发博文、发微博等按钮,可称之为增强型,通常这个类型不会限制设计师按照标准类型去做,即便出来的是个异型,我们还是应该理解的。
  4. 4)最后就是无论哪种类型,都要注意是否有鼠标点击的 hover状态,即便设计师没有设计,也要做出hover的交互效果,至少是预留,就我而言通常都是在原按钮颜色基础上调整一下颜色深度作为hover状 态,大部分按钮我都会考虑做出交互效果,当然也有例外,比如活动专题中的点击区域,通常不会增加点击后的过分明显效果,如果非要做出一点效果,最多是调整 一下文字本身的明暗度。(我承认我有些吹毛求疵)

2. 图片的alt解释信息

通常拿到设计需求,我会要求设计师帮助梳理icon,一般会分两类,功能型、注释型。同时要求两种类型图片的像素区间要各自保持一致性,这样一来设 计师在整理的过程中就会意识到,有的文字没有必要加注释图片,有的是功能和注释类型的大小、风格可能不一致,梳理过程中设计师会去调整一下,同时也在创意 的过程中渗透一些规则。

第一、二行是注释型,第三行是功能型

相关推荐
网站用户体验必须注意的76个要点
信息架构之网站导航设计浅析
网页问卷入口设计的几种常见问题小结
Google 用户体验的十大准则
用户调查究竟有多大的价值?
社交网站的另类营销:故意设计得“不够完善”
网站该如何做才能引导用户消费?
如何提高社区运营的用户体验?
运营分析:看影评网站时光网用啥黏住用户?
从网站运营的角度去分析知名B2C商城用户体验的过人之处
从瑞士网络超市的营销细节看用户体验
用户再次访问你博客的三十个理由
网站内容的个性化与用户信任感
20个提高网站用户体验的方法
网站用户体验分析:关于好乐买的意见以及建议
用户体验之网页板块设计深度解析
用户体验之情景反射陷阱
谷歌中文站长博客:构建优质网站的一些建议
网站的分页设计如何做得让用户体验更愉悦?
电商网站的产品陈列设计和细节体验分析
案例分析:19楼不影响用户体验的banner广告
案例浅析国内三大B2C网站首页的信息架构设计
从携程艺龙酒店产品终页比较分析看用户体验小细节
从点点网与tumblr的差异谈轻博客类网站的用户体验
电商网站的用户体验之关联销售
用户体验:如何让用户更简单地使用网站
WEB产品设计须理清脉络 引导用户做正确选择
B2C网站的“捆绑销售”设计用户心理研究
创造卓越用户体验的五个要点
用户注意力与交互设计的简单分析
站在搜索引擎角度上分析互联网页面价值
7个方法改善网站跳出率过高 提升用户粘度
从吸引用户角度分析SEM广告标题撰写的7个技巧
13个国内知名互联网公司的产品设计团队博客网址
网站设计如何让菜单导航更轻便一些
互联网产品设计之影响用户体验的4个因素

精彩推荐

热门教程