﻿<?xml version="1.0" encoding="utf-8"?>
<rss version="2.0" xmlns:xg="http://ucdchina.com/schemas/rss">	
 		<channel>
 			<title>界面上的文字 - UCD大社区</title>
 			<link>http://ucdchina.com/rss/topic_posts?id=12</link>
 			<description>界面上的文字 - UCD大社区</description>
 			<webMaster>qingping.hu@gmail.com</webMaster>
			<pubDate>2026-05-22 13:06:30</pubDate>			<item>
				<title>有一种交互风格叫唠叨～</title>
				<link>http://ucdchina.com/snap/1146</link>
				<description>&lt;p&gt;妈妈她年轻的时候，讨厌唠叨话多的男人。&lt;/p&gt;
 
&lt;p&gt;可是等到女儿也长到了讨厌唠叨男人的年龄时，妈妈却成了最爱唠叨的那个人～&lt;/p&gt;
 
&lt;p&gt;小时候，年轻的妈妈很时尚前卫，一点不唠叨，甚至有点cool，于是很多事物都要女儿自己去摸索：&lt;/p&gt;
 
&lt;div id=&quot;photoImgDiv455156495&quot; class=&quot;photoImgDiv&quot; style=&quot;width: 186px;&quot;&gt;&lt;img class=&quot;reflect&quot; src=&quot;http://img.ucdchina.com/upload/snap/2008-12/fabe5cb0864e1a3aaed6ab62cc97645f.jpeg&quot; alt=&quot;&quot; width=&quot;184&quot; height=&quot;142&quot; /&gt;&lt;/div&gt;
 
&lt;p&gt;结果，女儿恐惧新事物：&lt;/p&gt;
 
&lt;ul&gt;
&lt;li&gt;什么ID？&lt;/li&gt;
&lt;li&gt;第二个框又是干吗的？&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;女儿犯了很多错误，终于搞清楚，原来饭前便后要洗手，不然会拉肚子。她学会了规则，养成了习惯。&lt;/p&gt;
 
&lt;p&gt;&lt;span&gt;&lt;/span&gt;&lt;/p&gt;
 
&lt;p&gt;可是岁月增长，妈妈却在反省自己一开始不够耐心的教导，母性的关怀与日俱增，于是，每次要吃饭了，她便开始唠叨：&lt;/p&gt;
 
&lt;p&gt;&lt;img class=&quot;reflect&quot; src=&quot;http://img.ucdchina.com/upload/snap/2008-12/9b81381577584de84fd19d3dcfab9759.jpeg&quot; alt=&quot;&quot; width=&quot;497&quot; height=&quot;506&quot; /&gt;&lt;/p&gt;
 
&lt;p&gt;女儿觉得妈妈好烦哦，于是本来吃饭前只需要1分钟的卫生程序，她都因为必须要听完妈妈的细心指导而花费好几分钟，无奈啊～ 虽然，她也知道妈妈是为了她好。。。&lt;/p&gt;&lt;p&gt;相关话题：&lt;a href=&quot;http://ucdchina.com/topic/12&quot; target=&quot;_blank&quot;&gt;界面上的文字&lt;/a&gt;&amp;nbsp;源地址：&lt;a href=&quot;http://www.uxstudy.com/2007/05/19/an-interaction-style-called-laodao/&quot; target=&quot;_blank&quot;&gt;http://www.uxstudy.com/2007/05/19/an-interaction-style-called-laodao/&lt;/a&gt;&lt;/p&gt;</description>
				<author>杨掌柜</author>
				<pubDate>2007-05-19 10:25:34</pubDate>
			</item>			<item>
				<title>有多少文字可以胡来？！ （From 天天体验）</title>
				<link>http://ucdchina.com/snap/1145</link>
				<description>&lt;p&gt;&lt;a href=&quot;http://www.flickr.com/groups/due/&quot; target=&quot;_blank&quot;&gt;&lt;img src=&quot;http://img.ucdchina.com/upload/snap/2008-12/236119951daa2a7f3e669ab82c613db7.jpeg&quot; alt=&quot;http://uicom.net/blog/attachments/200704/tiantian.jpg&quot; width=&quot;448&quot; height=&quot;84&quot; /&gt;&lt;/a&gt;&lt;/p&gt;
 
&lt;p&gt;2007年2月12日，我和&lt;a href=&quot;http://www.junchenwu.com/&quot; target=&quot;_blank&quot;&gt;JUNCHEN&lt;/a&gt;在闲聊时发现: 大家随时都有很多和体验相关的图片，我们没有地方一起可以把这些图片记录下来，于是我们&lt;a href=&quot;http://ucdchina.com/blog/?page_id=7&quot; target=&quot;_blank&quot;&gt;开设了&lt;/a&gt;&amp;ldquo;天天体验&amp;rdquo;&lt;a href=&quot;http://www.flickr.com/groups/due/&quot; target=&quot;_blank&quot;&gt;图片组&lt;/a&gt;。后来这个小组归为了UCDChina平台的一个组成部分。&lt;/p&gt;
 
&lt;p&gt;可能是RSS的问题，我最近一直没有看到图片组的更新，早上去Flickr看了下，&amp;rdquo;乖乖！好多有意思的图片，集体贡献的力量实在是伟大&amp;rdquo;。 谢谢大家的共享。&lt;br /&gt;（不过，我发现现在大部分都是反面教材，呼吁大家多发正面实例。）&lt;/p&gt;
 
&lt;p&gt;下面摘录部分和文字有关的图片：&lt;/p&gt;
 
&lt;p&gt;&lt;a href=&quot;http://www.flickr.com/photos/juui/438833911/in/pool-due/&quot; target=&quot;_blank&quot;&gt;蓝球？ 篮球？ &amp;hellip;&lt;br /&gt;&lt;/a&gt;&lt;img src=&quot;http://img.ucdchina.com/upload/snap/2008-12/ed606eafdddb0657e03b88cab018b308.jpeg&quot; alt=&quot;图像 &amp;ldquo;http://farm1.static.flickr.com/179/438833911_f01adfba82.jpg?v=0&amp;rdquo; 因其本身有错无法显示。&quot; width=&quot;480&quot; height=&quot;360&quot; /&gt;&lt;/p&gt;
 
&lt;p&gt;&lt;br /&gt;&lt;a href=&quot;http://www.flickr.com/photos/junchenwu/328882504/&quot; target=&quot;_blank&quot;&gt;Vista 文件夹选项&lt;br /&gt;&lt;/a&gt;&lt;img src=&quot;http://img.ucdchina.com/upload/snap/2008-12/143df546294c07162f46eeb5d5f1263b.jpeg&quot; alt=&quot;图像 &amp;ldquo;http://farm1.static.flickr.com/131/328882504_0fe82855b8.jpg?v=1176173034&amp;rdquo; 因其本身有错无法显示。&quot; width=&quot;360&quot; height=&quot;500&quot; /&gt;&lt;/p&gt;
 
&lt;p&gt;&lt;br /&gt;&lt;a href=&quot;http://www.flickr.com/photos/junchenwu/321768898/&quot; target=&quot;_blank&quot;&gt;vista_shutdown&lt;br /&gt;&lt;/a&gt;&lt;img src=&quot;http://img.ucdchina.com/upload/snap/2008-12/f1899b58e70b143e375267149862435c.jpeg&quot; alt=&quot;图像 &amp;ldquo;http://farm1.static.flickr.com/140/321768898_83c9d8a06c.jpg?v=0&amp;rdquo; 因其本身有错无法显示。&quot; width=&quot;500&quot; height=&quot;463&quot; /&gt;&lt;/p&gt;
 
&lt;p&gt;&lt;a href=&quot;http://www.flickr.com/photos/junchenwu/317013705/&quot; target=&quot;_blank&quot;&gt;vista_previous&lt;/a&gt;&lt;br /&gt;&lt;img src=&quot;http://img.ucdchina.com/upload/snap/2008-12/5e8b2edc3894dcbdc285d1de8fb58658.jpeg&quot; alt=&quot;图像 &amp;ldquo;http://farm1.static.flickr.com/115/317013705_789f110d10.jpg?v=1176172961&amp;rdquo; 因其本身有错无法显示。&quot; width=&quot;500&quot; height=&quot;450&quot; /&gt;&lt;/p&gt;
 
&lt;p&gt;&lt;a href=&quot;http://www.flickr.com/photos/junchenwu/386738782/in/pool-due/&quot; target=&quot;_blank&quot;&gt;Photoshop当保存的文件名过长时&lt;/a&gt;&lt;br /&gt;&lt;img src=&quot;http://img.ucdchina.com/upload/snap/2008-12/b215b32ae2e45e6efc1a3a0c0730e237.jpeg&quot; alt=&quot;图像 &amp;ldquo;http://farm1.static.flickr.com/164/386738782_861da05f79.jpg?v=1171253775&amp;rdquo; 因其本身有错无法显示。&quot; width=&quot;313&quot; height=&quot;233&quot; /&gt;&lt;/p&gt;
 
&lt;p&gt;&lt;a href=&quot;http://www.flickr.com/photos/xwxw/445645568/in/pool-due/&quot; target=&quot;_blank&quot;&gt;这个原来是登录~&lt;/a&gt;&lt;br /&gt;&lt;img src=&quot;http://img.ucdchina.com/upload/snap/2008-12/fe237ace3649dbd67c91e922c7ce8ec7.jpeg&quot; alt=&quot;图像 &amp;ldquo;http://farm1.static.flickr.com/217/445645568_04225fcba7.jpg?v=0&amp;rdquo; 因其本身有错无法显示。&quot; width=&quot;500&quot; height=&quot;203&quot; /&gt;&lt;/p&gt;
 
