文档介绍：前端工程师新手必读作者: 黄锦诚发布时间: 2012-08-09 11:31 阅读: 1620 次原文链接全屏阅读[ 收藏] 公司招了几个刚毕业的学生,作为重构的新手让我来带。首先感谢感谢党、感谢国家、感谢公司给了我这样的一个机会, 对我工作的肯定和认可, 让我带这样的一个重构团队, 同时我也明白任务的艰巨, 但我一定会将工作做好, 不负公司对我的期望。(哈哈,好像从小到大,老师都是教育我们要这样先说的。) 在网站的发展史上,初期的网站建设根本不需要网页重构这个职位, Web 时代的网页,只需要程序员, 一堆堆的表格嵌套就完成, 或者美工进行配合完成, 先由美工负责设计好, 再用一些自动化的软件拉伸几下, 直接将设计好的图就可以通过软件输出表格的布局了, 根本不需要重构这个多余的职位。随着 Web 的到来和 W3C 的规范得到世人的认可,内容和样式的分离更方便进行开发和维护, 传统的表格布局和内容混排的方式逐渐地被淘汰, 美工已不能完全一手包办越来越复杂的效果和高要求的页面布局了。此因催生了一个新的职位——前端工程师。鄙人刚好作为一名 Web 成长起来的前端工程师,虽然说做的项目不多,但乐于与人分享。虽然分享的也许只是一些很表面甚至有些过时的东西, 但也只希望为大家提个醒, 最好能起到抛砖引玉的作用。一、前端工程师的职能和作用。什么是前端工程师?有人这样来表述: 我们是工程师中的设计师, 是设计师中的工程师。上班不干别的, 就是玩, 弄点效果, 攒两页面, 搞点创新。我们就是前端攻城狮( 工程师)。当然这个表述有点轻巧、调侃的味道, 工作绝对不是玩那么简单的, 有时候会为一些效果的实现或优化, 弄得加班加点一起开发, 但其实有两一句表述是非常中肯的, 那就是: 我们是工程师中的设计师, 是设计师中的工程师。这句话将前端工程师的角色的定位说得很准确。前端工程师, 在网站开发的初期, 以工程师的身份来指导网页的设计, 前端工程师明白程序输出的方法, 指导设计师在设计的过程中避免一些不能输出的数据排版, 指出哪一些阴影、透明、圆角不能大范围的使用等等; 在进行页面重构的过程中, 又将以一个设计师的身份将设计页面转化为静态页面, 需要用代码对设计页面进行最初的还原, 实现好相应的前台效果, 排列好相应让后台开发的工程师输出数据的地方, 以适应后台数据的输出并保持页面的不变形、不走位, 在有数据输出正常的情况下, 配合程序去修改样式, 以尽量达到和设计的效果基本一致。所以在这个页面设计和到程序的实现过程中,需要前端工程师起到一个桥梁的作用。前端开发是一项很特殊的工作, 前端工程师的工作说得轻松, 看似轻巧, 但做起来绝对不是那么的简单。在开发过程中涵盖的东西非常宽广, 既要从技术的角度来思考界面的实现, 规避技术的死角, 又要从用户的角度来思考, 怎样才能更好地接受技术呈现的枯燥的数据, 更好的呈现信息。简单地说, 它的主要职能就将网站的数据和用户的接受更好地结合在一起,为用户呈现一个友好的数据界面。二、前端工程师的发展前景如何前端工程师是是一个很新的职业, 在国内乃至国际上真正开始受到重视的时间不超过 5年。互联网的发展速度迅猛,网页由 Web 到 Web ,再到新生的 HTML5 、 CSS3 ,到现在手机、 3G 网络等新科技的兴起,网页也由最原先的图文为主,到现在各种各样的基于前端技术实现的应用、交互和富媒体的呈现,更多的信息、更丰富的内容、更友好的体验,已经成为网站前端开发的要求,网站的前端开发发生了翻天可覆地的变化。网站的开发对前端的需要越来越重要, 高质量的前端开发工程师将会是后五年内一个非常热门的职业,发展的前景非常可观。三、前端工程师需要掌握的技能作为一个前端工程师,需要掌握的技能还真的不少。最基本的三个技能: HTML 、 CSS 、 JavaScript 。这是前端开发中最基本也是最必须的三个技能。前端的开发中,在页面的布局时, HTML 将元素进行定义, CSS 对展示的元素进行定位, 再通过 JavaScript 实现相应的效果和交互。虽然表面看起来这些很简单,但这里面需要掌握的东西绝对不会少。在进行开发前,需要对这些概念弄清楚、弄明白,这样在开发的过程中才会得心应手。 HTML : 指的是超文本标记语言(H yper T ext M arkup L anguage) ,这个也是我们网页最常用普通的语言了,经历了多个版本的发展,现在已经发展到 版了,得力于 W3C 建立的标准和规范,现在已普遍升级到了 XHTML , XHTML 指可扩展超文本标签语言( EXtensible HyperText Markup Language ), XHTML 于 2000 年