Web界面设计:Web可读性的三个层次

可读性(Readability)是web用户体验的的重要指标,因为访客上网很大程度就是为了获取信息,用户习惯“扫视”而不是阅读。同时,发生交互行为之前,也必须有个获取信息引导“交互”的前提。所以,可读性的重要显而易见,且毋庸置疑。

具体分析web可读性的构成,首先我认为一部分是信息本身的质量,写的好不好或者用的对不对;还有一部分是信息与设计结合的附加值,可以通过展示的design来提升。前者应该是各行各业内容工作者需要掌握的基础,而后者则需要web设计师来优化提升。比如一部小说的可读性如何,首先是内容层面的小说结构、章节段落组织、遣词造句是否可读,其次才是排版和印刷质量等表现层是否可读。也就是说,文学和文化功底会影响可读性,但与design关系不大,他们之间完全可以从技术层面分离。所以,我认为研究Web可读性不必深究内容质量本身的“可读性”问题。

继续总结我发现,各种语言这么多年在“信息本身的质量”话题上已经积累了很多研究,并且都形成固定规范。另外,互联网上的Web界面有个特点,语言和字符构成复杂,中文、英文、数字和各种符号经常混合在一起。因此,我认为可以把Web可读性分三个层次来理解:

  1. 完全用错了
  2. 没有符合既定规范
  3. 表现形式欠佳

2007年10月UCDChina群博曾写过注意界面上的文字这个专题,虽然内容比较散乱,但复习总结还是大部分都有关可读性。已经积累了很多有关可读性的案例,现在面临个分类整理的问题,毫无头绪,具体下文分情况来探讨。

完全用错了

涵盖内容比较广,错误语法、错误字和词语、错误标点、错误符号等等都包括在内。

错误语法主要表现在一些文案上,某些规划不严谨的页面里,很多文案都是工程师随手加的。还有些过度修饰和搞怪风格的语言,用户也不一定喜欢。另外,翻译的文案也是问题热点,因为很多做翻译的同事并不懂专业领域知识,难免在遣词造句上有欠缺。

错误字(错别字)和词语在界面上也很多,比较典型的是“登录”还是“登陆”的案例(“登录”正确),类似的还有“帐号”和“账号”(“帐号”正确)。现在已经很少能找到产品证明,但讨论时还是很容易误录入。

错误标点太常见了,尤其在与朋友的聊天,以及邮件中。我认为在网络上最常见的问题是中英文标点混用,也许是大家懒得切换输入法。对于成年人来说,绝大多数标点符号的使用正确与否,都不会给表达造成大误解,网络上加标点减标点的文字游戏段子都是笑谈。用好标点主要是加强沟通,免得多费口舌解释,有利于双方。

错误符号也有很好的例子,比如当年经常有人分不清楚@和(@是邮件分隔符,指版权所有的意思)。甚至有内容上把星号“*”用成了乘号“×”,或者用小写字母“x”来代替。还有关于¥和¥的争论,总的来说,字符都受字体定义的严重影响,有时候在某种环境下看起来差不多,但本质上却有根本的不同。

没有符合既定规范

以中文语境为例,主要包括汉语书写规范、英文书写规范、数字书写规范。

汉语书写规范可能比较陌生,难道每天用的语言还有规范?估计我们这些经常写blog的网友能意识到,专有术语缩写词在文章首次出现时,应该写全称并括号说明。中国干支纪年和夏历月日,应该使用汉字;相邻的两个数字并列连用表示概数,应该使用汉字等等。

英文书写规范主要是大小写问题,除句首字母、人物姓名、称呼头衔、国家地名、年月日等单词都需要大写首字母,而特殊缩写词字母都需要大写,比如CSS或HTML。还有中英文地址书写习惯正好相反,先是门牌号,最后是国家。

数字书写规范相对简单,大家能分的比较清楚,但有些问题还是容易忽略。比如年份是不能简写的,98年能明白,2012年不能简称12年吧?另表达如2010.5.11的公历年月日时,正确应该给一位数加“0”成为“2010.05.11”。数字的特殊造型,通常在中文传达中占尽优势,但也不能随便用。比如表达约数的“30多种”并不规范,正确应该为“三十多种”。

表现形式欠佳

表现指用户能够直观看到的效果,具体情况具体分析,但我们能够以用户习惯为基准,总结出部分通用准则。欧美学术界已经有了不少研究成果,通过科学的定量分析能够用软件计算出大概可读性参考数。

应该说铺垫了这么多,最后才进入本文核心主题,也就是属于web design可控范围之内的“表现层”可读性影响因素。基本只涉及web的结构和表现,相对改进提升用户体验的成本较低。大概总结为字符、链接、表格、表单四部分,具体细则和案例以后陆续调整补充。

时间: 2024-12-17 13:25:35

Web界面设计:Web可读性的三个层次的相关文章

2017 最值得关注的十大 APP、Web 界面设计趋势

用户对产品的功能和体验要求越来越高,产品设计也在以惊人的速度发生改变.即便你不是一个趋势追随者,但意识和了解到行业的变化仍是极为重要的. 2017 已至,设计趋势又将如何? 1.极简主义 2017年,将继续使用最少的布局,"complexion reduction"风格会被更为重视. 极简主义的设计旨在通过清晰的视觉交流来解决用户的问题,以此让用户更多的关注内容,而不是 UI. 简单的用户界面结合强大的可用性,会真正令用户印象深刻.一个简单易用的应用也能更好地进行传播. 2.更多微交互

