老外教我的用户体验那些事

在学校兼职前端开发已三月有余,从初期熟悉 Drupal,到后来的修复 Bug, 到如今进行的用户体验改善。老外的工作态度真真是认真的,对本职工作十分负责,虽然这点我们也不差。但相比国内,我最不同的感受是他们的工作和生活是完完全全分开的。即如果你不喜欢人际关系,no problem, just finish your job, you will be paid. 简单,直接,没有国内的纷繁复杂。当然,too nice 也意味着少了些许生机和乐趣。偶尔卸下伪装也未必不是一种自我放松的方式。

虽然学校的任务相对轻松简单,但我工作的部门由于是 Center for Educational Testing & Evaluation,需要考虑各类学生的不同情况 [尤其是残疾学生],因此还是学习到了许多以前从未接触过的知识。小结一下,希望对以后的学习工作能有所裨益。

Catelog of Content

  1. Efficient communication
  2. Details of html
  3. Vision impaired or blind users

Efficient communication


很多上班族都说我不怕工作内容上的难,但担心人和人之间的沟通,那真的让我心力交瘁。沟通不畅必然会影响员工自身的用户体验。我的个人经验就是,尝试把工作和生活分开。工作中尽量直抒己见,对事不对人。别人无偿帮忙了,道一声 thank you. 自己惹了麻烦,多说几次 sorry. 可能由于自己是外国人的原因,虽然我会问很多 stupid 的 questions, 但同事都很耐心的跟我讲解,所以沟通上并没有什么障碍。

  1. 上下班通过在线网站打卡记录工作时间,按固定小时付工资,工资直接打到银行卡。
  2. 任务分配使用 Asana 。由 Director 创建任务,分配到指定人身上,设定截止日期。
  3. 如果有什么不确定的问题,直接使用 Skype Business 线上沟通。
  4. 会议, workshop or activity 的消息会提前发邮件通知,一般我自己用手机记录在 reminders 上,设置提醒。

上班几乎没说过废话和开过玩笑[也有英语差的原因啦~],关系有点相敬如宾的感觉。We can help each other about work, but it does not mean we are friends. 简单直接,完成工作任务为首要目标,搞人际关系,以后再说吧~

Details of html


  1. 网站所有 img 要设置 alt
  2. 网站所有 links 要使用 Chrome 插件 Check My Links 检验是否可点击。
  3. each element on a page is reachable and can be manipulated via the keyboard. 需要手动使用 Tab 键测试,做到仅用键盘即可全网站导航,为实现语音浏览做铺垫。
  4. 使用神器 webaim 检验网站 accessibility, 超级好用。连 ul 设置了 list-style: none 它都会警告 An unordered (bulleted) list (
      element) is present. 应该官方标准希望列表就是列表,有序。而不是随意用来排版的元素。

Vision impaired or blind users


  1. Use a screen reader to check the site. Recommend: ZoomText.
  2. Links are descriptive for vision impaired or blind users.
  3. Test all pages for color blindness using simulators or browser plug-ins. Recommended: Color Oracle.
  4. Create a helpful 404 error page that tells people they have entered an invalid link and offers an alternative to help them find what they are looking for or a person to contact to help them.

1,2,4是为了保证盲人可以使用软件获取想要的内容,尤其是链接的有效性。需要让盲人知道 current page, page they are gonna go, how can they go back after make something wrong. 比如原先默认的404界面盲人是无法返回的,我们手动添加了链接方便他们导航,check here 404 for blind.

3则是考虑到部分色盲人群。官方统计大约有8%的人为红绿色盲,这是我们主要需要考虑的色盲类型。

正常人看到的色环:

老外教我的用户体验那些事_第1张图片
Normal Vision

红绿色盲看到的色环:

老外教我的用户体验那些事_第2张图片
Deuteranopia

基本处理方法如下:

如果显示器在色盲状态下,有两种颜色难以辨认,请从下图正常色谱分割线两侧各选择一种颜色即可。

老外教我的用户体验那些事_第3张图片
第一条是正常人所见色谱,第二条是色盲所见色谱

这比较好记,红绿色盲就是分不清红色和绿色,在他们眼里都和黄色差不多。但他们是可以看见蓝色的,所以只要保证主[辅]色为蓝色,辅[主]为蓝色以外的颜色[且符合正常人的审美观]即可。

如果是复杂图表,仅改变 Hue 不足以分辨的话,还可以从以下几点进行综合考虑:

  1. Vary saturation [改变饱和度]
  2. Shift hue [转变色相]
  3. Vary shape [改变形状]
  4. Annotation [标注文字]
  5. Width & Size [粗细和大小]
  6. Pattern [样式]

一图胜千言:

老外教我的用户体验那些事_第4张图片
区分点状图通过改变饱和度,色相和形状
老外教我的用户体验那些事_第5张图片
区分条状图通过宽度,饱和度,注释,色相,和格式

Conclusion


This is the website we are doing recently. Welcome to test~

老外教我的用户体验那些事_第6张图片
Home Page

PS: 欢迎准备16年暑假去美国各大互联网公司实习的同学联系我哈,一起备战~~~

As a foreigner, what makes me miss most is exactly what made me hate before. Bitch!
-- 野子Joey

原文链接

你可能感兴趣的:(老外教我的用户体验那些事)