Web前端开发主要学哪些？

前端知识是一种很火的技术，一直在编程语言中名列前茅，而且随着浏览器技术不断发展，还有会很多扩展的可能性，比如3D可视化，谷歌发布一个全新的图形工具TensorFlow Graphics，结合计算机图形学和计算机视觉技术，以无监督的方式解决复杂3D视觉任务，无疑谷歌浏览器也会支持3D图像，前端技术实现在线可视化开发，基于webgl的3D框架有thingjs，three.js。
thingjs是这两年新兴的3D框架，更加简单，官网有注册优惠别错过~理论知识是基础，对于前端开发者来说，技术应用是进一步的需求，所以thingjs提供免费3D源码和3D模型库，让你在项目开发过程中有东风助力，在实操的过程中你会更好地吸收前端技术知识！
前端技术肯定不是最终的目的，做成一个有价值的商业项目，才能让你更有成就感！

了解web前端

Web前端开发是从网页制作演变而来的，名称上有很明显的时代特征。在互联网的演化进程中，网页制作是Web1.0时代产物，那时网站的主要内容是静态
的，用户使用网站的行为也以浏览为主。2005年以后，互联网进入Web2.0时代，各种类似桌面软件的Web应用大量涌现，网站的前端由此发生了翻天覆
地的变化。网页不再只是承载单一的文字和图片，各种富媒体让网页的内容更加生动，网页上软件化的交互形式为用户提供了更好的使用体验，这些都是基于前端技
术实现的。说得直白点就是美工photoshop，交互设计，flash，js，html+css。就小规模公司而言，一个技术员都得会这几样技能，这样
很锻炼人的，慢慢的你就会成为公司的主力。大规模的公司把这些分得很细，所以，你可以精通一门，熟悉其他的，进军大公司。

网页开发工具

学习web前端开发，网页开发工具有FrontPage，会用 Word
的人很容易学会FrontPage。还有一个常用的是Dreamweaver。这两种都是使用最多的HTML网页制作工具，我使用的是Dreamweaver
cs6,因为这套软件提供了一套直观的可视界面，融合了html5一些新的内容。包括网格布局什么的。

学习内容

HTML、CSS和JavaScript。html是内容，css是表现，javascript是行为。前端开发的门槛其实非常低，与服务器端语言先慢后
快的学习曲线相比，前端开发的学习曲线是先快后慢。所以，对于从事IT工作的人来说，前端开发是个不错的初入点。也正因为如此，前端开发的领域有很多自学
成“才”的同行。html是最基础的，现在流行的是html5设计，先学会网页布局。css是用来美化html页面的为页面提供布局和格式。最后再学
javascript。如果你把每天看电影、看电视剧的时间用来学习，我想一个星期入门是没有问题的。

基础知识：

1. html + css。这部分建议在 www.w3school.com.cn 上学习，边学边练，每章后还有小测试。之后可以模仿一些网站做些页面。本站提供的个人博客模板www.yangqq.com/download/都是比较简单的单页，可以下载下来模仿自己做一个。理解css每个元素的属性，样式的实现不一定只有一种写法，多想一想还有没有什么需要改进的地方。

《10条HTML代码编写技巧》

《CSS简明教程》

《Div+CSS 规则整理 以及注意问题》

2、JavaScript。不是所有的网页都必须有js，但是要想实现一些超酷的功能和界面的时候，就需要涉及到js。如果没有其他编程语言的基础的话，学起来可能要费些力，还是建议先在
w3school上学习。之后建议马上看《javascript语言精粹》

《JS经典实例》

3、Photoshop、flash。熟悉会一点儿就行了，没必要全部都学得精通，当然如果你在学习的过程中，发现你ps或者flash比较感兴趣的话，也可以尝试做美工这一行。

4、html5和css3。可以先了解一下，然后再入手。毕竟IE的浏览器大多还不支持。

《学习Html5建站教程（一）Html5简介》

《学习Html5建站教程（二）Html5 语法与规则》

《学习Html5建站教程（三）Html5博客页面设计之理论》

《学习Html5建站教程（四）用HTML5做个人的网站》

5、浏览器兼容。懂web标准，熟练手写 xhtml css3 并符合
符合w3c标准。代码能兼容主流浏览器Firfox，Chrome、Safari、IE、Opera。虽然IE6很多都不兼容，但现在还使用的人还是有的。W3C验证地址：http://jigsaw.w3.org/css-validator/ 通过验证指定URI的CSS内容，可以帮我们检查一下有没有错误。

