日志更新

二月 18th, 2009尴尬的WEB前端工程师(转载)

我的生活 - Kelvin14:47

0

我现实中的朋友大多是从事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的一横不够广,还是一竖不够深?

一月 22nd, 2009X-UA-Compatible

Html/Css/Ps - - Kelvin10:37

0
  1. <meta http-equiv="X-UA-Compatible" content="IE=5" />

像是使用了 Windows Internet Explorer 7 的 Quirks 模式,这与 Windows Internet Explorer 5 显示内容的方式很相似。

  1. 2.<meta http-equiv="X-UA-Compatible" content="IE=7" />

无论页面是否包含 指令,都像是使用了 Windows Internet Explorer 7 的标准模式。

  1. 3.<meta http-equiv="X-UA-Compatible" content="IE=8" />
  1. 4.<meta http-equiv="X-UA-Compatible" content="edge" />

Edge 模式通知 Windows Internet Explorer 以最高级别的可用模式显示内容,这实际上破坏了“锁定”模式。

  1. 5.<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />

EmulateIE7 模式通知 Windows Internet Explorer 使用 指令确定如何呈现内容。标准模式指令以Windows Internet Explorer 7 标准模式显示,而 Quirks 模式指令以 IE5 模式显示。与 IE7 模式不同,EmulateIE7 模式遵循 指令。对于多数网站来说,它是首选的兼容性模式。

附:今天又看到一篇译文说X-UA-Compatible不加时默认被锁定为IE7版本执行。有点不太明白,我测试的时候只有在content="IE=8"的时候才符合ie8下的运行环境。

一月 20th, 2009css书写顺序

Html/Css/Ps - Kelvin16:27

0
  1. display || visibility
  2. list-style : list-style-type || list-style-position || list-style-image
  3. position
  4. top || right || bottom || left
  5. z-index
  6. clear
  7. float
  8.  
  9. width
  10. max-width || min-width
  11. height
  12. max-height || min-height
  13. overflow || clip
  14. margin : margin-top || margin-right || margin-bottom || margin-left
  15. padding : padding-top || padding-right || padding-bottom || padding-left
  16. outline : outline-color || outline-style || outline-width
  17. border
  18. background : background-color || background-image || background-repeat || background-attachment || background-position
  19.  
  20. color
  21. font : font-style || font-variant || font-weight || font-size || line-height || font-family
  22. font : caption | icon | menu | message-box | small-caption | status-bar
  23. text-overflow
  24. text-align
  25. text-indent
  26. line-height
  27. white-space
  28. vertical-align
  29. cursor

一月 19th, 2009两个好东西:javaScript排版工具, javaScript语句验证工具

Php/MySql/Js - - - Kelvin12:34

0

1. 这个网站只要把Javascript的代码粘贴进去,就会自动帮你排版对齐。

http://jsbeautifier.org/

2. 验证JS代码

http://jslint.com/

3. Css排版工具

CSS格式化与优化工具

一月 5th, 2009新的一年

我的生活 - Kelvin22:58

0

轰轰烈烈的2008年就这样结束了。

加班加了两个多月,戏剧性的冲散了也许本该出现的奇迹,不想去解释太多,也许这注定还是我的错。

头发长了,胡子密了,皱纹多了,转眼间又长了一岁,期待中还是孤独着。

忽然间去想着,恍惚中找到了号码,努力挣扎着该不该去联系,问自己我不知道答案,问老天,它已经懒得理我了。

游

十二月 17th, 2008两个不太常用的 CSS Hack

Html/Css/PsKelvin9:44

0

1、仅 Safari 和 Opera 识别的 Hack

  1. @media all and (min-width: 0px) {/* Safari and Opera  rules here */}

或者

  1. @media screen and (-webkit-min-device-pixel-ratio:0) {/* Safari and Opera rules here */}

注:这里所指代的 Safari 和 Opera 一般为最新版本。

2、仅 Firefox 3 和 IE7 识别的 Hack

  1. selector, x:-moz-any-link, x:default {/* Firefoxand IE7 rules here */}

注:由于 Firefox 2 和 Firefox 3 共存,且两个版本对 CSS 的解析有部分不一致,或许用得着这个 Hack 。

Page 4 of 6« First...«23456»