第六章网页动画终极指南.pdfVIP

网页动画终极指南 动画是人类毕生的理想之一 （如果像某些历史学家相信的那 ）。这个理论源起于洞穴壁画 ：在某 些洞穴壁画中 ，经常见到一些生物被画上远多于正常数量的肢体。 这背后有很多套理论。有些指出这很简单 ，因为艺术家们并没有方法可以擦除这些肢体 ，于是将他 们的错误留在壁画上 ，传给了子孙。还有理论相信 ，这些是最早的试图在静止图像中捕捉动态的 方法。我选择相信后者。 还有比捕捉动态更加自然的愿望了吗 ？自然界的一切都在运动。人在行走 ，水在流动 ，植物开枝 散叶 ，自然界唯一不变的就是变化 ，以一种运动的形式。有些在模糊中一闪而过 ，有些则慢到难以 察觉 ，但这些都在发生。 动画对于网页设计师已经不再新奇……它正在成为最基础的交互设计效果。 动画就是变化 ，是一种运动。它是我们艺术创作中最接近真实反映生活的东西。这就是为什么人们 总是说“动画使我们的网站 （或是演讲 ，诸如此类 ）鲜活起来。”这可能是陈词滥调了 ，但这个词很 优美地呈现了动画在网页设计中的目的。 正确使用运动感 ，可以告诉用户他们完成了某些操作。他们成功地与界面进行了交互 ，引发了某些 变化。 人们与真实物体互动时 ，也会触发并体验到相同的感觉 （至少是类似的感觉 ）。就某种程度而言 ， 动画是拟物的。没错 ，我说的就是拟物。 使用得当时 ，动画可以被设计成模仿真实世界的交互。我们似乎在原地打转。可能我们不会再过多 使用复杂的皮革纹理 ，但我们仍然在尝试效仿现实世界。 网页动画简史 在进入实用部分之前 ，我们看看互联网上的动画是如何发展到今天 （这么酷 ）的。最初一切都诞生 于gif 图…… 原来.gif 文件年龄甚至比我还大2岁。它们在1987年被创造 ，正是早年我们刚知道 （或多或少 ）互联 网的时候。因此开创了跳舞婴儿的纪元 ，那些东西太可怕了 ，还是忘了好。 如果gif 图的流行告诉了我们什么 ，那就是人们想要将动画引入网页中。在此提醒一下 ，多数人可能 并没有从改善可用性的方式考虑动画。一切都只是为了产生一点个性 ，表现一点生机 ，与其他静止 的网页区分开。 现在正是关注网页动画与A pp动画的最佳时机。 当.gif 文件的能力耗尽后 ，人们想要一种更好的方式 ，来向网站中添加动画。对 ，声音 ！声音太棒了 。如果人们打开你的网页 ，开始播放你最喜欢的歌曲 ，这得有多棒啊 ？要像真正的歌曲……而不是 那种破烂电脑音乐 ，对吧 ？ 是Flash让我们艰难地学到了这个教训。但是别忘了Flash在它所处的年代是相当惊艳的。实际上它 是一种革新。它是一种进步。它非常酷。 无论后来它被如何滥用 ，要知道Flash让我们在互联网中做一些从没想过的事情。它拓宽了创意的 视野 ，为人们在一个崭新的行业创造了工作机会 ，带来了“网页动画”和90年代最棒的东西 （除了 天堂 ）：Flash游戏。甚至直到现在 ，我都觉得那些游戏使人入迷。 随着时间推移 ，很多设计师转移到基于Javascript 的动画上 ，用于创造一些小东西 ，比如下拉菜单 和其他导航元素。毕竟如果做得恰当的话 ，这更有利于SEO 。其他人只用Javascript是因为 ，那正 是Fro nt Pag 和Dr amW av r调用按钮图片的方式。微小的进步仍然是进步。 00年代中旬 ，W3C已经在努力将动画加入到CSS规范中。2009年 ，首份公开的CSS动画规范初稿 就发布了。 如今呢 ？我们探索出了强制硬件渲染、CSS动画结合SV G文件、延伸基本动画功能的JavaScript库 ，等等。 现在我们正在探寻各种方式 ，不仅仅是为网站增添风格。我们在试图改善可用性 ，告知并教育用户 ，让用户更容易了解他们在做什么。 对于网页设计师 ，动画不再是新奇事物。它成为了影视行业的基础 ，一种全新的叙事方式。对我们 而言 ，它成为了有效交互设计的基础。 现在正是关注网页动画与A pp动画的最佳时机。科技尚没有完全成熟 （什么时候会呢 ），也无法提 供全方位支持 （何时能够呢 ），但我们在探寻新的方式将它呈现在世人面前 ，无需通过插件或是专 用代码。 我们越是以开放的动画标准为基础 ，越多的人就能首先看到。近年来人们专注于运用动画驱动交互 ，这是一件非常非常好的事情。 是时候成为先行者了。 网页动画的种类 回到正题。我们在谈论的是哪种动画 ？我的意思是 ，我说了很多关于使用动画改善用户界面的言论 ，那些究竟是什么意思 ？ 很显然 ，我们不能将动画效果随手加于网页元素之上 ，然后期盼它能提升转化率。那太傻了。就像 设计的所有其他方面 ，使用哪种动画 ，何时使用 ，这都需要仔细考虑。