web前端其实是一个蛮重要的角色，承载了业务的交互与展现，是一个系统跟用户打交道最紧密的角色。
为了详细回答这个问题，我写成了一篇文章 https://www.toutiao.com/i6514409636878090756/
可以去看一下

Web前端学习内容与要求首先，做前端的话，你的眼光要看远。现在技术更新很快，如果你还在用什么幻灯片，灯箱效果，那你真不是做前端的料。只能说你是应付人员，或者说就是只会就应用别人写的效果代码而已。其次，要提升自己的价值。不要学会div+css,就不想学其它的技术了，要时时苛刻想到自己的危险处境，像懂div+css的人太多了，网上教程3天学会div+css，10天精通的资料一天堆。多去学点更多能提现你自身价值的东西，比如除div+css之外，可以学习一些后台语言php，java之类的。最后，分享，就是自己的价值要表现出来。中国没有jquery，没有smarty,这么好用的东西，中国缺的并不是能力，是分享。所有要学分分析，比如论坛，博客等信息量大的地方，不仅可以学到你不知道的，也可以增加自己的知识积累。在这里，有必要提醒一下想要从事Web前端开发的新手，一定要明确自己的目标，摆正自己的位置，真正做到掌握一门技术。

谢谢邀请！

Web前端开发现在越来越重要，一改前些年重后台轻前台的情况，前端的待遇也得到了明显的提升，所以学习前端也是个不错的选择。

前端虽然好上手，但是内容也比较多，合理的规划能节省不少时间，也能有更合理的知识结构。

第一步应该从HTML开始，现在的html5从手机端到pad再到pc端都有广泛的应用，这部分内容结构清晰，实验也比较好做，有个文本编辑器就能进行代码编写，而且html语法结构没有严格的要求，即使写错了也能运行，所以比较适合初学者。这部分内容学习结束后，可以自己搭建一个个人网站，练习的同时也能提高自己的自信心。

第二步应该学习CSS，这部分内容可以规范化和模块化html的代码，通过css可以在不修改html代码的情况下改变它的显示风格，所以css就像是html的样式设计者。这部分内容并不复杂，但是需要做大量的实验。有一些命令需要记忆，但是并不复杂。

第三步应该学习Javascript，这部分内容颇为复杂，涉及到的内容也比较多，当然它的功能也更为复杂，可以写逻辑代码，能够完成大量的控制功能。学习js是整个前端的重点和难点，建议多做实验。

第三步是学习各种前端框架，这部分内容就比较多了，现在流行的框架也比较多，比如Bootstrap，Foundation等，这部分内容建议一边工作一边使用，而且变化较快。

剩下的就是经常到前端社区多跟大家多多交流，把握最新的开发趋势。

希望我的回答能给你帮助。

web前端作为下一代网站开发技术，无论你是一个Web开发人员或者想探索新的平台的游戏开发者，都值得去研究。借助尖端功能，技术和API，web前端允许你创建响应性、创新性、互动性以及令人惊叹的漂亮网站。更进一步，你也可以使用web前端创建原来只能用于桌面平台上的复杂应用程序。

挑选了10个适合初学者的web前端入门教程，带你踏上web前端之旅。

1. HTML5教程4 U

对于初学者，HTML5 Doctor网站是开始学习的很好的地方，你可以编辑代码，查看输出结果。

2. 使用HTML5和CSS3创建一个下拉导航菜单

了解如何使用新的HTML5标签和CSS3创建一个简单又时尚的下拉菜单。

3. 使用HTML5和CSS3光滑的登录表单

使用CSS3和HTML5创建漂亮的登录表单，不需要任何JavaScript代码。

4.使用HTML5，CSS3和jQuery创建下拉式登录框

这是一个简单的教程，可以帮助你使用CSS3，HTML5和几行jQuery代码创建一个漂亮的下拉登录表单。

5. 使用HTML5, CSS3 and jQuery创建可爱的弹出栏

按照这个简单的教程中的步骤来建立一个弹出页面顶部的信息栏，你可以用它来显示从新闻、最新的博客文章等。

6. 如何创建一个很酷和实用的CSS3搜索框

了解如何使用HTML5的占位符属性来创建一个很酷和实用的CSS3搜索框。

7. 使用HTML5创建一个有吸引力的在线演示文稿

本教程将教你如何使用HTML5的标签，nav, menu, section, aside和header制作漂亮的演示文稿。

8. HTML5灰度图像和悬停效果

你可能已经在其他网站上看到过这样的效果。按照本教程中的步骤学习如何使用HTML5和jQuery来动态地把彩色图像转化为灰度模式。

9. HTML5幻灯片 – 使用Canvas and jQuery

