网页可以简单的理解为素材及布局、交互行为和数据的集合体。
-
美工负责素材及界面布局
-
交互制定交互的行为和规则
-
后端设计数据库
-
前端是通过工具(HTML、CSS、JavaScript)把这些都整合起来,设计制作出页面。
Web前端,制作的是用户可以看得见碰得着的东西。或者称为“网页制作”、“网页制作工程师”、“前端制作工程师”、“网站重构工程师”。
另外,根据不同的对象,和自己的心情,是否有闲暇时间,使用不同的方式来回答这个问题:。
对于没必要了解工作内容的人,一律回复:写代码的程序员即可。
-
对于朋友,可以让他稍微了解工作内容的人,可以回复:写网站界面/程序的。
-
对于家里人,只需要知道你工作的地方稳定/你工作开心/生活健康就好,回复诸如:吃得好睡的好,工资高待遇好……
-
对于妹纸,可以做一个resume或者blog出来,然后和她们讲:“我的工作内容和做这个网站差不多”
-
对于校友或者学弟学妹一类,想了解专业方向和工作内容的人,可以比较详细的回答他们,下面是完整的技能树:
前端工程师
-
浏览器
-
IE6/7/8/9/10/11 (Trident)
-
Firefox (Gecko)
-
Chrome/Chromium (Blink)
-
Safari (WebKit)
-
Opera (Blink)
-
编程语言
-
JavaScript/Node.js
-
CoffeeScript
-
TypeScript
-
切页面
-
HTML/HTML5
-
CSS/CSS3
-
Sass/LESS/Stylus
-
PhotoShop/Paint.net/Fireworks/GIMP/Sketch
-
开发工具
-
编辑器和IDE
-
VIM/Sublime Text2
-
Notepad++/EditPlus
-
WebStorm
-
Emacs EmacsWiki
-
Brackets
-
Atom
-
Lime Text
-
Light Table
-
Codebox
-
TextMate
-
Neovim
-
Komodo IDE / Edit
-
Eclipse
-
Visual Studio/Visual Studio Code
-
NetBeans
-
Cloud9 IDE
-
HBuilder
-
Nuclide
-
调试工具
-
Firebug/Firecookie
-
YSlow
-
IEDeveloperToolbar/IETester
-
Fiddler
-
Chrome Dev Tools
-
Dragonfly
-
DebugBar
-
Venkman
-
版本管理
-
Git/SVN/Mercurial
-
Github/GitLab/Bitbucket/Gitorious/GNU Savannah/Launchpad/SourceForge/TeamForge
-
代码质量
-
Coding style
-
JSLint/JSHint/jscs
-
CSSLint
-
Markup Validation Service
-
HTML Validators
-
单元测试
-
QUnit/Jasmine
-
Mocha/Should/Chai/Expect
-
Unit JS
-
自动化测试
-
WebDriver/Protractor/Karma Runner/Sahi
-
phantomjs
-
SourceLabs/BrowserStack
-
前端库/框架
-
jQuery/Underscore/Mootools/Prototype.js
-
YUI3/Dojo/ExtJS/KISSY
-
Backbone/KnockoutJS/Emberjs
-
AngularJS
-
Batarang
-
Bootstrap
-
Semantic UI
-
Juice UI
-
Web Atoms
-
Polymer
-
Dhtmlx
-
qooxdoo
-
React
-
Brick
-
前端标准/规范
-
HTTP/1.1: RFCs 7230-7235
-
HTTP/2
-
ECMAScript3/5
-
W3C: DOM/BOM/XHTML/XML/JSON/JSONP/...
-
CommonJS Modules/AMD
-
HTML5/CSS3
-
Semantic Web
-
MicroData
-
RDFa
-
Web Accessibility
-
WCAG
-
Role Attribute
-
WAI-ARIA
-
性能
-
JSPerf
-
YSlow 35 rules
-
PageSpeed
-
HTTPWatch
-
DynaTrace's Ajax
-
高性能JavaScript
-
SEO
-
编程知识储备
-
数据结构
-
OOP/AOP
-
原型链/作用域链
-
闭包
-
编程范型
-
设计模式
-
Javascript Tips
-
部署流程
-
压缩合并
-
YUI Compressor
-
Google Clousure Complier
-
UglifyJS
-
CleanCSS
-
文档输出
-
JSDoc
-
Dox/Doxmate/Grunt-Doxmate
-
项目构建工具
-
make/Ant
-
GYP
-
Grunt
-
Gulp
-
Yeoman
-
FIS
-
Mod
-
代码组织
-
类库模块化
-
CommonJS/AMD
-
YUI3模块
-
业务逻辑模块化
-
bower/component
-
文件加载
-
LABjs
-
SeaJS/Require.js
-
模块化预处理器
-
Browserify
-
安全
-
CSRF/XSS
-
CSP
-
Same-origin policy
-
ADsafe/Caja/Sandbox
-
移动Web
-
HTML5/CSS3
-
响应式网页设计
-
Zeptojs/iScroll
-
V5/Sencha Touch
-
PhoneGap
-
jQuery Mobile
-
W3C Mobile Web Initiative
-
W3C mobileOK Checker
-
Open Mobile Alliance
-
前沿技术社区/会议
-
D2/WebRebuild
-
NodeParty/W3CTech/HTML5梦工厂
-
JSConf/沪JS(JSConf.cn)
-
QCon/Velocity/SDCC
-
JSConf/NodeConf
-
CSSConf
-
YDN/YUIConf
-
HybridApp
-
WHATWG
-
MDN
-
codepen
-
w3cplus
-
CNode
-
计算机知识储备
-
编译原理
-
计算机网络
-
操作系统
-
算法原理
-
软件工程/软件测试原理
-
Unicode
-
软技能
-
知识管理/总结分享
-
沟通技巧/团队协作
-
需求管理/PM
-
交互设计/可用性/可访问性知识
-
可视化
-
SVG/Canvas/VML
-
SVG: D3/Raphaël/Snap.svg/DataV
-
Canvas: CreateJS/KineticJS
-
WebGL/Three.JS
后端工程师
-
编程语言
-
C/C++/Java/PHP/Ruby/Python/...
-
网页服务器
-
Nginx
-
Apache
-
Lighttpd
-
数据库
-
SQL
-
MySQL/PostgreSQL/Oracle/DB2
-
MongoDB/CouchDB
-
数据缓存
-
Redis
-
Memcached
-
文件缓存/代理
-
Varnish
-
Squid
-
操作系统
-
Unix/Linux/OS X/Windows
-
数据结构
陈童的博客(http://www.everyinch.net/)专注于用户体验研究的IT类网站。发表用户体验研究与度量方面的知识,分享前端与三维网站技术,总结人机交互、集体智慧算法的研究心得,推荐国外相关资源。