&lt;p&gt;&lt;a href=&quot;http://www.flickr.com/photos/7532532@N07/448874242/in/pool-due/&quot; target=&quot;_blank&quot;&gt;15-没有死的人&lt;br /&gt;&lt;/a&gt;&lt;img src=&quot;http://img.ucdchina.com/upload/snap/2008-12/00eff013a0c5b595411e96fe528ce7a5.jpeg&quot; alt=&quot;图像 &amp;ldquo;http://farm1.static.flickr.com/168/448874242_bc1f08279c.jpg?v=0&amp;rdquo; 因其本身有错无法显示。&quot; width=&quot;500&quot; height=&quot;338&quot; /&gt;&lt;/p&gt;
 
&lt;p&gt;&lt;a href=&quot;http://www.flickr.com/photos/juui/453355189/in/pool-due/&quot; target=&quot;_blank&quot;&gt;新建 VS 修改&lt;br /&gt;&lt;/a&gt;&lt;img style=&quot;border: 1px solid #808080; display: inline; width: 457px; height: 279px;&quot; src=&quot;http://img.ucdchina.com/upload/snap/2008-12/53c8929e0a0995c1ea850ae36a600725.jpeg&quot; alt=&quot;图像 &amp;ldquo;http://farm1.static.flickr.com/247/453355189_ea48b50cda.jpg?v=0&amp;rdquo; 因其本身有错无法显示。&quot; width=&quot;457&quot; height=&quot;279&quot; /&gt;&lt;/p&gt;
 
&lt;p&gt;&lt;a href=&quot;http://www.flickr.com/photos/juui/453339242/in/pool-due/&quot; target=&quot;_blank&quot;&gt;谁更合适？&lt;/a&gt;&lt;br /&gt;&lt;img style=&quot;border: 1px solid #808080; display: inline; width: 419px; height: 460px;&quot; src=&quot;http://img.ucdchina.com/upload/snap/2008-12/407883b28c54f7948df38d94c029f1d1.jpeg&quot; alt=&quot;图像 &amp;ldquo;http://farm1.static.flickr.com/174/453339242_b74ec1331e.jpg?v=0&amp;rdquo; 因其本身有错无法显示。&quot; width=&quot;419&quot; height=&quot;460&quot; /&gt;&lt;/p&gt;
 
&lt;p&gt;&lt;a href=&quot;http://www.flickr.com/photos/juui/453302780/in/pool-due/&quot; target=&quot;_blank&quot;&gt;搞明白这里是做什么的了吗？&lt;/a&gt;&lt;br /&gt;&lt;img style=&quot;border: 1px solid #808080; display: inline; width: 271px; height: 234px;&quot; src=&quot;http://img.ucdchina.com/upload/snap/2008-12/84737c4b5c0c68de81f0e8ba30baea67.jpeg&quot; alt=&quot;图像 &amp;ldquo;http://farm1.static.flickr.com/234/453302780_fdbee75e4f.jpg?v=0&amp;rdquo; 因其本身有错无法显示。&quot; width=&quot;271&quot; height=&quot;234&quot; /&gt;&lt;/p&gt;
&lt;p&gt;&lt;a href=&quot;http://www.flickr.com/photos/juui/453397471/&quot; target=&quot;_blank&quot;&gt;google，哎呀～&lt;/a&gt;&lt;br /&gt;&lt;img src=&quot;http://img.ucdchina.com/upload/snap/2008-12/f1d6a1a6593ab760c3d833a5fc2bb333.jpeg&quot; alt=&quot;图像 &amp;ldquo;http://farm1.static.flickr.com/181/453397471_dcf5d7feee.jpg?v=0&amp;rdquo; 因其本身有错无法显示。&quot; width=&quot;500&quot; height=&quot;105&quot; /&gt;&lt;/p&gt;&lt;p&gt;相关话题：&lt;a href=&quot;http://ucdchina.com/topic/12&quot; target=&quot;_blank&quot;&gt;界面上的文字&lt;/a&gt;&amp;nbsp;源地址：&lt;a href=&quot;http://uicom.net/blog/?p=600&quot; target=&quot;_blank&quot;&gt;http://uicom.net/blog/?p=600&lt;/a&gt;&lt;/p&gt;</description>
				<author>白鸦</author>
				<pubDate>2007-04-10 10:23:36</pubDate>
			</item>			<item>
				<title>创业产品的界面文字优化</title>
				<link>http://ucdchina.com/snap/1144</link>
				<description>&lt;p&gt;&lt;strong&gt;&lt;img src=&quot;http://img.ucdchina.com/upload/snap/2008-12/f812c684458cbc221df4fe1cde72683d.jpeg&quot; alt=&quot;http://www.uicom.net/blog/attachments/200706/wenzi.jpg&quot; width=&quot;416&quot; height=&quot;152&quot; /&gt;&lt;/strong&gt;&lt;/p&gt;
 
&lt;p&gt;&lt;strong&gt;1、&lt;/strong&gt;界面最终表现给用户的其实只有两个内容：视觉、文字。&lt;/p&gt;
 
&lt;p&gt;&lt;strong&gt;2、&lt;/strong&gt;&lt;a href=&quot;http://www.consumerwebwatch.org/dynamic/web-credibility-report-evaluate.cfm&quot; target=&quot;_blank&quot;&gt;Consumerwebwatch.org 的报告&lt;/a&gt;显示，视觉设计占整个体验的&lt;a&gt;46%&lt;/a&gt;。虽然我不是很赞成这个说法，但对于产品的初体验来说这个比例一点也不夸张。&lt;br /&gt;那么文字部分应该是占多少呢？(未能找到什么有说服力的数据报告)我认为：&lt;strong&gt;接近30%.&lt;/strong&gt;&lt;/p&gt;
 
&lt;p&gt;&lt;strong&gt;3、&lt;/strong&gt;OK，现在不再提大而话之的理论和感念，具体在一个创业公司的小团队中：&lt;br /&gt;我们没有可能专门招一个人做文字优化、没有可能界面上的每一个字都经过不停的推敲、更不可能马上就建议一套系统的&amp;rdquo;界面行文规范&amp;rdquo;，如何做好界面上的文字工作？&lt;/p&gt;
 
&lt;p&gt;&lt;strong&gt;4、&lt;/strong&gt;我的建议：&lt;br /&gt;&lt;br /&gt;4.1&amp;gt; 首先，在现有团队中找一个语言表达能力好、有耐心的女孩（最好是女孩）来&amp;rdquo;负责&amp;rdquo;。&lt;/p&gt;
 
&lt;p&gt;这个&amp;rdquo;负责&amp;rdquo;并非是所有界面上的字都需要她来写，只需要做监督和出口的把关以及经验的总结即可。&lt;br /&gt;&lt;strong&gt;以&amp;rdquo;文字是否容易阅读、是否能准确表达信息、是否能够准确的传达产品气质&amp;rdquo;为其工作的基本原则，以&amp;rdquo;让所有在界面上写字的人具备一致的风格和文字表达能力&amp;rdquo;为其工作目标。&lt;/strong&gt;&lt;/p&gt;
 
&lt;p&gt;&lt;br /&gt;4.2&amp;gt; 第一步，由产品管理者总结产品应该传达给用户的&amp;rdquo;形象和气质&amp;rdquo;，作为关于文字工作的基本准则。（比如，Robin提出百度的产品气质是&amp;rdquo;简单，可依赖&amp;rdquo;）。&lt;br /&gt;&lt;br /&gt;&amp;ldquo;负责人&amp;rdquo;根据这个准则，再去翻翻书或者看一些关于界面文字表达基础原则的文章，总结出自己产品一些大原则的&amp;rdquo;行文风格&amp;rdquo;。&lt;br /&gt;（因为是&amp;rsquo;行文风格&amp;rsquo;，所以无需太具体，一般在WORD上不超过二页即可，尽量简洁以免耽误应用的效率和质量）&lt;br /&gt;&lt;br /&gt;比如：&lt;em&gt;（以下是某项目中的部分段落摘抄，切勿照搬）&lt;/em&gt;&lt;br /&gt;&lt;span style=&quot;color: #484848;&quot;&gt;&amp;ldquo;说明性和提示性的语言不得超过两行，不超过50字&amp;rdquo;&lt;br /&gt;&amp;ldquo;界面上不得体现大片的专业术语作为帮助信息&amp;rdquo;&lt;br /&gt;&amp;ldquo;保持文字的一致性，本产品界面中所有和ID相关的信息都叫&amp;rsquo;帐户&amp;rsquo;，..&amp;rdquo;；&lt;br /&gt;&amp;ldquo;使用通用语言，不搞一些特殊化的文字，让用户一眼就能看懂&amp;rdquo;&lt;br /&gt;&amp;ldquo;保持语言的简洁，既定事实不做重复。如，&amp;rsquo;你的好友列表中没有好友，请立即添加&amp;rsquo;改为&amp;rsquo;立即添加好友&amp;rsquo;，&amp;hellip;.&amp;rdquo;；&lt;br /&gt;&amp;ldquo;如果系统出错，则明白准确表述错误，同时以积极的语调给出建议。如，&amp;rsquo;抱歉xxx，您可以xx再试一下&amp;rsquo;，&amp;hellip;.&amp;rdquo;；&lt;br /&gt;&amp;hellip;&amp;hellip;..&lt;/span&gt;&lt;/p&gt;
 
