目前web产品交互越来越复杂，用户使用体验和网站前端性能优化这些都得靠web前端工程师去做，web前端工程师是设计加开发的综合体，web前端工程师是在开发人员中最直接面向产品，面向用户的设计人员，一个开发团队的成果是要靠web前端工程师去展现，因为用户不会去关心后台的处理有多么强大 ；在设计人员中web前端工程师是直接面向开发人员的设计人员，向开发人员以一种计算机语言的方式传递其设计理念，web前端工程师在整个团队中是很关键的。
所以一名合格的web前端工程师必须得掌握HTML、CSS和JavaScript。只懂其中一个或两个还不行，你必须对这三门语言都很熟悉。也不是说必须对这三门语言都非常精通，但你至少要能够运用它们完成大多数任务，而无需地频繁地寻求别人的帮助。
下面介绍下需要的一些基础知识
开发环境
编辑器：Phpstorm 或者sublime
浏览器：chrome（F12开启审查模式，可以看到任何一个网页的元素）或者火狐（需要安装插件firebug），当然右键还可以查看任何一个网站的源代码。
推荐阅读
HTML、CSS、JavaScript、PHP、 MySQL 的学习顺序是什么？
推荐模板网站
食用方式：先过一遍下面教程里的全部内容，然后找个好看的模板，学习index.html里的语句具体是怎么用的。一般模板都会涉及到jqeury和bootstrap，有些地方看不懂的话也没关系。
注意：提高基本功还是要靠做下面的作业，套模板只是一种实践和快速生产的方式。
作业
简易：做出登陆界面
登陆样例
较难：做出类似百度搜索界面的纯前端页面
搜索界面样例
Html
划掉的可以先不用看 其他都扫过一遍 之后就可以一边查一边写
W3Cschool Html
推荐收藏
html 速查词典 http://www.w3cschool.cn/html/dict
Css
css都稍微看下
不需要看太仔细
推荐收藏
css 速查词典|css API中文手册|css参考文档 http://www.w3cschool.cn/css/dict
CSS动画实例参考手册 http://www.w3cschool.cn/moresource/cssreference/index.html
Bootstrap
http://www.w3cschool.cn/bootstrap/
bootstrap看完css后可以看了，试试看各个控件怎么用
推荐收藏
常用的Bootstrap资源网站 http://123.w3cschool.cn/bootstrap_resources
JS
http://www.w3cschool.cn/javascript/
js也是都要看的 这个语言很强大
推荐收藏
Javascript开发资源 http://123.w3cschool.cn/javascript_resource
jquery
http://www.w3cschool.cn/jquery/
内容不多 但是这是前端的核心
推荐收藏
免费Jquery插件合集 http://123.w3cschool.cn/freejquery
前端学习资源汇总
http://123.w3cschool.cn/plk2fi
前端教程&开发模块化/规范化/工程化/优化&工具/调试&值得关注的博客/Git&面试-资源汇总，方便大家学习查阅参考。