窒息人让我成为更好的设计师

柔道与设计师

这些日子我5点钟出门去窒息人。不是粗鲁的那种。我也让他们窒息我。我是巴西柔道【注1】的一名学生,柔道是一门武术,主张一个弱小的人通过技能和技巧,打败一个高大强壮的人。是的,有时候就是窒息。我热爱这门艺术,我热爱科学。我对此理解较多,并对此着迷。我经常在9点到下午5点看到类似情况发生,这是我的快乐时光版本。我在亚马逊做设计师的工作就是挑战。我做的有趣的方面是对等挑战。努力工作,努力去玩。在打斗中有很多与我的生活、工作相关的经验。但是,有三条对我来说尤其突出。

经验一:冷静。

当我刚开始训练时,我从身体上训练自己到达某个点,让我可以在数分钟内爆发出来。就像推倒一面砖墙,我所有的努力都是没有结果的。如果你不能控制你自己,那么你就学不会控制其他人。早期,我的教练多次告诉我要冷静。实际上他们告诉我的是,多想想身边的问题。当它们出现的时候,要花时间分析机会。因此很快地,在正确的方向,我开始理解怎么冷静下来,并把压力只放在向前运动上。攻击弱点,用最小的努力防御。

做为一名用户体验设计师,我有时候会被拽到谈话中,有人已经指出了问题,然后告诉我如何用他们的方法来解决。当我遇到这种情况时,我就有一个冲动反应。在决定如何解决问题之前,我会后退一步,考虑所有角度,因为我知道,当你焦躁,允许某人给你压力的时候,你就会犯错误。

在你累的时候,一个225磅的运动员正倒在你身上,试图拗断你的关节,很容易你就失去智慧,并屈服于压力。但是,我发现如果你能够坚定你的心态,你就能更好地武装好,来自我防御。首先你要聚焦在生存上,再慢慢地用技巧回到中立位置。然后,你可以攻击了。

经验二:寻找效率

我们经常听到这个提示。貌似足够容易领会,不过经常从我们指尖溜走。在打斗时,效率就是在合适的时间使用合适的力量。其它都变成了浪费精力,这是你在打斗中最宝贵的东东。更糟糕的是,没有效率的运动将把你暴露给对手。

在设计一个体验时,我们的原则目标就是创造一个有效的体验。我们让用户完成的任何在线任务应该包含他们能够从认知上管理的最少数量的操作。有时候,关于需要给某个设计增加更多的东东,会有相应的讨论。但是据我经验看,我常常发现人们更多地想放弃。存在一些你不能合并或省略的必要操作。尽量用柔道的技巧砍去一些必要的操作,你会失去一些。太少的步骤和太多的步骤一样没效率。

经验三:在打斗中学习打斗

当我更小的时候,在空手道训练,我想我是通过击打空气来学习打斗的。所有这些理论都是关于如何在现有环境下去打败对手。然而,没有人有规律地测试这些技巧,也没有人认真地提出质疑。

巴西柔道技术只有在你学习把它们应用到全力反抗的某人身上的时候,才能被完全理解。你发现有些东西适用,对其他人不适用。这是基于测试的心态。在失败的时候,你问,“我做错什么了?我错过了一些细节吗?”问题在于你面对的是一个活人,而不是空气,不是每个人都会做出同样的反应。因此你调整技巧,并重新尝试。

创造用户体验没有什么不同。未经尝试和反馈,很容易迷失在理论和观点的世界。甚至最有教育意义的猜测仍然是猜测。但是看看人们如何对情形做出判断,将让你面对正确的方向。幸运的是,我实践了两种训练,通过尝试来验证一个更高的真理。对我而言,这是两者的基础。

...

使用固定元素

过去的几个月里,有个很大的趋势,很多新网站正在添加这个功能。我们将在本文讨论固定元素。这些元素可以是导航、侧边栏(带有社会化媒体)、甚至底部。让我们更加深入地探讨这个话题。

赞同方

当导航仍然可见的时候,如果你想到达另一个页面,你不需要向上滚动页面。我猜测,这是此功能最大的好处。这个好处也被用于固定底部,其包含了诸如联系信息、小地图或简版导航之类的东东。保持重要信息总是可见和便利,节约了你的时间和不必要的动作,使你有更好的浏览体验。好的用户体验是我们作为设计师和开发者都想要的。