&lt;p&gt;&lt;br /&gt;4.3&amp;gt; 第二步，让所有在工作中需要撰写界面文字的同事熟悉该&amp;rdquo;行文风格&amp;rdquo;。&lt;br /&gt;每一个往界面上写字的人都要很清楚自己写出去的字是否符合这个&amp;rdquo;风格&amp;rdquo;。&lt;/p&gt;
 
&lt;p&gt;杜绝这种现象：&lt;br /&gt;不同的技术人员各自按照自己的&amp;rdquo;风格&amp;rdquo;在界面上写字，今天你写&amp;rdquo;对不起，你还没有登录。&amp;rdquo;，明天他写&amp;rdquo;抱歉，还没有登陆吧？&amp;rdquo;，后天她又写&amp;rdquo;哎呀！我们好像还不认识你耶，赶快登录吧&amp;hellip;&amp;rdquo;&lt;/p&gt;
 
&lt;p&gt;&lt;br /&gt;4.4&amp;gt; 第三步，在执行&amp;rdquo;行文风格&amp;rdquo;的初期(一般需要两个星期)，每一个确定后的界面都交给&amp;rdquo;负责人&amp;rdquo;审核。由其修改并指出问题，同时对一致的问题做出书面总结，慢慢整理成书面的统一&amp;rdquo;行文指南&amp;rdquo;。&lt;br /&gt;&amp;ldquo;&lt;strong&gt;规范是在工作中慢慢形成的，并不是一开始总结好的&lt;/strong&gt;&amp;ldquo;，其实这个审核和总结的过程不用花费太多时间，三个人一个星期完成的界面只需要三个小时应该就能审核完所有界面上出现的文字。&lt;br /&gt;&lt;br /&gt;这个&amp;rdquo;指南&amp;rdquo;一般会比较具体。&lt;br /&gt;比如，就算确定了&amp;rdquo;表达要简洁，语言要直白不用问句，风格不要过于卡通或显&amp;rsquo;幼稚&amp;rsquo;&amp;rdquo;，这时一样有可能出现&amp;rdquo;对不起，你还没有登录。&amp;rdquo;、&amp;rdquo;抱歉，请马上登陆&amp;rdquo;、&amp;rdquo;登录后才能进行操作，请赶快登陆吧&amp;rdquo;等不同语言。那么在这个阶段，文字的负责人就可以给统一的总结成一种了。&lt;/p&gt;
 
&lt;p&gt;&lt;br /&gt;4.5&amp;gt; 第四步，经过一段时间的&amp;rdquo;审核&amp;rdquo;和&amp;rdquo;规范总结&amp;rdquo;基本上产品的文字就可以有完善的统一指南了。&lt;br /&gt;一般情况下，不超过一个月一个创业产品的系统性的文字风格和规范就可以形成了。这之后&amp;rdquo;文字工作负责人&amp;rdquo;的工作除了简单过一眼要展示出去的界面，基本山已经不需要做什么类似工作了。&lt;br /&gt;这个时候，其实规范不规范已经不是最关键的了，可贵的是&amp;rdquo;所有在界面上写字的人都有了统一的行文风格和习惯&amp;rdquo;，我们的界面文字越来越专业友好。。&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;strong&gt;5、&lt;/strong&gt;最后，按照我上面的方法算一下成本：（创业团队里面，很多事情都牵连在一起的，这里未算管理成本）&lt;br /&gt;一个文笔好的女孩&amp;rdquo;负责&amp;rdquo;：假设她的薪水是4000，这个工作需要占据他20%的工作时间，那么是800；&lt;br /&gt;会直接在界面上写字的假设有4个（20人产品团队）：假设他们的薪水是5000，这个工作平均需要占据他们5%的工作时间，那么总共是1000。&lt;br /&gt;一个月的总共成本：1800。&lt;/p&gt;
 
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
 
&lt;p&gt;&lt;strong&gt;6、&lt;/strong&gt;文字是产品情感传达的一个重要因素，特别是互联网产品，需要保证&lt;a href=&quot;http://uicom.net/blog/?p=433&quot; target=&quot;_blank&quot;&gt;用户在不同情景中的角色感&lt;/a&gt;，需要迅速高效的转达准确信息。中文的世界上&lt;a href=&quot;http://uicom.net/blog/?p=600&quot; target=&quot;_blank&quot;&gt;一些糟糕的文字表达&lt;/a&gt;屡见不鲜，&lt;a href=&quot;http://www.uxstudy.com/2007/05/19/an-interaction-style-called-laodao/&quot; target=&quot;_blank&quot;&gt;啰啰嗦嗦的风格&lt;/a&gt;尤为突出。&lt;/p&gt;
 
&lt;p&gt;可以说，这个小区域现在还是竞争的空白，如果你解决了这个问题，那么用户给你的分数是别人没有的。很值&amp;hellip;&lt;/p&gt;&lt;p&gt;相关话题：&lt;a href=&quot;http://ucdchina.com/topic/12&quot; target=&quot;_blank&quot;&gt;界面上的文字&lt;/a&gt;&amp;nbsp;源地址：&lt;a href=&quot;http://uicom.net/blog/?p=653&quot; target=&quot;_blank&quot;&gt;http://uicom.net/blog/?p=653&lt;/a&gt;&lt;/p&gt;</description>
				<author>白鸦</author>
				<pubDate>2007-08-22 10:19:56</pubDate>
			</item>			<item>
				<title>界面内容优化的层次</title>
				<link>http://ucdchina.com/snap/136</link>
				<description>&lt;p&gt;所谓产品其实最终展现在用户面前的只是界面而已，所谓界面绝大多数时候只包括两个部分：图片、文字。&lt;br /&gt;重视界面上的每一个像素和每一个文字是UED的基本素质，关于如何设计好界面上的文字（一般在UED里面我们把这个职位叫做&amp;ldquo;内容优化&amp;rdquo;）我以前写过&lt;a href=&quot;http://uicom.net/blog/?p=653&quot; target=&quot;_blank&quot;&gt;创业团队的界面文字优化&lt;/a&gt;和&lt;a href=&quot;http://uicom.net/blog/?p=433&quot; target=&quot;_blank&quot;&gt;用户在每个情景中的角色感&lt;/a&gt;，这一期的话题中其他伙伴也说到了很多。&lt;/p&gt;
 
&lt;p&gt;这个话题讨论到这里，已经让很多人意识到了界面上文字的重要性：界面的文字就好像一个人的谈吐，文字给用户的感觉不单单只是一个&amp;ldquo;信息&amp;rdquo;的传达，他还关乎用户对于产品的情感印象和&amp;ldquo;产品气质&amp;rdquo;的理解。&lt;/p&gt;
 
&lt;p&gt;那么，我应该说点什么呢？在今天写这个话题之前我就一直在思考：能否系统化的把&amp;ldquo;内容优化&amp;rdquo;像&amp;ldquo;体验&amp;rdquo;一样分层次的理解？&lt;br /&gt;&lt;br /&gt;.&lt;/p&gt;
 
&lt;p&gt;1，界面上的文字应该做到：&lt;strong&gt;清楚而准确的向用户传达信息&lt;/strong&gt;。&lt;br /&gt;其实这是内容优化的最基本要求，本应该是所有产品都可以做到的。但往往是越熟练的人越容易在这里出现问题。常见表现：过份的向非专业用户展示专业词汇、信息提示本身误导了用户。&lt;/p&gt;
 
&lt;p&gt;比如，某视频网站突然蹦出来一个&lt;span style=&quot;color: #999999;&quot;&gt;&amp;ldquo;bps超出，链接失败。&amp;rdquo;&lt;/span&gt;（查了资料我才明白bps大概是每秒链接数的意思）&lt;br /&gt;比如，有些网站用户没有注册也去登录的时候反馈提示为&lt;span style=&quot;color: #999999;&quot;&gt;&amp;ldquo;密码错误&amp;rdquo;&lt;/span&gt;。其实直接提示没有此用户，然后给个链接&amp;ldquo;注册此用户&amp;rdquo;，你会发现转化率相当高，注册量有了用户也方便了。&lt;/p&gt;
 
&lt;p&gt;2，界面上的文字应该&lt;strong&gt;便于用户阅读并快速理解其含义&lt;/strong&gt;。&lt;br /&gt;最常见的问题表现是：语言过于罗嗦、信息排列混乱。&lt;/p&gt;
 
&lt;p&gt;比如，某门户网站在注册blog的时，&amp;ldquo;您的登录名&amp;rdquo;旁边这么写辅助说明：&amp;ldquo;&lt;span style=&quot;color: #999999;&quot;&gt;4-16个字符（包括4、16），英文小写、汉字、数字、下划线，不支持空格，不支持全角英文，不支持纯数字，不能使用下划线开头和结尾。&lt;/span&gt;&amp;rdquo;。（大致推算了一下，一个IQ小于200的普通用户如果认真读完并完整理解这句话的意思需要近1分钟时间）&lt;br /&gt;比如，另一门户的blog和他旗下的校友录网站，东边一个下划线、西边一个icon加文字、南边一个按钮加文字、北边一个红色、中间还有一个红色加粗。我进去之后真不知道什么地方可以点什么地方不可以点，什么地方能点什么地方不能点&amp;hellip;&lt;br /&gt;再比如，某电子邮件服务在注册的时候这样排列：&lt;span style=&quot;color: #999999;&quot;&gt;&amp;ldquo;用户名:___、密码:___、密码强度：[][][]、重复密码：___&amp;rdquo;&lt;/span&gt;。吓的我还以为可以自定义密码强度。。。&lt;/p&gt;
 
