序
动画是一个不断变化的画面，也就是我们常说的:“动画让我们的网站活起来”。网页本身就是一个二维空的静态表达，动画可以让静态的元素动起来，产生动态的表达。
在网页中，动画越多越好，越酷越好。不同类型的网站对动画的要求不同。常见的动画主要用于向用户解释界面、元素、元素之间的关系，强调特定的元素。
网络动画开发
1.GIF动画
这种格式的动画也变成了帧动画画面，是在互联网发展之初的1987年创作的。其优点是图像格式兼容性强，体积小，制造方便；缺点也很明显:动画效果单一，只有256色，无法实现交互效果。
这种动画画面一般用在图片广告、动态表情等地方。
2.FLASH动画
这种动画丰富了上面提到的gif动画。虽然也是二维动画，但是可以支持交互操作等动画，甚至可以加入多媒体元素。Flash的优点是画面美观，支持流媒体播放，支持交互操作，文件小。以前大部分网页都是用flash开发设计的，但是随着移动互联网的兴起，很多浏览器将不再支持flash。Adobe官方也停止了对flash的维护，这预示着flash动画将在移动互联网时代被彻底取代。当然，较低版本的浏览器仍然可以播放flash，或者使用专用的flash浏览器。
3.Javascript动画
这是互联网技术的重要体现。Javascript动画是基于脚本代码实现的交互式动画。它具有浏览器兼容性强、无插件、代码执行速度快、支持移动设备等诸多优点。不过这类动画需要设计师有一定的编码能力。
4.HTML5和CSS动画
和上面的Javascript动画有点不同。虽然两者都是基于代码实现的交互动画，但是在使用的过程中两者有很大的区别。前者可以通过DOM事件对象开始生成原生动画，也可以通过现有的js动画库生成特效动画，可以和其他一些独立的动画库配合使用。Css动画完全依赖于自身的属性和浏览器兼容性，css可以在没有外部文件引用的情况下开始创建动画。
有趣的是，css动画类似于flash的原理，动画轨迹是通过关键帧来实现的。详细操作见CSS3动画。
Javascript动画的一部分可以通过css动画来实现，css动画也可以通过Javascript来实现。两者都可以根据情况选择，这都取决于事件对象的类型。
网页的应用类型
首先需要明确的是，我们不能随意给任何网页元素应用动画效果。用什么样的动画效果，怎么用，交互效果怎么样，这些都需要慎重考虑。
网页中动画效果的实现细节和交互效果是设计师必须考虑的。如果设计出来的交互动画消耗了太多的资源，拖慢了用户的移动设备，更糟糕的是，普通的PC访问也会很慢，那么交互动画就会极大的影响网站的用户体验。
网页中的几种经典动画形式
1.页面加载Javascript动画的onload事件。
你可以想象一下计算机运行时鼠标的状态。正常情况下是指针，忙的时候后面是沙漏或者圆圈，没反应的时候是沙漏或者圆圈等等。这些都是操作过程中等待反馈的动画。
当网页加载时间较长时，可以适当添加页面加载等待效果、进度条或充满歉意幽默的动画等。
页面加载动画主要是在页面还没有加载的时候给浏览者提供反馈。无论用什么样的动画来告诉用户正在发生什么，即使是一个简单的进度条也能大大减轻用户的精神负担。
2.元素的交互式动画
动画效果的出现需要用户在网页中做出相应的触发事件。这类事件包括Javascript的DOM操作事件和css的伪类事件。
经典事件包括:鼠标悬停反馈、鼠标离开反馈、按钮点击反馈、点击元素A执行元素B反馈等。
3.故事页面动画
区分以上动画，这个故事化的动画页面主要是营造剧情氛围，通过与用户的互动达到传递信息的目的。这可以理解为引导动画，引导用户一步一步地执行。
故事页面动画本身的质量非常重要，直接影响用户与页面的交互。
4.装饰动画
这种动画是一种点缀，除了提高页面的动态视觉效果之外没有任何目的。这种动画类似于元素的交互动画，是隐式被动动画。如果用户不执行触发事件，动画将不会播放。
需要注意的是，不要过多使用和滥用装饰性动画，会分散用户的注意力。网站的目的是传播网站内容，而不是这些动画效果。
5.广告动画
这里指的是横幅图和轮播图，这里就不赘述了。可以看看电商的轮播图。
网页的用户体验原则要注意什么？
1、开启速度更快，运行流畅。
2.节奏适中
3.从页面中的细节开始。
4、不能干扰主画面和主题内容。
摘要
使用动画动画效果的主要目的是提高网页的可用性。简单的动画效果也能有效地引导用户，帮助他们理解事件触发后的反馈，这需要设计师在设计时仔细考虑。其次，动态效果的第二个原因是审美需求。动画可以使静态的页面具有运动的活力，赋予画面以生命力，从而建立人机交互环境，让用户接受网站要传递的内容。
