上篇：十个有效改进网页UI设计的技巧(上)
6.字符间距
web页面设计中的排版通常受到很多限制。虽然只有很少的字体可以安全的用于web设计并且可控性很低，但我们仍然可以做一些有价值的事情。除了文本间的行距，我们也可以通过CSS的\”letter-spacing”属性来控制字符间距。
通常字符间距的设置用于标题文字，对于正文的文本，还是建议采取默认设置，因为对于较小字号的文本，默认设置的可读性是最好的。请看下图示意：
可以通过如下CSS代码实现：
h1 {
font-family: Helvetica;
font-size: 27px;
}
h2 {
font-family: Helvetica;
font-size: 27px;
letter-spacing: -1px;
}
h3 {
font-family: Georgia;
font-size: 24px;
letter-spacing: 3px;
font-variant: small-caps;
font-weight: normal;
}
注意：即使只微小的调整几个像素，也会给字符的外观带来很大的变化。
7.让输入框自动获得焦点
很多网站都需要提交表单，比如搜索、用户登录等功能都需要一个或多个输入框。如果某个表单是当前页面的主要功能，那么考虑用户体验，就应该在页面载入时将输入焦点自动的置于首个表单项。这样用户就可以直接输入而不需要再使用鼠标点击了。比如大家使用baidu、google都会发现，打开页面后，光标就自动处于了输入框中。
自动获得焦点可以通过Javascript来实现，当然有很多种具体的实现方法。下面列举一种简单的：
<body onLoad=”document.forms.form_name.form_field.focus()”>
同时，表单中需要加入如下代码：
<form method=”get” name=”form_name” action=”#”>
<input type=”text” name=”form_field” size=”20″ />
<input type=”submit” value=”Go” />
</form>
现在，当页面载入完成，form_field这个input空间就会自动获得焦点，用户可以直接输入了。
大头：通常在拥有多个输入框的场合，比如登录需要输入用户名、密码，一些用户习惯通过Tab键来切换输入框，同样为了避免用户需要用鼠标点击来选择输入框，应该注意检查通过Tab键切换的顺序。
上图263邮箱的登录界面，Tab的切换顺序安排就不是很合理。
本着精益求精的原则，对于输入框还可以进一步优化，比如可以设置on_over事件，当鼠标移到input上时就自动获得焦点，省却了用户“点击”的操作。
8.自定义输入框
虽然表单元素的默认样式可以满足绝大多数要求，但我们经常会需要更漂亮或者更个性的输入框，有时也需要统一不同系统、浏览器上的表单样式。一般通过定义input的id、class后，通过CSS控制输入框的外观。代码及效果如下：
input {
border: 2px solid #888;
padding: 4px;
font-size: 1em;
background-color: #F8F8F8;
}
有趣的是，通过设置”:focus”，可以设置获得焦点时的input外观，如下图：
input:focus {
border-color: #000;
background-color: #FFFE9D;
}
应用input背景后，某些浏览器下input会显示边框，加入代码”outline: none;”即可解决。
9.鼠标移过的效果
有些时候要设计一些额外的功能控制，比如说修改、删除按钮，这种类型的元素其实没必要在每个条目上显示。隐藏一些操作元素可以简化页面显示，让用户将精力放在主要内容和功能上。如下图：
上图中效果可以通过简单的CSS实现，根本不需要JS。通过父div(移过区域)的hover来定义子div的显示状态：
.message .controls { display: none; }
.message:hover .controls { display: block; }
说明：message定义为父DIV的class，controls定义为要隐藏DIV的class，此效果不支持IE6
对于隐藏内嵌的<DIV>来说，可以有很多方法，比如用margin来将它\”挤\”出页面(例：left-margin:-9999px)；将内部文本与背景同色；在上方另外添加一个DIV也很简单。
如果这种技巧运用得当，可以有效的移除一些不需要重复显示的多余信息，使你的页面看起来简介明了。
10.需要用户确认时尽量用动词！
页面设计中经常会有提示用户操作的弹出窗口(或浮动层)，改善这时出现的按钮或链接的文字也是很有必要的。通常这种情况下使用的文字多是”确认”、\”取消”、\”是\”、\”否\”等等，用户需要仔细阅读提示内容来选择操作，很多网站都这样，不是吗？
如果我们用动词或动词词组来替代简单的是、否文字，就会减少用户的负担和迟疑，方便他们快速的作出决定。看看下边两个例子：
可以看到，使用动词让按钮的意义更加明确，用户不需要阅读提示文字即可作出正确的判断。
UI设计, 体验, 技巧, 网页设计
大头译自SM，过程中发现 幸福的收藏夹 已经译完了上半部分，感兴趣可到这里看他的版本。
从某种意义上来说，页面设计(web设计)也就是用户界面设计。有许多技巧可以帮助我们制作出漂亮、实用的界面，这里收集的10个小技巧就会对你有所帮助的。这些技巧并不依赖于特定的主题或模板，所以会适用于多数情况下的设计。不罗嗦了，我们开始吧！
1.改善链接体验
网页中的文字链接通常标有下划线，表示文字是可以点击的，但可点击区域不会超过字符的宽、高范围。设计类似这种带有超链接的可点击区域的时候，都可以通过一些小技巧来提高可用性，比如：增加间隔，有些情况下甚至可以把链接转换为块元素。如下图，用高亮来区别可点击区域。
显然，可点击的区域越大，用户点击就容易。在没有指定宽度的时候，将链接转换为块元素，可以使文字链接的可点击区域扩大到为整个容器的宽度，这样的设计尤其适用于侧边栏的链接。这个技巧可以通过如下CSS实现。
a {
display: block;
padding: 6px;
}
注意：由于转换为块元素只对链接的宽度起作用，所以需要设置间隔(padding)来保证块在纵向的间距。
2.按钮也需要排版！
设计的每一个细节失误都有可能把完美的产品变成平庸，比如按钮、Tab这样简单的界面元素，由于用户每天都会点击无数次，也需要适当的进行排版。请看下面一些例子：
乍看起来上图没有什么问题，仔细观察可以发现，按钮和select的文字都偏上，原因就是将小写字母作为了排版的基准，小写字母居中时，整个文字的位置就会显得偏上。如下图：
就像上图中，如果按钮上的文字包含大写字母或一些较高的小写字母，如”t,d,f,h,k,l”的时候，文字就会显得偏上。所以，通常应该把大写字母作为定位的基准，或者在小写字母较多时，稍微将文字的位置向上移动。
上面的文字排版使按钮看起来更舒服，注重像这样的小细节对界面设计大有帮助。
大头：虽然中文没有大小写字母的问题，但也有很多页面设计时不注重按钮的文字排版，导致错位。
3.利用对比来控制焦点
与上面两个技巧类似，我们也可以通过页面元素间的对比来控制用户关注的焦点。下面的例子关于文章标题与日期、作者等信息之间利用对比突出重点的例子。
上图中所有文本都是黑色，让我们试着来调整一下日期和作者文字的颜色看看
文章标题的对比度最高(颜色最重)，所以感觉凸显出来。同时，通过对比度的不同，将作者与日期也体现了区别。相比于字体、字号的设置，对比度(颜色深浅)更能凸显出不同。下面让我们改变一下对比度高低的顺序：
可以看到不同的对比度设置会有明显的效果，上图这种效果可能会用在一些显示大量信息的场合，如blog、论坛或SNS网站。凸显某些信息可以让用户快速的浏览、找到自己所需的内容。大头：我能想到的比如搜索结果页，将搜索条件突出显示可能会好些。
4.利用颜色来引起注意
当然，颜色的不同也可以有效地吸引用户对重要及可操作元素的注意力。举例来说，在前段时间美国总统候选人提名期间，很多候选人的页面上都有红色的“捐助”按钮，在页面整体是蓝色或其他冷色调的时候，鲜明的红色能够很有效的吸引访客的注意力。
像红、黄、橙等暖色调，天生就有较强的吸引眼球的能力，而且这种能力在对比蓝、绿等冷色调时就更为突出。有趣的是，这种差别会让人产生空间上的想象，比如蓝色背景上的橙色按钮会给人凸起的感觉，相反情况下会给人凹陷的感觉，详见下图：
大头：由于国内应用深色背景的网站较少，下面挑选一些大家熟悉的例子来展示一下颜色的应用。同时通过颜色区别来吸引用户注意也不必拘泥于冷、暖色调的对比。
上图中：豆瓣首页的＂马上注册＂按钮，以及登录区域都用粉色重点表示，由于豆瓣采用白色背景，所以淡淡的粉色也能起到突出的作用。
对于上线不久的虾米，凸显导航、\”了解更多”以及”软件下载”都有明确目的。
需要注意的是，尽量避免利用颜色凸显过多的元素，这样反而会让用户无所适从。
5.空白-不仅仅用来分隔
内容元素之间的空白也是设计中需要注意的问题之一，比如像按钮、导航条、文章内容、标题等等元素之间的空白都有必要关注。有效地利用空白，我们可以明确的表现出页面元素之间的关系。
举例来说，标题与内容相近可以表示之间的所属关系，但文字内容与其他元素有一定距离会方便阅读。请看下面的例子：
上面的图例看起来没什么问题，但仔细看可以发现，每个标题上下的空白是相等的，这样就没有明显的区分每部分内容。我们可以通过调整段落间的距离或段落中的行距来解决这个问题：
上图是否变得更清楚些？好的设计师通常会眯着眼或从远处来看看自己的作品，这样会有效的发现内容显示是否清楚的问题。大头：本篇博客也很好的做到了这一点：）
继续阅读，后半部分更精彩
UI设计, 体验, 技巧, 网页UI
最经工作太忙了，公司又经历了裁员，经济不景气已经影响了我们的生活。想必这段时间找工作的朋友们会很多，这也是求职/招聘网站崛起的好时机。别跟我提现在的三大招聘网站，太难用了
老样子，这11个域名都未注册，那位收了请留言捧个场吧~
9ejob.com “就易”-就业容易之意，当然，你也可以理解为\”就义”
creatjob.com 创造工作~~~
bearjob.com
jobejob.com
jobfolk.com
jobhao.com 中文可以叫\”找不好\”。。。
joborjob.com
jobzhao.com 这个是“找不着”
lonejob.com
seeinjob.com
unclejob.com
.com, 域名, 招聘, 招聘域名, 推荐, 求职
看新浪体育时发现姚明的最新一期广告，与巴克利、韦德一同出演。大概就是，韦德与巴克利被中国菜“醉虾”吓到，于是打电话给姚明，而姚明使坏让他们吃虾头先~
姚明, 巴克利, 广告, 醉虾, 韦德
某天，同事发给我个链接， EMI Rebuffs Baidu Claims，EMI”粗暴地\”拒绝了百度的要求。同时，查看百度新歌首发页面时，合作伙伴中也唯独金牌大风(EMI的版权代理公司)没有超链接。
这段时间对于百度的负面新闻实在太多了，抛开”癌症”之类的小广告不谈，对于百度一直备受争议的MP3搜索，也有大事发生。本来，四大唱片公司与百度的关系一直紧张，今年继音著协之后，环球、索尼BMG与华纳也起诉百度音乐搜索侵权，之前虽然与唱片公司分分和和很多次，但这次针对于百度MP3搜索的行业声讨与以前不同，三大音乐协会联合各唱片公司抵制百度MP3搜索，并且号召广告主和广告公司，建议不在百度投放广告，很快，LG就响应号召不在百度投放广告。
其实，百度在应对唱片公司诉讼的同时，也在积极的寻找新的共赢模式，包括这个近期推出的百度新歌首发等，可以明显的看出百度也在想尽办法能与唱片公司共赢。之前的一段时间，唱片公司虽然从百度得不到任何真金白银的收入，但也有一定的顾虑，不愿去彻底的和百度决裂。就比如在华语音乐占绝对优势的EMI。在07年1月，EMI和百度还达成授权协议，然而，当时被百度寄予厚望的模式，实施至今已经彻底失败，在音乐搜索EMI也断了从百度获得收益的念头。
关于这次EMI拒绝百度在“新歌首发”上的合作，国内并无报道，想必EMI与百度合约未到期(09年1月)，也不愿早早撕破脸皮，但估计到期后续约的可能性也很小了。有三大起诉在先，在华语音乐占据绝对优势地位的EMI也与百度渐行渐远，看来百度MP3的未来之路是必定坎坷了。
作为一名数字音乐行业的从业者，对百度MP3搜索是深恶痛绝，不容否认，给网民带来极大的方便和实惠，但这种杀鸡取卵的做法导致整个行业混乱和畸形发展。虽然欧美与中国一样，唱片CD销量持续下降，但欧美唱片公司可以从在线销售的增长中获利。而在中国，目前数字音乐的销售，仍然可以认为是零。因为在国外在线音乐消费这几年发展的过程中，中国市场由于有百度的存在，根本没有任何增长，唱片公司们只好转投SP，从而导致了几年中口水歌泛滥大江南北。随着SP行业整顿，收入下降，这两年连像样的口水歌都少见了。谁能告诉我08年出过什么好歌？？？至于通过广告获得收入与唱片公司分成，这样的事百度自己恐怕都不信，搜索音乐时能有几个用户会关注广告？百度自己都很难从音乐获得收入，拿什么来分给唱片公司呢？
发了半天牢骚，希望各大唱片公司能坚持立场，早点让这个行业走上正规，也希望百度能够用长远的眼光来看待现实问题，不要再干损人不利己的事。
btw：推荐可能吧的一篇文章关于百度事件的一系列思考，百度缘何成为众矢之的？
baidu, emi, 华纳, 新歌首发, 环球, 百度
Google曾推出了搜索服务器GSA （Google Search Appliance）即搭建搜索服务器的软硬件整体解决方案，面向企业、高校等提供搜索服务。近日，发布了软件版本(可用于虚拟机)-GSAve (Google Search Appliance virtual edition) Google搜索服务器虚拟版。
Gsave下载页面 Google黑板报说明文章
简单说来之前的GSA还主要面向于企业、团体，而新发布的GSAve则是个人应用级别的软件产品。以下看看GSAve的特点：
- 使用连接器管理工具，可以让 GSAve 抓取和索引到非 Web 形式的网络资源，例如存放在Sharepoint 中的文档。
- 使用 Feed API 和元数据搜索功能，您可以为自己的网络论坛（BBS）建立搜索功能。
- 您可以使用 Onebox 编程接口在搜索结果页面中提供实时数据。
- GSA 强大的安全搜索功能支持多种身份认证方式，使用户在搜索结果中只见到自己有权限访问的文档。
- 我们专门为小规模文档集设计了专门的网页排序算法。
- 用户可以定制 GSA 的搜索结果界面，甚至以 XML 格式的形式，来整合到您自己的应用中去。
由上看出几个重要特点：支持多种文档格式、实时、Feed支持、权限设置、专门的排序算法(不知可不可以修改)、可定制搜随结果页面。看下来，感觉这又是一个google重量级产品，只不过是面向站长类用户，而且门槛要比Analytics高很多啊。貌似像当初天网FTP搜索等功能，都可以方便的实现了。
忘了说一点，GSAve对于硬件的要求也算中等，最低配置：奔四2.8超线程 CPU，3G内存，40GB硬盘空间。应该有不少人的服务器能满足这个条件。
目前还没有看到有试用报告，期待哪位大侠出详细测试了。我很好奇会不会被改造成google出品的超强采集器。Orz
google, GSA, Gsave, 下载, 谷歌搜索服务器虚拟版, 采集
去年参加了Wordcamp Beijing 2007，收获不小。详见WordCamp 2007会议札记&不完全评奖。今年的Wordcamp将在北京、上海两个城市召开，同时名称也调整为Wordcamp China。
Wordcamp China 2008的具体日程及安排，请浏览官方网站china.wordcamp.org。北京部分将在9月20号于清华召开，目前确定的演讲嘉宾包括Matt在内的三位来自Automattic的人士，国内blogger有Flypig，Webleon和郭启睿aw。
9月8日开放注册后，我很快就在线报了名。虽然感觉上组织不如去年有条理，而且目前为止才报名了105人，令我十分诧异。由于这一年间，wordpress在国内发展的如火如荼，包括这次wordcamp连Automattic都由Matt领头参加，可见中文用户对于wordpress的重要性。可奇怪的是国内用户似乎并不怎么关注这次wordcamp，应该不是麦田的博客过时论应验了吧？哈哈，希望这只是我的错觉。同时，去年参会的几个赞助商可能现在日子不太好过，比如抓虾、饭否、feedsky等，希望鲜果们能够接过中文博客行业的旗帜，发扬光大！
目前已知参会的blogger中，有些“认识”的，希望到时能多聊聊：
AW，酋长，伍嘉贤，远骋，王凯。。。(随时更新)
2008, wcc2008, wordcamp, wordpress
本文只适合于WIN平台架设wordpress的朋友。
升级到2.6之后，我的wordpress貌似出了点问题，症状就是分类下经常显示找不到文章，仔细观察后发现是文章的分类和标签信息丢失导致的。google+baidu了半天，终于找到答案：。。。。。。。竟然是C盘TEMP文件夹已满！！！
弄不懂原因，释放空间后一切正常了，如果还没解决的朋友请看http://www.mudanonline.cn/?p=142 ，貌似这篇博客也打不开，可以通过google快照浏览。
2.6, tag丢失, wordpress, 分类丢失, 分类无文章