&lt;p&gt;3，整个产品&lt;strong&gt;不同位置的文字应该统一&lt;/strong&gt;。大家都讲普通话，不能一会中国话一会外国文。&lt;br /&gt;这是一个最简单的问题，却是大部分网站都未能避免的问题。（特别是在中文网站，大概是因为中文说法太多了）&lt;br /&gt;比如，作一个IM软件，一开始是&amp;ldquo;添加好友&amp;rdquo;，接下来&amp;ldquo;联系人列表&amp;rdquo;，然后又是&amp;ldquo;不在线的朋友&amp;rdquo;；一开始是&amp;ldquo;注册用户名&amp;rdquo;、然后是&amp;ldquo;登录ID&amp;rdquo;、还有&amp;ldquo;您的账户&amp;rdquo;、&amp;ldquo;管理帐号&amp;rdquo;、&amp;hellip;&lt;/p&gt;
 
&lt;p&gt;4，界面上的文字应该&lt;strong&gt;具备该产品需要传达给用户的气质&lt;/strong&gt;。&lt;/p&gt;
 
&lt;p&gt;这里往往遇到的是怎么做的问题：怎么确定产品要表达什么样的气质？怎么确定什么样的语言风格才算是表达了这样的气质？&lt;br /&gt;在稍微大型的企业我们一般有很多种方法可以做到，比如找很多用户让他们说出他们需要的、比如通过情绪板、比如通过颜色分析等等。&lt;br /&gt;但在创业公司我一般建议大家实用一点：&lt;br /&gt;1&amp;gt;N个很了解产品定位的人坐到一起，每人一个贴纸写下来一个你认为可以描述该产品的句子或者事物；&lt;br /&gt;2&amp;gt;把所有人的描述拿出来大家讨论，把每一个用二维分析的方式摆出来，最终得到一个大家都认可的结果就是这个产品应该表达的气质；&lt;br /&gt;3&amp;gt;每人N个贴纸，根据刚才得到的结果，结合自己产品的环境写下来你认为要表达这种气质需要什么样风格的语言；&lt;br /&gt;4&amp;gt;用第2点中同样的方法得到一个统一的结果，（比如：严肃、简练、..）&lt;br /&gt;5&amp;gt;安排一个专门的人写一份简单的指南，描述这个结果具体执行时一些需要注意的常见问题和原则。（比如：既定事实不再重复、不用反问语句提问用户、即时说明文字不得超过20字、&amp;hellip;）&lt;/p&gt;
 
&lt;p&gt;5，&lt;strong&gt;文字的视觉设计应该完整的融入整个产品视觉中。&lt;br /&gt;&lt;/strong&gt;很多视觉设计师喜欢把文字融入到界面的造型中去，得到非常棒的视觉效果，这个很值得学习。&lt;br /&gt;从最基础来说，我们的文字在界面上和图形一样应该有主次有深浅，关于这个部分潇潇同学已经有了&lt;a href=&quot;http://ucdchina.com/blog/?p=335&quot; target=&quot;_blank&quot;&gt;很好的表述&lt;/a&gt;，我只补充一个例子：&lt;/p&gt;
 
&lt;p&gt;图片网站本身应该表现的是&amp;ldquo;图&amp;rdquo;，文字只是其辅助信息。&lt;br /&gt;flickr在个人首页里每个图片下面都有四行的文字，但我从未感觉到他碍眼或者多余，因为flickr用的是很柔和的粉红和几乎可以让我第一视觉点忽视掉的灰色；&lt;br /&gt;而yupoo在个人首页里每个图片下面只有三行文字，可每一个我都觉得他们扎眼，因为yupoo用了重灰色粗体、绿色粗体、重灰色、绿色四种表现方式，而且字体都还不一样。&lt;/p&gt;
 
&lt;p&gt;6，尽量&lt;strong&gt;让文字自身可以起到&amp;ldquo;推销&amp;rdquo;产品的作用，而且&amp;rdquo;推销&amp;rdquo;的不只是产品气质&lt;/strong&gt;。&lt;br /&gt;文字其实可以像图形设计一样在情感上给用户以触动，从而积极的达到对于产品的&amp;ldquo;推销&amp;rdquo;。&lt;br /&gt;比如，很多人已经把&amp;ldquo;注册&amp;rdquo;改成了&amp;ldquo;立即注册&amp;rdquo;、&amp;ldquo;马上注册&amp;rdquo;；&lt;br /&gt;比如，baidu.com的&amp;ldquo;更多&amp;rdquo;页面最上面以前是&amp;ldquo;推荐使用&amp;rdquo;后来改成了&amp;ldquo;试试看&amp;rdquo;，虽然只是少了一个字，但给用户的感受和尝试欲望马上就很不一样；&lt;br /&gt;比如，某电子商务网站会在注册要完成那里说：&amp;ldquo;太好了，你还需一步就能成为我们的注册会员&amp;rdquo;&lt;br /&gt;比如，&amp;hellip;&lt;/p&gt;
 
&lt;p&gt;.&lt;br /&gt;.&lt;/p&gt;
 
&lt;p&gt;ps：&lt;br /&gt;关于内容优化，《交互设计》和《Designing web
usability》两本书都简单的提到了一些类似&amp;ldquo;准确传达信息、不要罗嗦、不要多余、文字要统一、要符合产品风格&amp;rdquo;的话，但说的都很浅，而且言语中能
察觉到作者并未想深入表达，或者他们本身也确实没有很深入的研究。&lt;/p&gt;
 
&lt;p&gt;界面上的文字看似是一个很细小的东西，实际上他蕴藏着很多的价值并且在潜移默化为产品带来好的或者不好的利益。中国人说&amp;ldquo;察言观色&amp;rdquo;，我想&amp;ldquo;言语&amp;rdquo;
的表达对于中国用户的触动应该会更加的明显。国外现在也还没有在内容优化上非常全面和深入理论知识，可能也是因为他们的语言并没有中国这样博大精深（或者
说&amp;ldquo;多变&amp;rdquo;）。&lt;br /&gt;所以，研究和发挥好&amp;ldquo;界面上的文字&amp;rdquo;对于产品的价值也许更适合也更值得在中国做。这里有不小的空白的空间，值得我们发挥。&lt;br /&gt;共勉。&lt;/p&gt;&lt;p&gt;相关话题：&lt;a href=&quot;http://ucdchina.com/topic/12&quot; target=&quot;_blank&quot;&gt;界面上的文字&lt;/a&gt;&amp;nbsp;源地址：&lt;a href=&quot;http://ucdchina.com/blog/?p=351&quot; target=&quot;_blank&quot;&gt;http://ucdchina.com/blog/?p=351&lt;/a&gt;&lt;/p&gt;</description>
				<author>白鸦</author>
				<pubDate>2008-07-26 23:25:41</pubDate>
			</item>			<item>
				<title>如何制定文字语言规范</title>
				<link>http://ucdchina.com/snap/135</link>
				<description>&lt;div id=&quot;entry_content&quot; class=&quot;entry&quot; style=&quot;font-size: 13px;&quot;&gt;
&lt;p&gt;本期话题注意界面上的文字引来了非常多的讨论，可以看出网站界面上的文字正是大家比较关注的问题，而且比较实际。比如千鸟的&lt;a href=&quot;http://ucdchina.com/blog/?p=330&quot;&gt;内容呈现建议&lt;/a&gt;、奇遇的&lt;a href=&quot;http://ucdchina.com/blog/?p=332&quot;&gt;文本达意和可用性&lt;/a&gt;、子条的&lt;a href=&quot;http://ucdchina.com/blog/?p=324&quot;&gt;文字的辨识度和可读性&lt;/a&gt;，可以讲都是界面文字规范，千鸟的文章更适用于内容编辑，奇遇和子条的文章更适用于设计师。&lt;/p&gt;
 
&lt;p&gt;在实际产品设计过程中，可以逐渐的形成这样的文字语言规范，目的是让产品设计的参与人员能够统一认识，和重视文字在设计中的重要性。&lt;/p&gt;
 
&lt;p&gt;针对规范的使用环境，大体可以分为基本规范、特定产品规范、内容规范三种。基本规范主要是给所有产品设计参与人员一个大致的认识，是所有产品设计都
须注意的地方；特定产品的规范主要是给界面设计师，以及开发人员参考，确定具体位置的具体文字；内容规范则是给内容编辑，或者其他内容贡献者（非用户）的
行文规范。&lt;/p&gt;
 
&lt;p&gt;关于界面文字语言的&lt;strong&gt;基本规范&lt;/strong&gt;，大体包含以下几点（不展开讨论，本期文章很多都已经谈及）：&lt;/p&gt;
 
