Redesign

为什么叫重构工程师？因为我们不同于以往的网页制作人员，我们推翻了以往的table布局工作方式，而且采用xhtml+css来构建web界面。目前这个职位有很多种叫法，正式的职位名称有叫网页制作的，叫Web界面工作师的，叫UI设计师的，叫Web构建工程师的……林林总总，不一而同。南方一些城市对此职位俗称页面仔，个人对此称谓很不感冒，它让我联想到浑身臭汗满头油污的某类人，何况这个职业的从业者不一定都是男性，我的领导开玩笑地说与此对应的叫页面妞，汗。。。后来引入一个新名词：Csser，而WEB标准不是某一个标准，而是一系列标准的集合：结构化标准语言主要包括XHTML和XML，表现标准语言主要包括CSS，行为标准主要包括对象模型（如W3C DOM）、ECMAScript等。因此称我们为Csser，过于片面。

很多未曾有过项目经验的重构爱好者或者初入此道的朋友对我们的工作流程很好奇，很迷惑，不知道我们如何与团队一起开发网站。而这个问题应该说是面试这个岗位最常见的一道面试题，如果你对自己所面试的职位工作流程一无所知，很难说你一定能得到这份工作，即使你的代码写得再完美也可能惨遭淘汰。

总结一下我的经验吧，其实也是一个常识。

做一个网站或者一个项目，首先得产品设计者提出需求文档，这里的产品设计者指的是产品经理或者网站策划。就如盖一栋房子，这个房子的雏形在他们脑子里酝酿，是要盖20层还是30层，三居室还是两居室，要不要阳台等等，这些由他们来决定。实施到网站中就如某个页面要不要放登录框，哪些页面必须有左侧菜单。

产品经理出需求文档，提交上级领导批示，通过后交由界面设计师出设计稿，设计师将按产品经理的要求设计效果图，这个时候，房子刷什么颜色的墙壁，屋内放些什么样的装修品都由设计师来掌握。效果图出来后请产品经理、项目经理及上级领导再批示，一般是先设计首页，首页风格确定并通过后再依此风格设计其它页面。为了高效完成网站开发，一般来说首页效果图确定之后网页制作人员也就是重构工作师就可以开始制作页面了。与此同时，设计师在设计首页之外其它的页面。

需要特别注意的是，工程师们制作页面的时候不能只是简单地按效果图来堆砌代码。拿到效果图时必须在大脑里对它进行立体思维，页面上哪些是静态的，哪些将是程序动态生成的，简单的说，就是将页面上的内容模块化。就像往一个盒子里放东西，画一个九宫格，每个格子里是一个模块，任意哪一个格子里的模块都可以一个整体挪往别处，互相调换。这样做的目的是为了便于程序开发，利于动态输入页面内容。在此我还想给各位重构工程师们一个小小的建议：书写页面代码时最好养成写注释的习惯。比如在登录模块的开始和结尾处用注释语句标明，这样会令以后的修改工作方便得多，也使程序员一目了然，不至于在进行程序输出时多输出或者少输出结构标签，甚至还有的套错容器。

当页面中需要加入某些特殊的交互效果时，工程师利用js来实现。比如隐藏或展开左侧菜单栏，页面中的弹出层等等，一般都是重构工程师份内之事。

重构工程师按效果图和产品经理的要求制作完页面，实现完前台交互效果，接下来程序员上场介入开发。这个时候，我们千万别以为自己已经完事了，高枕无忧了。要知道，程序员不是专业的重构工程师，他们中很多人对Web标准并不太熟悉，所以你必须时时监督引导他们按标准的代码输入页面，比如：标签小写，属性必须有属性值，属性值必须加上双引号，等等。琐碎的事情不是？如果你热爱你的工作，热爱Web重构，琐碎也能变乐趣。经常有程序员跑来问我，唉呀，怎么一样的结构，一样的CSS，偏偏我输出的页面与你交给我的demo表现不一样呢？这个时候我第一反映是检查页面DTD。许多程序员有一个习惯，就是有意无意把DTD忽略掉，或者干脆不写，或者与我们demo中的DTD不符。还有的原因是CSS文件调用不当，或者路径不对，或者head部分根本没有link语句。总之，程序员在开发过程中随时会出现各种或大或小的界面表现问题，我们不能以为交了demo就无事可做了，在项目正式上线之前，随时都应该处于备战状态。

程序开发完成后由测试部门进行测试。你得保证你的页面在各款浏览器下表现正常。一般我们在最初书写代码的时候已经有所注意，该写hack的写hack。如果你也是这么做的话，那么这时候你可以悠哉悠哉地端上一杯清香的绿茶去天台透透气、吹吹风了，呼吸一下室外的空气^_^