漂亮的视差效果,值得你用性能来换取吗？.pdf

漂亮的视差效果，值得你用性能来换取吗？ 关于视差效果性能表现的小话题；弱问，各位见过的使用视差技术的 Web 页面里，有多少能让你觉 得清晰顺畅的感受不到任何负面体验？我印象里真的没几个，包括 Medium 里的；不知为什么，这 些页面总让我觉得没有安全感。本文篇幅虽短，但主旨很清晰 —— 针对产品主要用户群体的特征来 选择最合适的设计方案，别瞎跟风。 这里进入译文。我 (英文原文作者 )最近在 T hemeForest( 模板站 )逛了逛，发现几乎所有的付费模板都 用到了视差技术。其中一款比较新的 WordPress 主题， Magnetto ，在我的 Retina Macbook Pro 上 看起来真的是华丽到家了。 只是，这款主题的演示页面在我家的高速网络连接上花了 8.5秒才加载完毕。值得吗？ 用 Pingdom 测试这个页面，报告显示一共有 31 个JavaScript 文件被加载，从幻灯片到谷歌地图的 脚本，应有尽有。 如果所有人都有高速宽带连接，这倒不会有多大问题，但是如果你的用户通过 3G 访问站点，那他们 可要看上很长时间的菊花转了。 我们在做自己公司站点的时候，针对是否要使用视差效果的问题争论了很久。一开始，我们的设计 师打造了一个基于 jQuery 和视差滚屏效果的炫酷方案，然后一位很棒的前端开发把页面实现了出来 。当时，一办公室的人都在交头接耳： 太华丽了！“ ” 接着，另外一位开发拿出他那拥有 Verizon 4G 网络连接的 iPhone5 ，说： 我们在手机上看看吧！“ ”， 然后打开 Safari ，小心翼翼的输入 URL ，按下 Go 。所有人都安静的围在周围。 1…2…3…4…5…6… 整整 6秒之后，页面才开始呈现出一些零零散散的元素，先是一些文字，然后是背景图片； 15秒 之后，所有东西才加载完毕。 于是我们决定重新思考整个设计方案。 我们不能指望客户等上 15秒才能看到我们公司是否合他们口味。此外，那个 华丽“ ”的页面当中的很 多效果在 IE8及之前版本的 IE 中也无法正常显示。 通过视差效果尽情挥洒创意，这大概是很诱人的事，搞不好还能赢个 “本月最佳站点 ”一类的。不过 我们知道，每天都会用到我们网站的人并不是我们自己，他们并不是设计师或开发。现实是，那些 用着 IE7 、老智能机和低速网络连接的人，才是我们的潜在客户。 所以我们最终决定使用老方法：简单、快速、性感。 最终上线的版本用了最少量的 jQuery ，没有华丽炫酷的效果，但全部加载只需 1.6秒，兼容几乎所有 版本的 IE，兼容所有跑着 3G 的破烂安卓手机。 自然，这个网站没法获得任何设计奖项，但我们能保证，这个世界上任何有可能雇我们的人都能很 好的访问到它。 相关书籍推荐： 移动 Web 实现指南 :面向移动设备的网站优化、开发和设计 全书介绍了移动化规划、移动化设计和相应的编码技巧，特别适用于那些最初是为桌面电脑 展示而设计的网站。书中的建议和实例，也是根据在优化这些网站的过程中所遇到的不同挑 战来组织的 … 译文代表原作者观点。本站原创编译文章，来自 Be For Web 人人都是产品经理（ ）中国最大最活跃的产品经理学习、交流、分享平台