&lt;p&gt;* 一致性：在相同使用场景中不出现两个或多个词汇描述同一种操作或同一件事物；&lt;br /&gt; * 准确性：不使用易混淆的文字描述常见事物，使用常见通俗的语言，不罗嗦；&lt;br /&gt; * 情感化：结合人物角色，使用易记、与产品传达体验一致的语言；（白鸦常称之为产品的气质）&lt;br /&gt; * 节奏感：主要是文字在一般需要注意的大小、颜色限定。&lt;/p&gt;
 
&lt;p&gt;此规范一般不需要特别去起草，基本上所有公司通用，同时可以在所有产品、项目中通用。此规范中不涉及具体产品的界面文字，属于提纲挈领的作用。通常也被称作界面文字设计纲要。至于该规范的实施和执行，我觉得主要依赖于内部培训（或者研讨），因为涉及到的人比较多。&lt;/p&gt;
 
&lt;p&gt;&lt;strong&gt;特定产品的规范&lt;/strong&gt;是针对某一特定产品或项目制订的文字语言规范，大部分没有专人负责的情况下可以由产品经理和设计
师共同起草。设计师在具体产品设计过程中，原型和规范应该是一起形成的，最后再交付实现。在这部分规范里，主要是在基本规范的约束下，制定的具体的文字方
案。比如按钮上应该是&amp;ldquo;提交&amp;rdquo;还是&amp;ldquo;确定&amp;rdquo;，栏目名应该是&amp;ldquo;今日热门&amp;rdquo;还是&amp;ldquo;今日热点&amp;rdquo;，当然还包括交互过程中的操作提示语言。&lt;/p&gt;
 
&lt;p&gt;这个文档的存在，是为了让产品在不断改进和发展的过程中，能够符合基本规范。&lt;/p&gt;
 
&lt;p&gt;&lt;strong&gt;内容规范&lt;/strong&gt;相对比较特殊，即文字性内容的行文规范。大部分如千鸟文中所说，一些是语文上的要求，一些参考可用性原则。比如在一篇文章中，一行多少文字，行间距多少，段落之间空多少等。我相信在很多门户网站的编辑部门都是由这样的规范，甚至还有比如打错一个字罚多少钱在里面。&lt;/p&gt;
 
&lt;p&gt;界面上的文字很重要，这点已经毋庸置疑。接下来就看怎么去做了。最后&lt;strong&gt;关于实施&lt;/strong&gt;，我的建议是：基本规范以培训为主，特定产品的规范已原型为主、文档为辅，内容规范主要结合绩效考核和奖惩。这和招不招专人负责无关，招专人就是控制一下流程和审查（我不信能招到好的界面文字专员，如果是内部分工细化，倒是会形成这样的专业岗位）。&lt;/p&gt;
&lt;/div&gt;&lt;p&gt;相关话题：&lt;a href=&quot;http://ucdchina.com/topic/12&quot; target=&quot;_blank&quot;&gt;界面上的文字&lt;/a&gt;&amp;nbsp;源地址：&lt;a href=&quot;http://ucdchina.com/blog/?p=350&quot; target=&quot;_blank&quot;&gt;http://ucdchina.com/blog/?p=350&lt;/a&gt;&lt;/p&gt;</description>
				<author>JunChen</author>
				<pubDate>2008-07-26 23:22:59</pubDate>
			</item>			<item>
				<title>文字的减法</title>
				<link>http://ucdchina.com/snap/134</link>
				<description>&lt;div id=&quot;entry_content&quot; class=&quot;entry&quot; style=&quot;font-size: 13px;&quot;&gt;
&lt;p&gt;认知心理学家Donald A. Norman将人类的行动分解成七个阶段：&lt;/p&gt;
 
&lt;p&gt;1.	确定目标&lt;br /&gt; 2.	确定意图&lt;br /&gt; 3.	明确行动内容&lt;br /&gt; 4.	执行&lt;br /&gt; 5.	感知外部状况&lt;br /&gt; 6.	解释外部状况&lt;br /&gt; 7.	评估行动结果&lt;/p&gt;
 
&lt;p&gt;这七个阶段发生在人类所采取的每一个行动时。&lt;/p&gt;
 
&lt;p&gt;比如最近降温，你想要保持身体的舒适感（确定目标），所以就得加一件衣服（确定意图），于是你决定去衣柜里看看哪件衣服适合今天穿（明确行动内
容），然后你就选择了一件并穿在身上了（执行），这时你感觉暖和一点了（感知外部状况），因而你确定衣服被穿在了身上（解释外部状况），你觉得不冷了感觉
很舒适（评估行动结果）──这么写出来你可能会觉得别扭，因为这些判断发生得非常快，你可能永远不会注意到中间的过程（有很多科幻小说和马路上骗人的把戏
都是利用了这一点，有兴趣的同学可以自己分析分析，此为题外话）。&lt;/p&gt;
 
&lt;p&gt;但是，当人和机器发生交互的时候，人类仍然遵循这样的反馈法则，而机器使用的却是另一套法则，这就正是人机交互永远不顺畅的根本原因。我们都知道，
人类是善于解释现象，并能根据解释的结果来决定下一步行动的。这种本能反馈在现实生活中没有太大的问题，但搬到计算机世界就面临很大的设计挑战，因为行动
七阶段中最关键的一环&amp;mdash;&amp;mdash;感知外部状况&amp;mdash;&amp;mdash;在计算机世界中完全依赖于设计。因而一个未经设计的产品，基本上等于是把它的使用者扔进了一个既没有声音也没有
影像的黑暗世界，人们只能凭&amp;ldquo;直觉&amp;rdquo;和&amp;ldquo;本能&amp;rdquo;来与之交互。&lt;/p&gt;
 
&lt;p&gt;在刚才那个例子中，你&amp;ldquo;感知外部状况&amp;rdquo;时，使用的是触觉（也许？我不了解神经反射之类的原理，随便猜的）。那么在计算机世界中，你唯一能使用的，只有视觉（有少部分听觉的应用，不过鉴于大部分同学上班时都不得不关掉音箱，我们此处就不考虑这个情况）。&lt;/p&gt;
 
&lt;p&gt;看到这里，有同学可能会说：&amp;ldquo;是啊！所以文字正是起到了&amp;lsquo;描述外部状况&amp;rsquo;的作用！&amp;rdquo;&lt;/p&gt;
 
&lt;p&gt;当然，这是我们这一期要讨论的主题，但是我在前面分析了半天，结论却刚刚相反：有时候，文字恰恰是可以省略掉的元素。&lt;/p&gt;
 
&lt;p&gt;为什么？举个简单的例子，当你在拧螺丝钉的时候，你是如何感知它的变化的呢？通过文字描述&amp;ldquo;螺丝钉已经旋转了四分之三圈&amp;rdquo;，还是通过它&amp;ldquo;逐渐变短的身躯&amp;rdquo;知道的呢？&lt;/p&gt;
 
&lt;p&gt;一个不停地报告旋转圈数的螺丝钉听起来是不是很可笑呢？&lt;/p&gt;
 
&lt;p&gt;可是这样界面到处都有。&lt;/p&gt;
 
&lt;p&gt;&amp;ldquo;添加好友成功&amp;rdquo;、&amp;ldquo;加入小组成功&amp;rdquo;、&amp;ldquo;请在下方输入你的手机号&amp;rdquo;&amp;hellip;&amp;hellip;比比皆是，而在我看来，甚至包括&amp;ldquo;登录失败，请重新登录&amp;rdquo;在内的提示文字都是
多余的。我在输入账号和密码以后，不能进入&amp;ldquo;我的XXX&amp;rdquo;，这件事本身就说明问题了，设计师要做的，只要保证用户的视觉焦点集中在出错的位置并标识出差异
（比如，输入框变成红色，增加图标之类）就够了，你有几次是阅读了界面上的文字才知道密码输错的呢？&lt;/p&gt;
 
&lt;p&gt;Norman还有一个著名的理论：如果一个产品需要文字来描述用途，那么它就不是一个设计良好的产品。一个需要看说明书才能知道怎么用的水壶，绝对是因为它长得不像水壶。同理，一个需要阅读文字才知道出了什么状况的系统，绝对是因为它看起来不像是出了状况。&lt;/p&gt;
 
&lt;p&gt;很多时候，我们想方设法地优化、精简文字，也总结出一些类似&amp;ldquo;动词+对象+状态&amp;rdquo;的措词原则，却恰恰忽略了我们与生俱来的本能：我们天生对形状、颜
色和位置敏感。再加上计算机用户扫描式的屏幕阅读习惯，更是导致了对文字视若无睹的现象。其实在某些特定场景下，我们完全可以利用其它手段来表示外界的变
化。&lt;/p&gt;
 
&lt;p&gt;我很希望有一天，当我在某个网站登录不成功时，它能把屏幕微微地震动一下，而不是蹦出一行红字告诉我我已经知道的状况。&lt;/p&gt;
&lt;/div&gt;&lt;p&gt;相关话题：&lt;a href=&quot;http://ucdchina.com/topic/12&quot; target=&quot;_blank&quot;&gt;界面上的文字&lt;/a&gt;&amp;nbsp;源地址：&lt;a href=&quot;http://ucdchina.com/blog/?p=323&quot; target=&quot;_blank&quot;&gt;http://ucdchina.com/blog/?p=323&lt;/a&gt;&lt;/p&gt;</description>
				<author>Angela</author>
				<pubDate>2008-07-26 23:21:40</pubDate>
			</item>			<item>
				<title>像聪明女孩穿衣服那样设计网页文字</title>
				<link>http://ucdchina.com/snap/133</link>
				<description>&lt;div id=&quot;entry_content&quot; class=&quot;entry&quot; style=&quot;font-size: 13px;&quot;&gt;