了解如何创建一个优雅的幻灯片过渡效果。

10. 学习如何制作好看的HTML5表单

Learn how to style a nice looking HTML5 form using some CSS3 techniques.

了解如何使用一些CSS3技术制作一个好看的HTML5表单。

以上就是为大家分享的适合web前端技术的入门教程，希望本篇文章对准备学习web前端的小伙伴有所帮助，想了解更多web前端相关知识记得关注千锋武汉官网。

作为一个正在经历培训的入坑者给你点建议

1、html+css h5+c3

2、javascript （分初级+webAPI+高级）

3、jquery

4、ajax（蛮重要）

5.、Node.js （重要）

6、Vue（或者Anglar、React，前端三大框架至少需要会一个，推荐Vue，毕竟国人开发的，文档是中文的）

其他的像微信小程序有兴趣也可以去学，我也是刚入门，还有些知识点可能不清楚，这些只是个大概的线路

现在是知识共享时代，免费的课程有很多。

不知道你有编程基础没有，如果没有不建议你看书籍，可以先在网上看基础教程，有老师讲解会比你自己学习快很多。免费的课程网上一搜一大把，各种网盘资源视频都是，不过多了不一定是好事，不要看见视频就保存，你也看不过来，建议你找基础开始的然后一点一点学习，这个视频系列看完了，再去看其他的。

这样的学习网站有很多，比如知名的慕课网、腾讯课堂、网易云课堂、网易公开课等等。重要的不在多在于精，每家课程都差不多，前端基础讲来讲述也就那么多内容，所以重要的是你要能坚持一个学习完，不要看这个课程好学了两天又学下一个，那样没有用。

等你前端入门了可以自己找些书看，不过还是建议多看视频多练习，编程是要动手敲代码的，只有你写了，你才理解的更深。

我跟你说一套，我自己的方法，非常的有效

我带过不少人，一般1周看w3scholl的html和css属性，从2周开始不断的给项目实战，难度则是从简单到复杂，3个月后，基本学出来的动手能力都很好，好过培训出来的

先学习html和css，学完练习写静态网页，熟练的能把psd图转换成html页面之后，紧接着学习JavaScript，学完后，再去为你之前写的静态页面添加点交互效果。当你完成上述之后，后面该学什么你自己就知道了。

学习前端肯定是要分阶段来学习，把每一个阶段搞懂，一步一脚印，之后才能找到一份合适的工作。

第一阶段：Web网页基础

HTML入门基本内容，CSS+DIV的基础知识，选择器，盒子模型，网页布局，Photoshop

第二阶段：Web编程基础

学习路线：JavaScript基础，BOM和DOM模型，事件处理，jQuery，交互及动画，jQuery优质插件，文档处理，数组和对象操作

第三阶段：Web编程高级及全栈开发

学习路线：JavaScript高级编程，原型模式，jQuery插件开发，模块化组件开，AJAX，Express(Node.js)，Mongodb，RequireJS，MongoDB

第四阶段：响应式网站开发

学习路线：HTML5/CSS3，响应式原理及布局，Bootstrap，前端依赖管理，CSS预处理语言（Less+Sass），Grunt/Gulp自动化构建工具，Angular4

第五阶段：框架与项目管理

学习路线：Grunt/Gulp，Webpack模块加载器&打包工具，MVC（backbone）架构前端，VUE2，React

第六阶段：混合式移动及微信开发

学习路线：React Native，微信小程序

同样，自制力的强弱决定了你是否能开拓自己的视野。

希望以上黑马先锋学院的建议能对你产生帮助。

转载请注明来自：http://www.heimaxf.com

你说就是想学着玩，这样的话，我不太建议你学习。

我身边的同学，从C语言到JAVA到前端开发，学了有将近3年的时间。毕竟我们的专业不是软件过程，只能自学或者在外面报班。我当时也在外面报班了，我学了有1年半的时间，花了有4千元左右。最后我没有学，主要是对编程真的不来电，发现对互联网产品和运营更感兴趣。

当然，不止学习了这3个方面的知识，还有C++,数据结构，操作系统，JSP+Servlet+JavaBean，Struts+Hibernate+Spring，Ajax。这些都是前期的课程，具体确定你的工作方向后，还要学习你方向的知识。大家不要认为学前面的没有用。学习编程，建立一套编程思想是最重要的，用程序员的思考方式去思考问题。后面的各种编程语言其实都是建立在前面的基础之上，所以掌握编程的核心，万变不离其宗。即使后面有新的编程语言，学习起来也不是太困难。

你要做的有以下几步：

了解前端

网站的开发和开发分为前端和后端两个部分。前端主要负责实现可视化和交互效果，并与服务器通信完成业务逻辑。其核心价值在于追求用户体验。