6、熟悉一门后台编程语言 asp、php、jsp等 《关于asp、php、asp.net、jsp的学习心得、介绍及优缺点比较》

web前端设计师前景

遇到很多想换行的朋友，第一句就问，这行赚钱吗？我相信一句话，没有付出，是没有回报的！前面已经说过了，咱们这行门槛是很低的，所以薪资阶段也不一样。
2000初入这行的现在还普遍，工作经验2年以上，有很多代表性作品的时候，工资在4000左右；高手级别的估计在6000左右，大师级别这个阶段的薪资
参考：10000以上(上海北京深圳为例)网页设计师课程一般包括：Photoshop、Fireworks、用户界面设计实操，xhtml、css、
dreamweaver、网站架构与网站策划、flash动画制作，域名与空间、ftp、dhtml、javascript、动态交互网站(asp、
php、aja)

WEB前端分：高级，中级，初级。

初级前端掌握的课程：

• HTMl5+ CSS3。
  

• 前端学习的基础技能需要掌握HTMl+ CSS的基础内容。
  

• 学习内容：基础标签div，span，p，ul，li，input等。
  

• CSS：语法、派生选择器、id选择器、类选择器、属性选择器。
  

• CSS基本样式：背景，字体、链接、列表、表格、轮廓。
  

• CSS盒子,CSS选择器,CSS常用操作。

中级前端掌握的课程：

• CSS3和动画效果。

• HTML5。
  

• 新增标签、浏览器适配。
  

• JS——基础。
  

• 实现、输出、语法与注释、变量和数据类型、javaScript函数、JavaScript异常处理和事件。

• 件处理、DOM对象、正则表达式等。
  

• 重点掌握：Jquery、angularJS、bootstrap。

高级前端掌握的课程：

• 移动端：nodejs，vuejs。
  

• CSS：面向对象的CSS、CSS的后处理、Less、SASS。
  

• JavaScript：模块化，数据推送、高级函数、面向切面、多线程、设计模式。
  

• Web安全只是。

WEB前端简介：

WEB前端工程师，也叫Web前端开发工程师。他是随着web发展，细分出来的行业。web前端开发工程师，主要职责是利用(X)HTML/CSS/JavaScript/DOM/Flash等各种Web技术进行产品的界面开发。制作标准优化的代码，并增加交互动态功能，开发JavaScript以及Flash模块，同时结合后台开发技术模拟整体效果，进行丰富互联网的Web开发，致力于通过技术改善用户体验。

Web前端开发工程师是一个很新的职业，在国内乃至国际上真正开始受到重视的时间不超过5年。Web前端开发是从网页制作演变而来的，名称上有很明显的时代特征。在互联网的演化进程中，网页制作是Web1.0时代的产物，那时网站的主要内容都是静态的，用户使用网站的行为也以浏览为主。

要求：

Web前端开发工程师，主要职责是利用(X)HTML/CSS/JavaScript/Flash等各种Web技术进行客户端产品的开发。完成客户端程序（也就是浏览器端）的开发，开发JavaScript以及Flash模块，同时结合后台开发技术模拟整体效果，进行丰富互联网的Web开发，致力于通过技术改善用户体验。

• 为网站上提供的产品和服务实现一流的Web界面，优化代码并保持良好兼容性；

• Web前端表现层及与前后端交互的架构设计和开发；

• 配合后台开发人员实现产品界面和功能；

• 利用各种Web技术模拟开发产品原型；

• Web新技术调研和资讯整理；

• 精通HTML/XHTML、CSS，熟悉页面架构和布局，对Web标准和标签语义化有深入理解；

熟悉Ajax、JavaScript(或者ActionScript)、DOM等前端技术，掌握面向对象编程思想。

IT行业的热度有增无减，相对于编程来讲，Web前端开发更加易学，看到成果也会更有成就感，没有基础也可以学习。那么Web前端开发需要学什么呢?Web前端分为网站重构、前端交互、全栈开发、移动项目开发四个阶段。

一、网站重构

1、PC端网站布局

要学习前端行业介绍HTML基础、CSS基础，常用CSS样式，常用HTML标签与特性，css基本选择器，浮动和PS基础，定位，表格和表单，整站布局，

2、HTML5+CSS3基础

学习HTML5基础，H5中的多媒体和CSS3初识，css3文本模块基础，颜模式和渐变，边框和背景、盒子模型，多列、媒体查询、弹性盒、移动端布局知识点，浮动和PS基础，定位，表格和表单，整站布局

二、前端交互