&lt;p&gt;这世上&amp;ldquo;没有丑女人，只有懒女人&amp;rdquo;这是女人美丽圣经里的最精彩的一句话了，一个女人只要舍得花时间琢磨怎么保养，怎么打扮，总能够找到方法展现自己美丽的一面的。界面设计何尝不是如此？那就让我们来看看聪明女人的穿衣之道里有没有什么做设计可以借鉴的地方。&lt;/p&gt;
 
&lt;p&gt;&lt;strong&gt;原则一：全身搭配的衣服主色不要超过三种。&lt;/strong&gt;&lt;br /&gt; 不管什么样的衣着都应该有一个主色调，代表穿衣者想彰显的气质，她不可能样样都强调&amp;mdash;&amp;mdash;也许她有安静的一面，犹如蓝色；也可能有调皮的一面，犹如橙色：知
性的一面，犹如白色：可爱的一面，犹如粉色&amp;hellip;&amp;hellip;但是她如果把这些颜色同时穿出来，那她除了像只花蝴蝶外将一无是处。这就好比一个页面，它的主要字体和颜色
搭配不应该超过三种，他们分别用做：最重要的，比较重要的，一般的。别试图什么都强调，你会到头来什么都抓不到。&lt;/p&gt;
 
&lt;p&gt;看看下面两个例子：&lt;br /&gt; 我很喜欢这个网站，可我不得不承认，这个页面看上去的确像只花蝴蝶。&lt;br /&gt; &lt;a title=&quot;taobao.jpg&quot; rel=&quot;attachment wp-att-342&quot; href=&quot;http://ucdchina.com/blog/?attachment_id=342&quot;&gt;&lt;img src=&quot;http://img.ucdchina.com/upload/snap/2008-12/91d4f9a26fb6b2afbf80f0ad9099edd7.jpeg&quot; alt=&quot;taobao.jpg&quot; /&gt;&lt;/a&gt;&lt;/p&gt;
 
&lt;p&gt;还有这位，光是首页它已经大量使用至少五种字体，也许设计者觉得字体库里字体那么多，不用很浪费。&lt;br /&gt; &lt;a title=&quot;guopi.jpg&quot; rel=&quot;attachment wp-att-343&quot; href=&quot;http://ucdchina.com/blog/?attachment_id=343&quot;&gt;&lt;img src=&quot;http://img.ucdchina.com/upload/snap/2008-12/92fe6766f7c16dce4763635ec07ba8d4.jpeg&quot; alt=&quot;guopi.jpg&quot; /&gt;&lt;/a&gt;&lt;/p&gt;
 
&lt;p&gt;&lt;strong&gt;原则二：配饰风格要统一，相互呼应&lt;/strong&gt;&lt;br /&gt; 如果一位女孩今天应邀参加某时尚晚会，她选了件贴身晚礼服，打算来个华丽丽的登场，你觉得她除了配一双高跟鞋外还有其他什么选择吗?恐怕没了。哪怕她有一
双超炫的飞人亲笔签名的绝版耐克气垫鞋很想穿出来秀一下那也好歹要忍住。两件单品风格完全不同，即便都是顶级货，搭在一起也往往是场灾难。&lt;br /&gt; 也许我们会比较注意网页中文本文字的统一性，但是却经常忽略页面的图片中文字的统一性，看看下面的例子，同样是销售折扣商品，当当的商品图片里价格张张标
注在不同位置，这实在是很容易扰乱视觉效果，降低信息传达的效率。而亚马逊的则把所有商品折扣标注在统一位置，只用背景色变化来区分折扣高低。把每一个差
异化设计都用在有需要的地方。&lt;br /&gt; &lt;a title=&quot;unin1.jpg&quot; rel=&quot;attachment wp-att-349&quot; href=&quot;http://ucdchina.com/blog/?attachment_id=349&quot;&gt;&lt;img src=&quot;http://img.ucdchina.com/upload/snap/2008-12/5da17f9cde5a53d55a5ab55bc3cd8d4c.jpeg&quot; alt=&quot;unin1.jpg&quot; /&gt;&lt;/a&gt;&lt;/p&gt;
 
&lt;p&gt;&lt;strong&gt;原则三：细节决定成败&lt;/strong&gt;&lt;br /&gt; 发现没有，一些女孩的打扮看上去很自然随意，感觉像是不经意就穿出来了，但又很是耐看。我敢保证，这样的女孩十有八九是在家做足功课才会出门的，哪件衣服
配哪条项链，哪个发型配哪个耳环，甚至是袖子的边是否该卷上，卷上去几分人家都是花心思琢磨过的。这样才能保证把每个细节都做得完美无缺。&lt;br /&gt; 其实很多设计乍一看都还不错，可是细看却感觉糙了些，就像漂亮衣服上扯出毛边一样，等到真正用起来会发现&amp;mdash;&amp;mdash;天！！@￥@#%#￥&amp;hellip;%￥&amp;amp;&lt;br /&gt; 只要再多花5个像素留给文字和边框，这个豆腐块就能看起来舒服很多，干嘛不慷慨一点呢？&lt;br /&gt; &lt;a title=&quot;5px.jpg&quot; rel=&quot;attachment wp-att-345&quot; href=&quot;http://ucdchina.com/blog/?attachment_id=345&quot;&gt;&lt;img src=&quot;http://img.ucdchina.com/upload/snap/2008-12/e54513496baf8b78a4059b68434b57f0.jpeg&quot; alt=&quot;5px.jpg&quot; /&gt;&lt;/a&gt;&lt;/p&gt;
 
&lt;p&gt;如果你胖，那就减肥，可别把自己硬塞进紧身黑裤里。如果文字多空间少，那就删文字，可别把他们堆到狭小的空间。原本只能放下四行字（看左边框内）的空间硬被塞进了五行字，看着真叫一个憋屈啊。&lt;br /&gt; &lt;a title=&quot;toofat.jpg&quot; rel=&quot;attachment wp-att-346&quot; href=&quot;http://ucdchina.com/blog/?attachment_id=346&quot;&gt;&lt;img src=&quot;http://img.ucdchina.com/upload/snap/2008-12/e1d70d83c9a31320642cd6dac3885024.jpeg&quot; alt=&quot;toofat.jpg&quot; /&gt;&lt;/a&gt;&lt;/p&gt;
 
&lt;p&gt;大多数网站都把宋体设为主要文字显示字体，可是我发现很少有网站注意到宋体用来显示英文是非常不易于阅读的，虽然我们是中文网站，但是随着越来越多的英文单词进入我们的页面内容中，我们为何不多花那一点点力气考虑给英文单独定义一个字体呢?&lt;br /&gt; &lt;a title=&quot;english1.jpg&quot; rel=&quot;attachment wp-att-348&quot; href=&quot;http://ucdchina.com/blog/?attachment_id=348&quot;&gt;&lt;img src=&quot;http://img.ucdchina.com/upload/snap/2008-12/b4350ef67d0823e22870bcd46754132d.jpeg&quot; alt=&quot;english1.jpg&quot; /&gt;&lt;/a&gt;&lt;/p&gt;
&lt;/div&gt;&lt;p&gt;相关话题：&lt;a href=&quot;http://ucdchina.com/topic/12&quot; target=&quot;_blank&quot;&gt;界面上的文字&lt;/a&gt;&amp;nbsp;源地址：&lt;a href=&quot;http://ucdchina.com/blog/?p=335&quot; target=&quot;_blank&quot;&gt;http://ucdchina.com/blog/?p=335&lt;/a&gt;&lt;/p&gt;</description>
				<author>Lanx</author>
				<pubDate>2008-07-26 23:19:56</pubDate>
			</item>			<item>
				<title>文本达意和可用性</title>
				<link>http://ucdchina.com/snap/132</link>
				<description>&lt;div id=&quot;entry_content&quot; class=&quot;entry&quot; style=&quot;font-size: 13px;&quot;&gt;
&lt;p&gt;在文本的设计中，我们通常关注的是文字的排版，如何排版才能让我们的文字看起来更美观，更容易阅读；然而，文字本身所表达的意思与此同等重要，因为我们把排版做好的根本意义还是要用户更容易读明白所表达的内容。&lt;/p&gt;
 
&lt;p&gt;一、&lt;strong&gt;下面我们就设计中的几点，通俗的讨论一下这块的重要性&lt;/strong&gt;。文本在软件设计随处可见，例如：标题、按钮上的文字、信息反馈文本、导航等等。&lt;/p&gt;
 
&lt;p&gt;&lt;strong&gt;标题&lt;/strong&gt;主要告诉我们当前界面的主题，比如：从我们的win操作系统桌面进入&amp;ldquo;网上邻居&amp;rdquo;，标题显示的就是&amp;ldquo;网上邻居&amp;rdquo;，是和我联网电脑的统称，如果用&amp;ldquo;我的邻居&amp;rdquo;来表达，也可以理解成&amp;ldquo;网上邻居&amp;rdquo;这个意思，但是不够准确，因为有的人会理解成&amp;ldquo;住在我隔壁的邻居&amp;rdquo;。&lt;/p&gt;
 
