最近对Web前端有很多想法，刚好看到这篇文章，跟我想法不谋而合，所以翻译出来与大家分享。许久没翻译了，里面多少还是有些我没能完全理解，意译过来，如果错误，请务必指出和修改，谢谢。
原文The Time is Now for Front-End Architects， 来自：Garrett Dimon，感谢作者的许可。
去年，我在YTS发表了前端架构师的想法，之后花更多时间来思考，现在更坚信这是一个不可或缺的角色。
当后端技术伴随.Net, Rails和Java之类的框架发展得越来越抽象和强大，前端技术的潜在发展也日益复杂。在束缚前端技术潜在好处的差劲实现之前， Web需要更多的前端架构师。
多亏了诸如跨浏览器支持的先进技术的发展，用户体验、更多有意义的主题比如无障碍都拨云见日，这个世界再也不仅仅就HTML和CSS如此简单，因此，绝大部分的团队都需要一个真正理解和实践涉及到前端的一切的人。
角色
这并不是一个扼要和简单的清单，对于下面的主题／技术，前端架构师也不能仅仅满足于了解一下里里外外而已，而是需要足够的深入研究，并有自己出色的见解。
作为一个前端架构师，必须拥有这些领域的绝对执行力。例如，前端架构师能够决定某个特性是使用AJAX还是传统的页面刷新。哪个更便于使用？对无障碍的影响如何？改用Flash有意义吗？
拨乱反正
表现，结构，行为和商业逻辑的混杂，导致不必要的复杂，导致难以维护的怪胎解决方案。就如后端需要正确地划分为数据层，商业逻辑，表现逻辑等，前端开发复杂到是时候调整其架构了。
编写良好结构或者说避免使用表格布局是远远不够的。这是第一步，前端架构的哆咧咪而已。现在是时候关注DOM脚本编程，AJAX, 无障碍等，该升级了。
非编程不可
我主张前端架构师必须懂得真正的编程知识，而这正是很多自封为前端架构师的人所缺乏的。我的意思不是能够剪切粘贴改进代码就行了，而是能够跟老练的工程师商讨如何能够最好地结合前端。
这就是说，前端架构师需要真正理解结构遭遇商业逻辑的问题。如果工程师说某些东西使用ASP.Net DataGrid是不可能实现的，前端架构师必须能够解释如何与为何要使用DataList或Repeater取代，解释为何DataGrid在该情景下是个错误的选择……
这只是个例子，问题还在于仅知道客户端编程也是不够的。能够使用与工程师相同的术语，能够讨论（前后端）关键集成的最佳解决方案，这是绝对必须的。
断线的风筝
我们今天正处在一个不妙的处境中，原因在于几乎没有人能够为前后端的沟壑搭桥。一般工程师不会有兴趣或实践标记，CSS, 或DOM脚本编程，大部分客户端开发者也没有与后端技术协作的经验。几周入门PHP不会成为程序员，几周入门XHTML也不会成为真正的客户端开发者。
罪魁祸首
我首先想到的十足例子是，ASP.Net完全漠视Web标准，同样地，web氛围（我们指表格和占位gif）让Web标准郁闷。企业项目的大多数框架输出的标记，即使使用1999年的标准来衡量，都是糟糕无比的。
如此巨大和“专业”的产品怎么能才够不忽视，按理说是整个项目最简单的方面？只有静态代码。理由是，基于技术的立场衡量产品，结构，CSS和其他客户端技术都是“事后诸葛亮”。表现逻辑，结构和行为混杂，压根无助于无障碍，Web标准，或者前端技术干净的分离。抬起你的头来，就在2006，这些都成受欢迎的惯例了。
总结
如果这个世界上姿态最鲜明的产品和项目都如此低劣的方式来处理事情，其他的还有什么好说？毫无疑问，我们需要前端架构师，而且就在昨天。
归结于归结，我们有一堆相互关联的技术，很少人能够埋头钻研它们之间的关系，这很不幸。正确做事的真正价值在于容易的维护和长期的适应性。虽然在关键时刻，有些方式更容易选择其他的方法和拼凑起另外的东西。对某些人来说，这可能是可接受的做事方式。但是，对我们大部分人来说，这是拙劣的抉择，也非常不专业。
我交给你去想了。我假设你把车交给技工修理，修好了时候，瞧瞧引擎罩内大量的输送管，我不知道你对技工作何感想？
现在对于 inline-block 属性运用的需求也越来越多，可惜依旧只有 Firefox3 beta、IE8 beta、Opera、Safari 支持 inline-block 属性（注：原来只有 Opera、Safari 支持），但 IE6、IE7 可以通过触发 hasLayout 来模拟，Firefox2 有-moz-inline-box 和 -moz-inline-stack 私有属性。
在实际应用中 -moz-inline-box 会存在元素间的对齐等问题，虽然 Firefox 还有一个私有属性-moz-box-align 来帮助解决对齐问题，但依旧难以预料问题多多，而相对来说 -moz-inline-stack 的表现更像 inline-block ，这点可以在 Firefox3 中测试出来。但 -moz-inline-stack 使用时也会有一个 bug ，如果一个 display:-moz-inline-stack; 的元素外层元素是 display:inline; 即会使 Firefox 中其包含的链接不可点，这个需要用 position:relative; 来解决。
最终模拟代码：
我现实中的朋友大多是从事JAVA方向的程序开发，但在网络上我却有非常多的朋友是从事美术设计，网页开发这类的工作，不过，大多数因为不被重视、干杂活、薪水低等原因，觉得选错了行当，又停止了在这个方向上的努力学习。其实看上去这个行业入门很低，从业者又多，有的时候我们担心是个没有发展的行业，是的，我也这样想过。不过这些年，我把自己在这里领域的经验结合到了这个职位中——WEB前端工程师。
先给前端工程师的工作下个一句话定义：运用前端技术，实现体验的良好传达。如果在前面加上 Web，那么是针对 Web 这个领域的，主要是互联网，也可以将移动通信网络和其他传媒网络（比如IPTV）包含在内，因为其理念是一致的。实际上如果叫做“WEB前端”它需要的技能范围还是很广的。
我认为它的职能方向大概是 平面设计师 > 网页设计师 > UI设计师 > 交互设计师(用户体验) > WEB前端工程师
第一个位置我就不多讲了。我想大多数朋友会停留在第二个位置上，因为你已经可以很好的使用图形软件了。而这个阶段最应该深入理解WEB标准，因为你必须保证产品在不同浏览器及分辨率下良好的兼容性和适用性。当然如果你对WEB标准相当熟悉，并能把结构代码和表现代码区分开的时候，你一定会喜欢上JavaScript喜欢上DOM，不要以为这些是程序员该学的东西，JavaScript是客户端的脚本语言，他可以给我们更加强大的页面操作能力(前提是你要写兼容且标准的JS代码)，从用户行为和用户心理入手，设计用户界面；以及良好的用户体验方案。互联网技术在发展，我们每天都必须扩充自己的能力。职业也在逐渐的改变。这是一个必然的过程。
我在智联上写了一个简历，职位是WEB前端设计师(注意我写的是设计师，不是工程师)。也不乏有公司联系我，当然，我并没有想要换工作的想法，相反我工作的很开心，所以当他问是否愿意来面试的时候，我会反问一个问题：“企业如何给Web前端设计师定位？”其实我只想听到他说明 职责是否和我的技能方向相符、还有对各人发展的培养计划。
当然让企业回答这个问题的时候我想先问问你对自己是如何定位。
首先，这是很有前途的工作。百安居的卫哲曾经对大学生择业提出这样的建议：第一选择新行业，第二选择新企业，第三选择新部门。互联网行业相对传统行业，算是新行业；现在创业公司很多；Web 前端工程师又是一个新的岗位。中国的 Web 前端工程师正在起步，会有很好的发展。
然后，想一下自己是否适合和喜欢这份工作。Web 前端工程师并不是设计师，我更倾向于将这个岗位定位为开发人员。这个岗位上每天接触的更多的仍然是代码、代码、代码。如果你喜欢的是设计，那么应该适当调整自己的学习重点。Web 前端工程师应该是那种完美主义者，术业有专攻，自己多想想自己的职业规划。
最后，通过努力找到好的雇主。如果你将自己定位为Web前端工程师，那么去投靠对该岗位有一定认识的公司比较合适（推荐一下阿里巴巴）。在这样的公司里面，会有明确的职位说明和职责范围，以及良好的培养计划。在这样的公司能够有比较好的发展。但是，如果你现在还不具备应有的一些技能，那么也可以从“美工”开始接触起。起码几年之内，这个岗位的空缺还是很大的。在这样的岗位上，卧薪尝胆个一两年，同时注重自身知识水平和思想的提高，对 Web 前端工程师就更近一步了。
关于技能
一般来讲，企业会更倾向于选择复合型人才（aka. T型人才）。基本上，我觉得 Web 前端工程师每个阶段所需技能大致如下：
第一阶段
平面设计师：良好的美术基础、对色彩有一定深入的理解、富有创意思维、精通PhotoShop、Fireworks 等软件。
网页设计师：(X)HTML、CSS、AS3、精通Flash、DreamWeaver等。
第二阶段
UI设计师：RIA技术，对”3D概念体系”有所认知。这里”3D”即：Design（设计）、Development（开发）、Deploy（产品部署）等。
交互工程师 ：JavaScript、DOM、Ajax、XML、RIA、了解Ajax的各种框架 等。
第三阶段
WEB前端工程师：我认为他是"T"字的那一竖，如果你前面横写的越长，它就应该越深。这是一个整合的阶段，也要根据公司的实际情况调整技能，这个时候最需要对整个行业有深入的认识，关注业界最新动态。
我的简历写的是WEB前端设计师，因为我还有很多东西不够了解，比如RIA。所以我退了一步写的设计师，看看自己的知识结构，是T的一横不够广，还是一竖不够深？
像是使用了 Windows Internet Explorer 7 的 Quirks 模式，这与 Windows Internet Explorer 5 显示内容的方式很相似。
无论页面是否包含 指令，都像是使用了 Windows Internet Explorer 7 的标准模式。
Edge 模式通知 Windows Internet Explorer 以最高级别的可用模式显示内容，这实际上破坏了“锁定”模式。
EmulateIE7 模式通知 Windows Internet Explorer 使用 指令确定如何呈现内容。标准模式指令以Windows Internet Explorer 7 标准模式显示，而 Quirks 模式指令以 IE5 模式显示。与 IE7 模式不同，EmulateIE7 模式遵循 指令。对于多数网站来说，它是首选的兼容性模式。
附：今天又看到一篇译文说X-UA-Compatible不加时默认被锁定为IE7版本执行。有点不太明白，我测试的时候只有在content="IE=8"的时候才符合ie8下的运行环境。