知道前端的工作流程：

基础学习【急于求成的，可以略过】

在这里，我只介绍入门级别的web前端，至于进阶过程，等你工作了，领导和生活会逼着你学习。

我看过一些培训机构，他们大多数都是直接教前端编程需要的H5、CSS3、Javascript、等等，不会教编程的基本基础。宣传基本上都是3个月掌握前端之类的。要知道，这就是为什么企业宁愿招生本科是计算机相关专业的学生的原因？大学4年，除去大四，一般大学的课程都是先打基础，再上专业基础课，再上专业课，再上专业选修课。这样上的好处就是专业基础很好。而那些3个月就出师的培训机构，是直接就教你编程，在最后几周，给你教一个项目，一些面试技巧，然后你凭着这个去找工作。工作找到了，老板让你负责项目里的一小块，这个时候，会出现很多问题。大家不要觉得荒唐，我一个高中同学就是这样的，最后在公司里呆了一周，主动辞职，又开始自学了。

我说这个的原因是，如果你打算以后靠这个工作，而且有一颗上进的心。我建议你：

• 学习C语言。别问我为什么，我就是觉得一个程序员应该要学过C语言，牛逼不牛逼是另外一会事儿，况且很多书都是用的C语言描述。别光学语法，弄清编译是什么，链接是什么，指针是又怎么一会事儿。

• 学习数据结构和简单的算法。你看，你学完C语言就能学数据结构和算法了，我难以想象用 php 来描述数据结构和算法会有多么地奇怪。如果你觉得学了之后还是不知道数据结构究竟是什么，有什么用，那证明你还没有真的学到。

• 学习一门面向对象的静态编程语言。推荐 Java。学得有多好，就看你花了多少时间了。请务必仔细阅读各类相关书籍，深刻领会面向对象的重要编程思想（不过，切忌迷信面向对象编程）。

• 学习操作系统和计算机网络。至少一些基本的概念需要弄清楚，具体的细节，没有必要过于纠结。
  

进入前端学习

• 基础：推荐一个学习网站：FreeCodeCamp.cn

它是一个专门为0基础学习者准备的网站，从0开始学习WEB。课程设置很平滑，先是一些理论，然后是一些小实践，像打游戏一样，要一关一关的打通关。还有团队合作，你可以和你的小伙伴一起做一些任务，小项目。关键是，你完成课程后，会给你颁发证书，就像对你学习过程的记录。

我觉得这个很适合，自制力不太高的学习者。前端总共学习400个小时，还有其他编程系统课。如果你想提升自己，也可以学习。

• 用 HTML + CSS 模仿几个漂亮的静态页面。

当你看到现在大部分的网页都觉得能大概猜到怎样做，并且花时间真的能做出来的时候，即可进入下一步。注意，这个时候请你不要管浏览器兼容性或者太过注意代码的优雅结构，因为没必要。做到能兼容现代浏览器，内容和样式基本完全分离即可。这大概需要半个月到一个月的学习时间。

• 用 HTML + CSS + JS 写几个有交互的页面。

例如，你可以写一个漂亮的注册页面，它能够验证各种输入是否符合条件并且有一个用原生 JS 实现的日期选择器（Date Picker）。或者，写一个漂亮的，有动画的相册。注意，这个阶段请使用原生 JavaScript。同样的，兼容现代浏览器即可。这大概需要半个月的学习时间。

• 入门一门后端语言。

以前的工程师必须知道至少一种后端语言，但如果爱好也可以深入研究，那么较低的难度应该是PHP。这一部分可以分为基于两个框架的页面。大型项目基于框架开发。建议了解至少一种MVC框架，如PHP的CI，Yii，YAF，等，和框架的设计思想非常相似。现在NodeJs已经被广泛的应用于大企业，并建议人们使用表达框架节点做一些后端服务。

• 入门一个关系数据库。

比如说 MySQL。DDL 和 CRUD ，请一定要熟练。恩，这个阶段不要谈什么优化，那是扯淡。现在，你大概可以做一个多用户的博客程序了。这大概需要半个月的时间。

• 交互设计
  

最前面已经介绍了，前端的工作主要是实现界面美化和交互体验。什么是交互？交互的对象就是用户，给用户好的体验。给你推荐几本我看过的书：

1. 《用户体验要素》
   

2. 《About Face 3 交互设计精髓》

3. 《简约至上》

我相信有很多人和我一样，下了一个APP，发现：什么界面吗？好难看？想找一个东西不好找。功能块的区分不明显等等，这些都是交互的事。

以上就是前端工程师的入门阶段。如果对你有用，请点个赞吧！如果你有不同的想法，可以留言，我会回复的。