&lt;p&gt;如果感觉以上例子太罗嗦，且不够直观，我们还可以拿错误提示窗口的标题来看一下&lt;/p&gt;
 
&lt;p&gt;&lt;img src=&quot;http://img.ucdchina.com/upload/snap/2008-12/adb785fa4a82ac7f502a651719178368.jpeg&quot; alt=&quot;071026000.jpg&quot; /&gt;&lt;/p&gt;
 
&lt;p&gt;上图中的标题&amp;ldquo;重命名文件或文件夹时出错&amp;rdquo;，我们简单的可以分析出，这个标题具有上下文的相关性，首先它是一个出错信息提示窗口，同时也说明了在什
么操作的时候出错，在达意上来说，恰到好处。如果你硬说直接用&amp;ldquo;出错了&amp;rdquo;也作为标题，没有人会说你说错了，只是突然弹出一个窗口来，简单的一个&amp;ldquo;出错了&amp;rdquo;
可能会让某些用户摸不着头脑，降低了可用性。&lt;/p&gt;
 
&lt;p&gt;&lt;strong&gt;按钮&lt;/strong&gt;也是我们常用的表达元素，很多按钮的功用我们是用文字来表达的，还是列举我们常见的例子：&lt;br /&gt; a、在填写注册表单的时候，你通常会看到&amp;ldquo;提交注册信息&amp;rdquo;或&amp;ldquo;注册&amp;rdquo;等类似的按钮。如果写成&amp;ldquo;提交表单&amp;rdquo;可能有很多用户为&amp;ldquo;表单&amp;rdquo;这个专业术语纳闷。&lt;br /&gt; b、当你写博客的时候，你通常是看到&amp;ldquo;发布&amp;rdquo;按钮。如果给你放一个&amp;ldquo;确认&amp;rdquo;按钮，你会试试这个&amp;ldquo;确认&amp;rdquo;按钮就是&amp;ldquo;发布&amp;rdquo;吧？这个尝试的心态恰恰说明了按钮文本没有达意，使用者要去猜测它的准确含义。&lt;br /&gt; c、在我们使用聊天软件聊天时，如果聊天窗口上的&amp;ldquo;发送&amp;rdquo;按钮被改成&amp;ldquo;提交&amp;rdquo;的话，你会感到很别扭，其实也是文字表达的是否准确在作怪。&lt;/p&gt;
 
&lt;p&gt;综合上例所述，我们总是在特定的场景使用特定的文本来描述按钮的功用，在可用性和易用性上，文本自身的意义起到关键的作用。&lt;/p&gt;
 
&lt;p&gt;&lt;strong&gt;信息提示文本&lt;/strong&gt;在软件界面设计里是很受重视的一块，仅仅因为它被用来直接和用户对话；在用户使用软件出现问题时，
信息文本反馈可以引导用户进行操作，而这个交互的过程主要通过文本提示进行，在此处文本描述的准确性和建设性有着首要地位。信息提示文本最主要的就是&amp;ldquo;说
明错误发生的原因，并给出建设性的操作提示&amp;rdquo;，不允许嘲笑用户、命令、指责等带有情绪语言和语气。&lt;/p&gt;
 
&lt;p&gt;&lt;img src=&quot;http://img.ucdchina.com/upload/snap/2008-12/e8e2067111f0372ed127b5bb39856f52.jpeg&quot; alt=&quot;071026002.jpg&quot; /&gt;&lt;/p&gt;
 
&lt;p&gt;上图是一个确认提示，准确的说明我们要删除的是&amp;ldquo;我的电脑 图标&amp;rdquo;而不是&amp;ldquo;我的电脑&amp;rdquo;，否则部分用户会理解为删除了电脑上所有的文件。还提示之后的恢复办法，这样说才够明白，操作者对此贴心的提示基本不再有啥疑惑了。&lt;/p&gt;
 
&lt;p&gt;&lt;strong&gt;导航文本&lt;/strong&gt;就不再细说了，导航说的是什么意思，点进去就是什么内容。一般情况下，欺骗用户点击，可能造成失去这个用户。如果你纯粹是为了骗人，不反对你把导航书写的文不对题。&lt;/p&gt;
 
&lt;p&gt;&lt;strong&gt;二、如何保证文本达意的几点建议：&lt;/strong&gt;&lt;/p&gt;
 
&lt;p&gt;1、如果你们有专业的人员负责这块，那么很庆幸，他们可以这搞定一切。如果没有，以下几条希望可以帮到你。&lt;br /&gt; 2、注重使用的场景和用户的特点，使用的语言让你的用户易懂，避免使用难懂的专业术语。&lt;br /&gt; 3、如果是标题，看能否说明白当前界面的主题，需要表达上下文的，还要交代一下本界面的来源。例如：信息提示窗口最好交代出由于那个操作所引起的。&lt;br /&gt; 4、关于信息提示文本，建议找一个规范读一下。特别要注意的是：要客观、准确的说明原因，并同时给出建设性的操作建议；至于情绪化的语言，还是省省。&lt;br /&gt; 5、按钮要保证和功用相符，导航则力求和内容一致，虽然简单，还是建议认真的去斟酌词句。&lt;br /&gt; 6、若可能的话，顺带测试身边的3～4个非电脑专业人员，尽量避免初期有过多的主观臆断。&lt;/p&gt;
&lt;/div&gt;&lt;p&gt;相关话题：&lt;a href=&quot;http://ucdchina.com/topic/12&quot; target=&quot;_blank&quot;&gt;界面上的文字&lt;/a&gt;&amp;nbsp;源地址：&lt;a href=&quot;http://ucdchina.com/blog/?p=332&quot; target=&quot;_blank&quot;&gt;http://ucdchina.com/blog/?p=332&lt;/a&gt;&lt;/p&gt;</description>
				<author>奇遇</author>
				<pubDate>2008-07-26 23:17:53</pubDate>
			</item>			<item>
				<title>内容呈现建议十条</title>
				<link>http://ucdchina.com/snap/131</link>
				<description>&lt;div id=&quot;entry_content&quot; class=&quot;entry&quot; style=&quot;font-size: 13px;&quot;&gt;
&lt;p&gt;围绕文字、符号、链接三个方面，主要是中文，草拟的个人行文经验：&lt;/p&gt;
 
&lt;p&gt;&lt;strong&gt;1. 文字避免写错。&lt;/strong&gt;应付挑剔的读者是一个方面，某些关键词的错误，有可能就避过了搜索引擎抓取。&lt;/p&gt;
 
&lt;p&gt;&lt;strong&gt;2. 文字密度节奏的控制。&lt;/strong&gt;段落在四行左右比较合适，宜少不宜多，同时避免文字量大的段落连续堆积，段落之间最好的节奏不是一一二二三三，而是类似一三二三一二的无序结构，纵横道理类似。&lt;/p&gt;
 
&lt;p&gt;&lt;strong&gt;3. 词语避免在同行断开。&lt;/strong&gt;比如行末一个&amp;ldquo;搜&amp;rdquo;，下行头一个&amp;ldquo;狐&amp;rdquo;，用户读起来比较费劲。注意英文的默认段落内，一个单词不会断开，原因也是如此。&lt;/p&gt;
 
&lt;p&gt;&lt;strong&gt;4. HTML结构代码&lt;a title=&quot;语义化提高页面质量 - 千鳥志&quot; href=&quot;http://blog.rexsong.com/?p=945&quot; target=&quot;_blank&quot;&gt;符合语义标准&lt;/a&gt;。&lt;/strong&gt;比较混乱的大概是有序、无序、定义三个列表，写12345和使用ol的效果区别不大，但搜索引擎会认为他们的意义不一样。&lt;/p&gt;
 
&lt;p&gt;&lt;strong&gt;5. 实体转义码的作用。&lt;/strong&gt;典型如在中文后用&amp;amp;nbsp;表示英文空格，使用&amp;amp;copy;表示版权，还有使用&amp;amp;lt;和&amp;amp;gt;替换&amp;lt;&amp;gt;显示HTML代码等用途。&lt;/p&gt;
 
&lt;p&gt;&lt;strong&gt;6. 标点符号避免写错。&lt;/strong&gt;中文的博大精深主要依赖于标点和断句，标点符号除了能准确传达语气和语境，其实也有一定的语义分析价值，只不过现在的搜索引擎技术还无法实现。&lt;/p&gt;
 
&lt;p&gt;&lt;strong&gt;7. 符号的应用和差别。&lt;/strong&gt;有中英、全半角之分，符号呈现和字体样式定义是配套的，比如（）和()的效果差异。常用和特殊符号建议少用，包括○&amp;uarr;★&amp;rarr;⒌Ⅶ○『△等等。&lt;/p&gt;
 
&lt;p&gt;&lt;strong&gt;8. 中文数字和阿拉伯数字的区别。&lt;/strong&gt;看个人语感和默认规范，主要是统一和前后一致。&lt;/p&gt;
 
&lt;p&gt;&lt;strong&gt;9. 链接量的控制。&lt;/strong&gt;单篇内容的关键词控制在5%以内比较合适，否则看起来到处都是重点，意义适得其反，而且给
视觉效果处理也增加了难度。两个链接上下重叠在一起的效果并不好，三个就会很糟糕。一篇400字的内容，20个字10个词的链接都在上半截也不好，因为整
个页面不平衡，同时和密度也有关系。&lt;/p&gt;
 
