| 1. 尽可能的减少 HTTP 的请求数 |
[content] |
| 2. 使用 CDN(Content Delivery Network) |
[server] |
| 3. 添加 Expires 头(或者 Cache-control ) |
[server] |
| 4. Gzip 组件 |
[server] |
| 5. 将 CSS 样式放在页面的上方 |
[css] |
| 6. 将脚本移动到底部(包括内联的) |
[javascript] |
| 7. 避免使用 CSS 中的 Expressions |
[css] |
| 8. 将 JavaScript 和 CSS 独立成外部文件 |
[javascript] [css] |
| 9. 减少 DNS 查询 |
[content] |
| 10. 压缩 JavaScript 和 CSS (包括内联的) |
[javascript] [css] |
| 11. 避免重定向 |
[server] |
| 12. 移除重复的脚本 |
[javascript] |
| 13. 配置实体标签(ETags) |
[css] |
| 14. 使 AJAX 缓存 |
[content] |
详细请看:Best Practices for Speeding Up Your Web Site
如果具体想看下你网站在这14条规则下的表现,可以用 Yahoo 开发的 YSlow 工具(Firefox 下 FireBug 的插件)。
-----------------
最近 Yahoo! Exceptional Performance 在 《优化网站性能的 14 条规则》的基础上又增加了 20 条新的规则。
| 1. 尽早清除缓冲区 |
[server] |
| 2. AJAX 请求使用“GET”方法 |
[server] |
| 3. 延迟加载组件 |
[content] |
| 4. 预加载组件 |
[content] |
| 5. 减少 DOM 元素的数量 |
[content] |
| 6. 跨域分离组件 |
[content] |
| 7. 减少 iframes 的数量 |
[content] |
| 8. 不出现 404 |
[content] |
| 9. 减小 cookie 的体积 |
[cookie] |
| 10. 为组件使用 cookie-free 的域名 |
[cookie] |
| 11.减少访问 DOM 的次数 |
[javascript] |
| 12. 开发巧妙的事件处理程序 |
[javascript] |
| 13. 优先选择使用 <link> 而非 @import |
[css] |
| 14. 避免使用 filters |
[css] |
| 15. 优化图片 |
[images] |
| 16. 优化 CSS sprites |
[images] |
| 17. 不要在 HTML 中缩放图片 |
[images] |
| 18. 减小 favicon.ico 的体积并缓存 |
[images] |
| 19. 保持组件在 25K 以下 |
[mobile] |
| 20. 将组件分拆到多个文档中 |
[mobile] |
更详细具体的介绍内容可看 Stoyan Stefanov 的 PPT:《High Performance Web Pages》
从头衔上,您可能认为我主要关心的是microsoft.comWeb站点几千个网页的版面设计。的确,这些确实是我所关注的。视觉上的吸引力是重要的,但是这仅仅是工作的一小部分。而最终的目的是确保整个站点运转正常。
我的意思是,人们通常在访问microsoft.com时,并未将它当作艺术作品来赞赏。而是为了获得有关产品的信息,或者有一些技术问题需要咨询,或是阅读有关开发商的期刊。所以网站的设计应该尽量清楚和有条理,以便他们能够容易地找到所需信息。
在进行Web设计时–在设计过程中–形式应该服从功能。这种方法应用于我们站点的整个设计过程中。当然,我们有最新的Web工具,并且能够将各种可视的小配件上载到网页上。但是我们认为这样做将不利于为访问者提供有效的服务。事实上,我经常发现一些站点未将重点放在功能上。常见的错误包括:
阅读全文
来自:UCDChina.com
有时会被问到“看看XXX网站如何?”之类的问题。
谈到评估,通常都是指产品级的网站,如果模式很新,了解需要花一定时间。于是,很多人又问“那么你仅从UI/UE的角度看看呢?”首先我们得达成共识,一切花里胡哨都在为功能服务,如果功能满足都成问题,其他就没必要谈了。
阅读全文
“输入框( Input )应当符合逻辑地划分为小组,这样大脑就可以很好的处理大堆区域间的关系。”– 《HTML权威指南》
Web 应用程序总是利用表单来处理数据录入和配置,但并不是所有的表单都保持一致。输入区域的对齐方式,各自的标签(label),操作方式,以及周围的视觉元素都会或多或少影响用户的行为。
表单布局
考虑到用户完成表单填写的时间应当尽可能的短,并且收集的数据都是用户所熟悉的(比如姓名、地址、付费信息等),垂直对齐的标签和输入框可以说是最佳的。每对标签和输入框垂直对齐给人一种两者接近的感觉,并且一致的左对齐减少了眼睛移动和处理时间。用户只需要往一个方向移动:下。

在这种布局中,推荐使用加粗的标签,这可以增加它们视觉比重,提高其显著性。如果不加粗的话,从用户的角度讲,标签和输入框的文字几乎就一样了。
阅读全文

写这个的目地,主要是系统理下目前产品设计的流程,提醒自己尽量去避免一些常见的问题,也能让大家系统的了解天极网的产品设计流程。当然,不保证任何产品都能套用这套方式,主要还是跟据自己工作性质来定。也许这段文字会比较枯燥,希望阅读下去能给大家带来一些启发。
阅读全文
所谓产品其实最终展现在用户面前的只是界面而已,所谓界面绝大多数时候只包括两个部分:图片、文字。
重视界面上的每一个像素和每一个文字是UED的基本素质,关于如何设计好界面上的文字(一般在UED里面我们把这个职位叫做“内容优化”)我以前写过 创业团队的界面文字优化 和 用户在每个情景中的角色感 ,这一期的话题中其他伙伴也说到了很多。
这个话题讨论到这里,已经让很多人意识到了界面上文字的重要性:界面的文字就好像一个人的谈吐,文字给用户的感觉不单单只是一个“信息”的传达,他还关乎用户对于产品的情感印象和“产品气质”的理解。
那么,我应该说点什么呢?在今天写这个话题之前我就一直在思考:能否系统化的把“内容优化”像“体验”一样分层次的理解?
阅读全文
设计师在抱怨开发人员不尊重Web标准,后台开发人员在抱怨为什么不可以增加一个空格。PM在抱怨为什么项目总是因为那些看似简单的问题而延期……如何才能提高后台开发人员与设计师以及前端开发工程师的合作效率?相信很多网站或软件开发公司都越到类似的问题。
从UED的角度而言,我们的天职是追求用户体验。我们应该尽力坚持自己应该坚持的东西。白鸦曾经说过,用户体验不只是UED的事情,而是整个开发团队乃至整个公司需要参与的事情。
我们不能只是抱怨,我们去理解开发人员。同样,我们做出努力,让开发人员去理解我们。
阅读全文
信息重复、信息过载、信息强迫、个性化定制、搜索引擎依赖,这五者是相互紧密联系的。在信息不断膨胀的互联网,尤其是在标榜着多人贡献的Web2.0时代,信息重复与信息过载尤为明显。信息过载的原因很多,其中一个原因便是信息重复,信息过载会导致焦虑、烦躁等等。本文试图探讨信息过载的原因和解决方法。
信息过载犹如通货膨胀,虽然钱(信息数)是多了,但能购买的商品(有用的信息)少了。
一、信息过载的外部原因
使用RSS阅读器的人可能会深受信息过载的困扰,信息过载的原因可以有以下几个:
阅读全文