首先无论你要学习任何技能，必须有一个清晰的版图，什么是清晰的版图呢？首先了解你学的技术将来要从事什么工作，这个工作的条件是哪些？

然后你要有一个非常清晰的学习大纲，切记学习任何东西都要系统，不可胡乱的瞎学浪费时间。

web前端开发学习路线

下面是给大家提供的一个学习大纲：

基础：HTML+CSS网站页面搭建，CS核心和PC端页面开发，HTML5移动端页面开发。

核心：web前端核心技术JavaScript，ecmasript，dom，ajax，json，正则，作用域，运动框架，核心算法，高级函数，插件封装，jQuery等。

高级：html5+高级JavaScript开发，大数据可视化，webapp交互接口，lbs定位，微信sdk，es6标准，高级算法，数据结构，插件封装。

框架：vue、react、angular企业开发应用。

企业要求：bootstrap，swiper，iscroll，sass，ps切图，网站上线等。

然后，对于一个专业知识非常强的专业，切记不要一个人蛮干，那样只会无限的让你走很多弯路，然后打击你的学习积极性，最后的结果就是不得不放弃，因为你实在学不下去了。所以学习专业知识一定要跟专业的人进行请教和交流。就好比你生病一样，你不能自己看病，你只能去找医生，因为医生比你专业，学习也是一样的道理。
学习web前端的注意事项

1.不要以看书学习为主，学习编程不是数学语文那么容易，你看看例题就会了，更需要的是别人的讲解，你自己看书上那些专业的文字，只是凭你自己意识理解的那样来，但是一般情况下我们都理解不了，毕竟我们不是出书的人，最好的方式就是找视频进行学习，找好的视频进行学习，然后在配上别人的解答，在加上自我的主动学习。

2.最好能系统专业的学习，因为如果你是一个小白或者零基础的入门者，自学也有可能会勉强入门，但是肯定会比别人走很多弯路，或者花费更长的时间，所以最好是能系统的学习，这样不仅能快速入门，升级的几率也很大，而且也能短期内出效果。

3.当你学习的时候，可能会出现学了就忘记不住的情况。打个比方：比方说我们在学习英语的时候，一天学习20个单词，但是过了一周之后，我肯定会忘记之前学过的单词。那么记住这些单词最好的办法就是应用于对话当中。我们学习web前端也是这样，同一个标签或者属性，或者是JavaScript的语法，只有你不断的见到它，并且应用它，让它都认识你了，这样你就扎实的掌握了，所以实际应用非常重要。

4.学习方法决定了你学web前端的效率以及你可以走多远，学习编程非常依赖一个好的学习方法，有太多人因为学习方法不对最终导致放弃，所以小编让各位一定注意自己的学习方法，每个人的学习方法不一样，但是大多数人错误的学习方法都是相同的，所以这方面一定要找大神请教。

web前端学习需要的软件工具

初期：EditPlus3软件。（学习初期不要用具有代码提示的软件，这样可以让你前期打好基础）

度过新手期：sublime text3开发工具、HBuilder开发工具、WebStorm （这三个开发工具可以三选一，看个人喜好）

切图工具：Photoshop

大致就整理了一些适合零基础或者初入门web前端的同行学习建议，关键还是在于持之以恒，如果没有基础，前期学习肯定会有点痛苦，坚持过去，接下来就会顺利简单很多，最后愿大家最终都晋级为前端大牛