如何才能做得更好呢？
第一，必须掌握基本的Web前端开发技术，其中包括：CSS、HTML、DOM、BOM、Ajax、JavaScript等，在掌握这些技术的同时，还要清楚地了解它们在不同浏览器上的兼容情况、渲染原理和存在的Bug。
第二，在一名合格的前端工程师的知识结构中，网站性能优化、SEO和服务器端的基础知识也是必须掌握的。
第三，必须学会运用各种工具进行辅助开发。
第四，除了要掌握技术层面的知识，还要掌握理论层面的知识，包括代码的可维护性、组件的易用性、分层语义模板和浏览器分级支持，等等。
可见，看似简单的网页制作，如果要做得更好、更专业，真的是不简单。这就是前端开发的特点，也是让很多人困惑的原因。如此繁杂的知识体系让新手学习起来无从下手，对于老手来说，也时常不知道下一步该学什么。
代码质量是前端开发中应该重点考虑的问题之一。例如，实现一个网站界面可能会有无数种方案，但有些方案的维护成本会比较高，有些方案会存在性能问题，而有些方案则更易于维护，而且性能也比较好。这里的关键影响因素就是代码质量。CSS、HTML、JavaScript这三种前端开发语言的特点是不同的，对代码质量的要求也不同，但它们之间又有着千丝万缕的联系。
首先考虑css动画然后考虑js。velocity：很全面的JavaScript动画库
vivus：可以动态描绘 SVG 的 JS 库, 支持多种动画
Web Animation：Javascript 实现的 Web Animation API
scrollReveal.js：使元素以非常酷帅的方式进入画布 (Viewpoint)
snabbt.js：一个利用 Javascript 和 CSS transform 的 animation 库
transit：jquery实现的css动画
matter-js：2D 物理效果引擎，碰撞、弹跳等
parallax：一个用于响应智能手机 orientation 的库
focusable：是页面上一个元素高亮的库，关灯效果
sensor.js：在智能移动设备浏览器上，通过HTML5的api使用移动设备的功能。定位、运动、倾斜等
animatable：仅仅依靠 border-width 和 background-position 实现的各种动态效果
Bounce.js：漂亮的css3动画库
GreenSock：基于svg，很强大的动画效果，High-performance HTML5 animations that work in all major browsers.
dynamics.js：弹性物理效果