反对方

然而,这个功能可以是正确的,同时也可以是错误的。在网站上为某些元素选择固定位置将不可避免地占用一部分空间,这部分空间本可以用于其它途径的。是的,空间大小取决于元素的大小,但是一些空间为了固定元素仍然需要放置一个占位符。在桌面程序这没有害处,但是考虑下较小的情况。如果你想使用固定位置,尽量只瞄准桌面和平板用户。借助媒体查询(media queries)或JavaScript代码片段,是很容易搞定的。这样,你将在任何设备上保持着较高水平的体验。

固定位置被用于的另一种方式是广告。你可能看过特别优惠,或者让你注册newsletter什么的。鉴于此,我把这个选项放在了反对方。然而,我不是完全反对广告,只是我不喜欢广告。是的,你的网站需要托管在某个地方,你不得不支付账单,但是用这种方式从人们那里挣钱,对我而言……有些恶心。你是一个内容提供商。人们访问你的网站是因为它提供了有意思的内容。对于用户而言,把有用的空间浪费在像这种不重要的东西上,降低了体验,这应该是你从来都不能考虑或要做的。

折中方法(当向上滚动页面时的固定)

发布平台Medium和好多其它网站选择了这种有趣的方案。它们是这样做的,仅仅在用户向上滚动一点点的情况下,使用固定元素导航条。然而,导航保持着隐藏状态。这或许是个好方法,解决了占据内容的有用空间的问题。不过,问题在于用户要向上滚动多少?你怎么能够区分,为了看导航而滚动,还是重读一行文本而滚动?对你来说,这听起来或许不重要,但是请考虑一下。你正在阅读一篇文章或博文,想返回一点,重读最后那句话。你向上滚动页面,发生了什么……你想读的那行是出现了,但是隐藏的固定导航也出现了,因此你不得不滚动多一些。有些怪怪的(如果你喜欢这种幽默感的话)。

这个例子告诉我们,这种方式的弱点是什么。让我们更深入一些,假如你正在手机上看网页。现在,根据你的屏幕尺寸和导航尺寸,当你向上滚动时,屏幕的1/4空间都被导航占据了。这不是一行文本。它一次就盖住了多行。在桌面和平板,这可能有些恼人。在移动端,它严重伤害了用户体验,甚至导致网页被关掉。

基于滚动的固定元素可以是种做法,但是总是考虑所有存在的其它因素,问问自己,这个功能是否重要到用这种方式来固定。

总结

每个东东都应该合理地使用。过度使用固定位置,或用在较大的元素上,会占据屏幕空间、影响内容。记住,不是每个用户都是在高分辨率桌面或平板上访问你网站的。做为web设计师或开发者,你的目标是用独一无二的方式提供内容。你不应该只是因为一个不重要的元素而损害到内容。保持内容优先,其它第二的原则。其它可以放一放。

原文地址:http://alexsblog.org/2014/07/30/using-fixed-elements/

...

用PageSpeed优化你的网站

静态资源

我写过一篇文章,是关于jekyll的静态资源整合的,不过这个思路与其它框架是类似的。你甚至在Wordpress里借助名叫W3TC IIRC插件就可以完成。对于主题(theme)用到的图片,使用CSS sprite技术整合到一张图片里。有很多工具可以做到这一点。

这一步是关键,因为请求的数量对页面载入有很大的影响。你在这一步之后会从PageSpeed得到一些建议。

使用内容分发网络(CDN)

CDN把你的内容部署到多个、地理位置分散的服务器上,从访问者的角度让你的页面载入更快。

尽量从受欢迎的CDN载入外包类库。你的访问者已经缓存了Google CDN上的jQuery,这个几率是非常高的。为什么不利用这一点呢?

CDN现在比较便宜。甚至免费选项的CloudFlare也是非常优秀的。用吧。

最小化CSS/JS/HTML

这也不花太多时间。CloudFlare也能做到,如果你想省事的话。

如果可能,就用defer,async

在可能的地方,defer和async所有的脚本。规则很简单。