&lt;p&gt;&lt;strong&gt;10. 色彩的合理使用。&lt;/strong&gt;不同颜色的功能区别，比如链接提示，得给用户清晰的逻辑，字符&lt;a title=&quot;用户喜欢点什么 - 千鳥志&quot; href=&quot;http://blog.rexsong.com/?p=739&quot; target=&quot;_blank&quot;&gt;是否可点&lt;/a&gt;需要看出来，而不是试出来。除此之外还有不同深浅的强弱区别，最后还得控制色彩数量。&lt;/p&gt;
 
&lt;p&gt;以上只是文字的表面细节，原则上只是尽量，毕竟内涵最重要，实在有才的牛人另当别论，可能行文糟糕也是一种风格。具体需要用户感知和配合的注意事项，请阅读&lt;a title=&quot;注意界面上的文字 - UCDChina&quot; href=&quot;http://ucdchina.com/blog/index.php?tag=%280710a%29%E6%B3%A8%E6%84%8F%E7%95%8C%E9%9D%A2%E4%B8%8A%E7%9A%84%E6%96%87%E5%AD%97&quot;&gt;注意界面上的文字&lt;/a&gt;其他文章。&lt;/p&gt;
 
&lt;p&gt;&lt;em&gt;注意，某些在非固定宽度下不适用。&lt;/em&gt;&lt;/p&gt;
&lt;/div&gt;&lt;p&gt;相关话题：&lt;a href=&quot;http://ucdchina.com/topic/12&quot; target=&quot;_blank&quot;&gt;界面上的文字&lt;/a&gt;&amp;nbsp;源地址：&lt;a href=&quot;http://ucdchina.com/blog/?p=330&quot; target=&quot;_blank&quot;&gt;http://ucdchina.com/blog/?p=330&lt;/a&gt;&lt;/p&gt;</description>
				<author>千鸟</author>
				<pubDate>2008-07-26 23:16:36</pubDate>
			</item>			<item>
				<title>文字的辨识度与可读性</title>
				<link>http://ucdchina.com/snap/130</link>
				<description>&lt;div id=&quot;entry_content&quot; class=&quot;entry&quot; style=&quot;font-size: 13px;&quot;&gt;
&lt;p&gt;不久前因业务需要，我在自己的笔记本中安装了搜霸。当时一个做平面的朋友过来和我做一些设计交流，&lt;br /&gt; 我在笔记本前准备输入一个网址，他靠近我的电脑，大叫道：&amp;ldquo;嗷！你也认识我的老同学&amp;ldquo;高亮&amp;rdquo;啊！&amp;rdquo;&lt;br /&gt; 我惊出一身冷汗。&lt;br /&gt; &lt;a title=&quot;高亮&quot; href=&quot;http://ucdchina.com/blog/wp-content/uploads/2007/10/001.gif&quot;&gt;&lt;img src=&quot;http://img.ucdchina.com/upload/snap/2008-12/3dfeda39505958b43236dd8a728eeaa9.gif&quot; alt=&quot;高亮&quot; /&gt;&lt;/a&gt;&lt;/p&gt;
 
&lt;p&gt;几乎所有的产品中，都会使用到文字。小到错误、警告、提示信息，大到介绍、专题策划、广告文案。&lt;br /&gt; 如果文字出现问题，修改起来成本很低。然而文字的可用性如果不好，将直接作用于产品。&lt;/p&gt;
 
&lt;p&gt;我将文字的可用性理解为&lt;strong&gt;辨识度&lt;/strong&gt;与&lt;strong&gt;可读性&lt;/strong&gt;两个方面。&lt;/p&gt;
 
&lt;p&gt;&lt;strong&gt;辨识度&lt;/strong&gt;就是文字在界面上出现时，用户能不能正常阅读。&lt;br /&gt; 在设计中最常遇到的问题是关于文字的字体、字号、以及行距、间距。&lt;br /&gt; 在中文的WEB设计中，12号和14号宋体是最常使用的，&lt;br /&gt; 纵观几大国内门户网站，这几乎已经成为中国网友的阅读习惯。&lt;br /&gt; 而遇到列表或大段文字，还需要注意行距问题。&lt;br /&gt; 例如12号宋体时，我们一般使用18-20像素的行距。14号宋体通常使用22-24像素的行距。&lt;br /&gt; WEB设计时，一般不用考虑平面设计中字与字的间距问题，而使用默认状态。&lt;/p&gt;
 
&lt;p&gt;但是也有例外。有时我们会用到18号的黑体或宋体，例如新闻内页的标题。&lt;br /&gt; 特别要提一下UCDCHINA.COM上的文章顶部右侧都会有一个&amp;ldquo;-&amp;rdquo;一个&amp;ldquo;+&amp;rdquo;号：&lt;br /&gt; &lt;a title=&quot;002.gif&quot; href=&quot;http://ucdchina.com/blog/wp-content/uploads/2007/10/002.gif&quot;&gt;&lt;img src=&quot;http://img.ucdchina.com/upload/snap/2008-12/216727fcd83e45d67307f8a0c3a78dac.gif&quot; alt=&quot;002.gif&quot; /&gt;&lt;/a&gt;&lt;br /&gt; 这是一个很贴心的设计，当视力较弱或者年老的读者需要大一点的字体时。&lt;br /&gt; 可以使用&amp;ldquo;+&amp;rdquo;这个功能来提高文本的辨识度。&lt;/p&gt;
 
&lt;p&gt;同时，设计师还要考虑文本的颜色、加粗、对齐方式、对比度、链接样式等辨识度方面的问题。&lt;br /&gt; 为了重点显示某些信息，我们通常会给文字加粗或改变字体的颜色，但是要慎用。&lt;br /&gt; 过度的强调等于没有强调，例如下面这种情况：&lt;br /&gt; &lt;a title=&quot;003.gif&quot; href=&quot;http://ucdchina.com/blog/wp-content/uploads/2007/10/003.gif&quot;&gt;&lt;img src=&quot;http://img.ucdchina.com/upload/snap/2008-12/717d539ebfb1b9c2dac8cb9f9cbe0aa4.gif&quot; alt=&quot;003.gif&quot; /&gt;&lt;/a&gt;&lt;/p&gt;
 
&lt;p&gt;一些保守的设计师强烈要求带链接的文本要有下划线,而一些设计师却很反感大面积出现下划线的链接。&lt;br /&gt; 我觉得重点不是下划线的问题，而是凡是有链接的文字，需要与别的文字做一个明显的提示，以示区别。如：&lt;br /&gt; &lt;a title=&quot;005.gif&quot; href=&quot;http://ucdchina.com/blog/wp-content/uploads/2007/10/005.gif&quot;&gt;&lt;img src=&quot;http://img.ucdchina.com/upload/snap/2008-12/f3aab0869e67bd822ad153c8c83ce2cc.gif&quot; alt=&quot;005.gif&quot; /&gt;&lt;/a&gt;&lt;/p&gt;
 
&lt;p&gt;在&lt;strong&gt;可读性&lt;/strong&gt;方面，会出现的问题也不少，设计师遇到时要学会将它们剔出来。&lt;br /&gt; 经常出现的会是&amp;ldquo;术语&amp;rdquo;问题，因为我们经常会在设计产品时无意识地使用一些术语。&lt;br /&gt; 很多术语对我们自己来说简单，但是对我们的目标用户群来说并不容易。&lt;/p&gt;
 
&lt;p&gt;例如，要避免使用&amp;rdquo;ISP&amp;rdquo;,而要说成&amp;rdquo;网络服务供应商&amp;rdquo;。别对用户说&amp;rdquo;PV&amp;rdquo;,而告知&amp;ldquo;流量&amp;rdquo;等等。&lt;br /&gt; 我们应尽量使用用户的语言，而不是想当然的使用术语。&lt;br /&gt; 如果一定要使用术语，那么在每次出现这个词时要一致。&lt;br /&gt; 千万不要一会&amp;ldquo;搜索&amp;rdquo;，一会&amp;ldquo;查找&amp;rdquo;，一会&amp;ldquo;查询&amp;rdquo;，不一致会增加用户的学习成本。&lt;/p&gt;
 
&lt;p&gt;另一个常见的问题就是含义模糊不清，词不达意。&lt;br /&gt; 例如上文提到的&amp;ldquo;高亮&amp;rdquo;，其实重点不是会不会联想到你的同学叫高亮，&lt;br /&gt; 而是&amp;ldquo;高亮&amp;rdquo;代表什么功能让人摸不着头脑：是谁让谁高让谁亮，为什么要高亮，&lt;br /&gt; 不高亮行不行？是变高还是变亮？&lt;br /&gt; 这不是产生误解的问题，而是不解&amp;mdash;&amp;mdash;不知道它是干什么的，自然就不敢去使用它。&lt;/p&gt;
&lt;/div&gt;&lt;p&gt;相关话题：&lt;a href=&quot;http://ucdchina.com/topic/12&quot; target=&quot;_blank&quot;&gt;界面上的文字&lt;/a&gt;&amp;nbsp;源地址：&lt;a href=&quot;http://ucdchina.com/blog/?p=324&quot; target=&quot;_blank&quot;&gt;http://ucdchina.com/blog/?p=324&lt;/a&gt;&lt;/p&gt;</description>
				<author>子条</author>
				<pubDate>2008-07-26 23:14:56</pubDate>
			</item></channel></rss>