网页界面设计:商务Web应用程序设计流程和准则

文章描述:商务web应用程序的界面设计.   在smashingmagazine上看到这篇文章,讲的是Web应用程序设计流程和准则等方面,也许对大家有所帮助.翻译比较仓促,错误地方请多指教,查看原文点这里. 商务Web应用程序的界面设计 商务Web应用程序的设计常常被人们所忽视.我看到许多程序,它们既不符合商业目标,也不满足用户需求,它们有很差的用户体验,并造成了商业利润的损失.更夸张的是,有些设计师根本没有参与整个程序的开发流程,而是把全部职责都推给了开发人员. 对于擅长前端和后台技术的工程师

用户体验设计:丰富的交互为特色的Web界面设计模式

网页制作Webjx文章简介:两大行之有效的Web界面设计模式. Web界面设计 封皮上是这样描述本书的:想知道怎样在今天的Web上创造伟大的用户体验吗?--本书以当前最流行的Web站点为例,介绍了两大良行之有效的Web界面设计模式.如果你想构建或重构站点,并希望站点以丰富的交互为特色,那么本书就是你出奇制胜的宝典. 首先,这是一本工具书. 其次,这是自认为一本比较糟糕的好书.好书,因为它提供了大量思路与操作办法("最佳实践"的部分):糟糕的是平庸的用例和花里胡哨的组织(重复与滥用).鉴

商务Web应用程序的界面设计

商务Web应用程序的界面设计 商务Web应用程序的设计常常被人们所忽视.我看到许多程序,它们既不符合商业目标,也不满足用户需求,它们有很差的用户体验,并造成了商业利润的损失.更夸张的是,有些设计师根本没有参与整个程序的开发流程,而是把全部职责都推给了开发人员. 对于擅长前端和后台技术的工程师来说,他们缺乏设计能力,很难完成这项艰巨的任务.不满意的消费者.沮丧的用户,以及失败的项目,也就自然而然地出现了. 接下来,我们将介绍"商务Web应用程序"界面设计的基础知识.一般来说,人们可以提供

Web 页面设计的色彩理论及应用

web|设计|页面 我们在设计的运用上重点在于创造一个没有过的形态,把形体润饰得协调美观,它受社会的制约,重视地方特征.为了在设计中有效的使用色彩我们必须掌握一些色彩的基础理论知识,结合自己的实际经验,来营造我们的作品.同一色彩有数之不尽的应用方法,并没有非常机械的色彩调和的法则,在一定的原则下靠我们自己的眼睛和审美观点来做出选择. 色彩构成(Interaction of color),可以理解为色彩的作用,是在色彩科学体系的基础上,研究符合人们知觉和心理原则的配色.配色有三类要素:光学要素(明

急急急!!!asp.net界面设计问题

问题描述 有没有会界面设计的大神,求指教求教学 解决方案 解决方案二:这么好的前段框架直接拿来用解决方案三:你可以去逛逛日本網站,看不懂日文就看到不錯的,logo連結就亂點進去看看起喜歡的就部份就自己斟酌參考近來.我都去這這入口網站www.goo.ne.jp日本網站真的會配色.美國的也不錯,但是還是日本的配的最好連字型+字的顏色大小都有講究解决方案四:模板之家等网站,有很多整套的前后台HTML5+CSS3网页,你自己转成ASPX就可以,要求高的,你就找前端设计师解决方案五:今天看一位专业人士翻译

设计思想:商务Web应用程序的界面设计

在smashingmagazine上看到这篇文章,讲的是Web应用程序设计流程和准则等方面,也许对大家有所帮助.翻译比较仓促,错误地方请多指教,查看原文点这里. 商务Web应用程序的界面设计 商务Web应用程序的设计常常被人们所忽视.我看到许多程序,它们既不符合商业目标,也不满足用户需求,它们有很差的用户体验,并造成了商业利润的损失.更夸张的是,有些设计师根本没有参与整个程序的开发流程,而是把全部职责都推给了开发人员. 对于擅长前端和后台技术的工程师来说,他们缺乏设计能力,很难完成这项艰巨的任务

交互设计用户研究:Web交互设计优化

文章描述:Web交互设计优化的简易check list. "优化已有产品的体验",这是用户体验相关岗位职责中常见的描述.我们的产品常常是在快速的迭代过程中不断完善的,就像孩子生下来需要养育才能长大一样,优化已有功能/产品,和设计新功能/产品同样重要,不可偏废. 但是,相比实现新功能,已有功能的优化总是显得没有那么紧迫而且很零散,导致了迭代优化的计划总是被归入"重要不紧急"甚至是"不重要不紧急"的象限,变成了东一棒子西一榔锤的买卖.我们可以通过可用

Tiny快速入门之Web界面快速开发实践

本来想改改OSChina的界面,但是研究了一下,OSChina界面实在是高大上呀,不是做不出来,只是工作量比较大,因此还是做个简单的网站来展示一下用Tiny开发界面的过程,同时在展示过程的同时,会把相关的知识做一个充分的介绍 . 一.寻找网站模板 要做网站,不能没有模板,自己不会做网页设计,咋办?问谷歌找百度呗,找了一阵,看到下面这个模板不错,就它了. http://www.tooplate.com/zip_files/2042_the_block.zip 相仔细了解这篇文章的同学,建议把原板的