1、原生JavaScript交互效果开发

要学习js基础语法、事件、判断语句、循环语句、数据类型

函数，js对象，BOM与DOM，事件高级、拖拽效果，cookie存储、正则表达式、JSON和JSON解析、Ajax，运动与游戏开发，面向对象基础，面向对象进阶

2、ES6

学习ES6基础，ES6进阶，实战项目

3、jQuery经典案例

4、前端框架和插件工具

学习touch.js、zepto.js、swiper.js、iScroll，常见页面布局、交互与动画、WeUI，Swiper animate，Bootstrap简介、框架的用法

三、全栈开发

1、PHP+MySQL

要学习PHP基础知识，PHP表单，PHP高级教程，MySQL，Ajax，知识扩展

2、NodeJs

Node基础，Express框架，MongoDB

四、移动项目开发

1、HTML5高级

2、移动端框架

要学习Angular，Vue，React

3、混合开发

学习React Native、微信小程序

前端的核心价值就在于实现用户体验，我给大家整理了一下零基础学习前端开发的知识路径：基础知识：

首先是Html+CSS这部分的内容，这部分主要用以实现页面效果，是前端最基础的知识，这部分可以学习八点一课在线课堂的HTML_CSS与页面布局课程，当你能背熟给个标签的使用之后，你就可以模仿一些网站做一些页面，不断的在实践中积累经验。

2、JavaScript，JS是很强大的一门语言，但是他的内容实在太多了，而且有很多内容是糟粕，新手是无法区分精华与糟粕的，这就造成了新手无从下手学习。JS也是一门复杂的语言，需要很明白的人给你讲才不会乱，否则你很难理解其中的要点。这一部分我们为大家准备了Javascript入门与应用课程，能帮助你快速上手JS。

3、进阶：当你具备了以上知识的时候，你就可以做出一般的静态网页了，也能做出比较炫酷的动画效果，但是对于复杂的、要与服务器交互的页面还需要进一步的学习。

CSS方面，着重去了解盒子模型，流动，block，inline，层叠，样式优先级等概念。然后是标题，背景，圆角，导航条，table，表单等也需要学习一下，学习完以上知识点你就可以在简历上写上熟悉CSS了，大胆点写个精通也行。

学习了以上JavaScript的知识点后还不能让你胜任JavaScript编程工作，所以在有了以上基础之后还需要进一步学习，内容如下：学习一款框架，这里我推荐你学习jQuery，这是非常简单易用的一款框架，你可以轻松的通过jQuery来完成一些简单的项目，学习起来也很简单，你不需要面面俱到的学习框架的所有内容，你只需要学习怎么用和基本用法就行了，毕竟遇到问题还可以查看文档，框架可以帮你屏蔽浏览器的差异，能让你把更多的精力放在开发的业务部分。

面向对象基本概念。虽然说JavaScript并不完全是一门面向对象的编程语言，因为他的设计理念我们可以看到很多函数编程语言的影子，但是我们还是要尽量把它当作面向对象编程语言来使用，这里要求懂得面向对象的基本理论，对封装，继承，多态要有一定的理解。着重了解JavaScript语言的内部机制。你必须熟悉以下的概念：JavaScript中变量的作用域，变量传递方式，函数的定义环境与执行环境，闭包，函数的四种调用方式（一般函数，对象的方法，apply，call），以及四种调用方式下，this指向的是谁。DOM编程，这是一个合格的前端工程师的核心技能之一，虽说现在框架已经封装了绝大部分的原生DOM语法，能让你更方便的使用DOM来完成一些事情，但是还是很有必要去熟悉DOM原生语法的。

Ajax编程。这里必须圈重点，前后端分离开发是近两年很流行的一种前后端协作开发模式，而且页面无刷新改变看起来也很炫酷，要做到这里都要用到Ajax编程，但是你也不用害怕，因为真正使用起来其实Ajax很简单的，而且现在的几乎所有框架都对Ajax有着很好的封装。补充了解浏览器的差异性。这部分包括CSS和JavaScript两部分，浏览器差异内容很多，建议在实践中多多积累。另外对于浏览器的渲染模式，DOCTYPE等内容应该系统学习。根据以上学习完，你已经可以成为一名合格的前端工程师了，但是如果想要进阶，你还不能松懈，还需要继续努力才行，要想成为更专业的前端，你还需继续努力。更高的要求大概还有四方面：1.易维护；2.可测试；3.高性能；4.低流量（移动端）。先脚踏实地的把门入了，未来的路，还任重而道远。