Web 前端开发学习之路（入门篇） - 简书
Web 前端开发学习之路（入门篇）
以前学习过一段时间的web前端开发，整理了一些我看过的/我认为比较好的学习资料（网站、书籍）。不要问我为啥没有进阶版，我只是一条产品汪而已，求轻喷。＝＝
以下引用知乎 @李路 的话。
以我的经验，大部分技术，熟读下列四类书籍即可。
入门，用浅显的语言和方式讲述正确的道理和方法，如head first系列
全面，巨细无遗地探讨每个细节，遇到疑难问题时往往可以在这里得到理论解答，如Definitive Guide/Programming xx系列
实践，结合实际中经常遇到的情景环境，来描述如何设计和解决问题，如cookbook系列
深入，讲解一些文化，思路，甚至于哲学上的东西，真正做到深入一种语言去编程，如unix编程艺术，程序员修炼之道等等
受李路老师的启发，我结合了自己在学习前端过程中用到的资料如下：
语言基础（以书和网站为主）
1.HTML&CSS：
（1）入门：
Codeademy上的——在线交互式编程平台，弄清楚基本概念和基本语法
w3school上的HTML/CSS教程——技术手册式的教程，比较全面，照着实例敲一遍
（2）进阶：
——对CSS有一个比较深入的学习，对核心技术了解
——非常全面的书，内容也很新，包含了HTML5+CSS3+JS DOM
（3）实战：
bootstrap框架: /《》——流行的前端框架，注重实用即可
Codeademy上的Web Developer Skills+Projects——通过自己做小页面/小网站来运用所学
（4）提高：
——提高自己的艺术设计能力，通过实例来学习如何用CSS设计出漂亮的页面
2.Javascript：
（1）入门：
Codeademy上的——实例比较多，比较浅，算是基本了解JS
w3school上的JS教程——比较详细的了解下JS的特性
——讲js和DOM的基本知识和运用，了解JS和DOM可以做什么
（2）进阶：
** ——JS圣经，比较全面，非常好的一本书，比犀牛书可阅读性强**
——传说中的犀牛书，好厚好厚的一本书，不适合入门，适合当工具书看
——很薄的一本书，但是可以帮助你快速了解JS的精华部分
（3）实战：
jQuery框架: w3school上的jQuery教程/Codeademy上的jQuery教程——了解Jquery
——流行的前端框架，注重实用
（4）提高：
——讲如何提高js性能，以及构建和部署文件到生产环境的最佳实践
——jQuery作者写的书，如果你觉得精通JS了再看这本书
附录：前端网站大汇总
1、前端知识体系：
前端知识体系及修炼攻略：——对前端知识体系剖析的非常好，尤其是最后对前端的阶段性划分，对前端学习很有指导意义，推荐！
前端开发知识结构：——有个前端知识框架的思维导图，给了很多链接和好书，推荐！
2、技术资讯类
W3Cfuns : ——国内最大的前端站，比较全
大前端：——没有W3Cfuns那么杂，有些wodpress的主题，“前端导航”也比较好用
W3Cplus:——也是比较全，有个“国外优秀译文”，非常喜欢
前端观察 ：——专注于前端设计与开发的博客，比较有深度，排版干净，推荐！**
前端乱炖 ：——有点像前端的知乎，有问答平台和专栏啥的
3、技术教程、文档类
——超级实用的视频教程类网站，各种小实例，非常适合照着“前端学习计划”计划学习
codeademy :——英文，简单有趣的互动编程学习网站，非常适合入门，中文版是
W3schoo在线教程l: ——中文，适合入门，教程相当全，在线实例可以敲，可惜较浅，有些地方不太准确和深入
火狐开发者网络MDN：——中文，不仅有技术文档，而且有相当多的参考资料和资源、工具，推荐！
——英文，不解释，官方文档，真前端和伪前端就在于此。可惜英文的，而且可读性差。极不适合入门，适合提高。
Web平台文档：——英文，权威性仅次于W3C标准，可读性高于W3C标准，W3C官方认可，高质量。
前些日子从@张鑫旭微博处得一份推荐(Front-end-tutorial)，号称最全的资源教程－前端涉及的所有知识体系；有粗略查看，果然“叹为观止”，至少比想象中涉猎丰富许多；果断有Fork了来：Front-end-本就有收藏&分享欲，这种事儿早期也想做了...
前些日子从@张鑫旭微博处得一份推荐(Front-end-tutorial)，号称最全的资源教程－前端涉及的所有知识体系；有粗略查看，果然“叹为观止”，至少比想象中涉猎丰富许多；果断有Fork了来：Front-end-本就有收藏&分享欲，这种事儿早期也想做了...
前端知识体系 http://www.cnblogs.com/sb/p/3894452.html 前端知识结构 https://github.com/JacksonTian/fks Web前端开发大系概览 https://github.com/unruledb...
原文请点击 综合类 地址 前端知识体系 http://www.cnblogs.com/sb/p/3894452.html 前端知识结构 https://github.com/JacksonTian/fks Web前端开发大系概览 https://github...
前端知识体系 http://www.cnblogs.com/sb/p/3894452.html 前端知识结构
https://github.com/JacksonTian/fks Web前端开发大系概览https://github.com/unruledb...
我最近一直在百词斩尝试读英文原著小说，今天是阅读的第23天，已经成功读完《小王子》这本书，开始读简·奥斯汀写的《傲慢与偏见》。 百词斩的阅读机制是每天定时定量推送阅读和温习。我将阅读提醒设置在每天早晨八点，除了周末和一些特殊情况，这个时间点我一般都在去上班的公交上，可以利用...
编写自动化测试用例的原则： 1、一个脚本是一个完整的场景，从用户登陆操作到用户退出系统关闭浏览器。 2、一个脚本脚本只验证一个功能点，不要试图用户登陆系统后把所有的功能都进行验证再退出系统 3、尽量只做功能中正向逻辑的验证，不要考虑太多逆向逻辑的验证，逆向逻辑的情况很多（例...
英中企业家协会和新华网联合主办的创投大赛，到今年已经是第三届了，报名参赛的团队很多。据比赛的承办方英国酷锐传媒介绍，今年的参赛团队来自中国、英国、新加坡、马来西亚、日本等多个国家，本次大赛历时半年，在中英两个赛区吸引了数百个优秀项目参赛，角逐非常激烈，最后，在5月27日的总...
度过了一个美好的周末，我发现了我身上一个致命的优点。 我这人吧，优点不多，缺点不少，从周末我做了两件事情发现了一个最大的优点。那就是行动力特强，有想法之后很快就会行动起来。 上周五，突然冒出来想自己做水饺吃，我可是从来没有单独做过的，之前在家最多也就是帮我妈擀擀饺子皮，其他...
一、错误信息 腾讯云服务器使用SVN上传文件到CDN时，报错信息为&SSL negotiation failed：ssl error:parse tl**t(https://cdn.yun.qq.com)& 二、报错svn的版本（openssl版本为0.9.8） 三、解决方...如何学习web前端开发第四天_百度知道
如何学习web前端开发第四天
我有更好的答案
前端是个入门容易深入难的行业,对于好的前端开发人员来说，拥有扎实的理论基础是很重要的。HTML/CSS/Javascript缺一不可，多去看标准、规范性的文档，见到喜欢的页面多去审查元素，CSS的话多去codepen上看一些酷炫的demo，javascript的话《javascript高级程序设计》等。js框架的话，基础的jquery最好瞅一瞅，自己写个插件什么的。看到好的东西，多实践、多总结，在github上造一些基本的轮子，再去涉猎下nodejs, 比如react，找点demo撸~IDE的话，sublime/webstorm，自己选吧
为您推荐：
其他类似问题
您可能关注的内容
换一换
回答问题，赢新手礼包
个人、企业类
违法有害信息,请在下方选择后提交
色情、暴力
我们会通过消息、邮箱等方式尽快将举报结果通知您。web前端初学者如何系统学习前端开发
针对大家关心的学习web前端开发,需要学习什么?难不难?多久能入门?怎么能快速建一个网站?工资能拿到多少?我们来进行简单的介绍。
大部分人刚开始都会选择自己在网络上找一些资料，书籍自己学习，还需要强大的自制力，如果能够遇到一个好的学习伙伴还能一起学习共同进步，如果仅仅局限于书籍，要知道学到的书本知识两年前就已经开始有了大的变化,你并不知道关于更多的web设计这方面的知识。
如何学习web前端开发？
一、学习HTML5和CSS3基础
技术的发展几步造就了互联网的蓬勃生机，移动互联网的快速发展HTML5+CSS3已然成为新一代的web前端技术。随着HTML5的发展和普及，了解 HTML5 也将成为 Web开发人员的必修课。涉及到网页外观时，就需要学习 CSS 了，它可以帮你把网页做得更美观。利用 HTML5 和 CSS3 模拟一些你所见过的网站的排版和布局(色彩，图片，文字样式等等)。当然，远标Web前端开发课程第一阶段还会学习 PS设计工具使用和互联网UI设计理论。
二、学习Java，了解DOM
Java语言不管是编程还是用作其他都有着广泛的应用，学习Java编程的基本语法，试着用Java操作编辑网页中的DOM元素，学会了应用Java语言能够让你的网页设计更加生动。
三、学习Web前端核心
WEB前端工程师还需要 熟练JS和UI以及DIVCSS快速合成静态页面，确保性能和兼容性，熟悉JQuery EasyUI、ExtJS、Bootstrap、Angular.js等框架;深入理解W3C web标准学习 Jquery 之后，大家就要学习 HTML5 高级阶段(HTML5 Canvas 绘图、HTML5 SVG、音频和视频处理、表单处理、表单验证等)在学习 Jquery 和 HTML5 学习结束后，就可以完成飞机大战、飞扬的小鸟以及复杂订单的实现。
学习HTTP协议及Server端技术也是Web开发人员的基本功之一。
当你能够熟练掌握HTML5，CSS3，Java等技术之后，就应该找一个Web框架加快你的Web开发速度，使用框架可以节约你很多时间。从最简单的HTML5基础到Web前端高级技术都需要细心的学习，想要做到精通，更是需要下苦功夫。
有很多想要学习web前端开发的新人都想自己能够快速的学习web前端开发，部分人因为自己基础比较薄弱，不知道自己该如何系统的学习，但是有着对web前端强烈的学习动力和兴趣，希望自己能够顺利进入这一行业，早一点实现自己的web前端梦。
关注（河北达内）回 “资料” 获取学习包。
免费课程试听（复制链接）：http://sjz.tedu.cn/wx/m/mfst/?pdsh
责任编辑：
声明：该文观点仅代表作者本人，搜狐号系信息发布平台，搜狐仅提供信息存储空间服务。
0基础120天精通编程语言
Adobe公司官方指定UI培训机构，会计实操培训
今日搜狐热点前端学习第四天
昨天保存的草稿不见了，今天早上重新记录昨天的学习内容。昨天学习的内容不多，主要分为两大块：浮动和定位。1、浮动的定义：使元素脱离原来的文档流，按照指定方向发生移动，遇到父级边界或者相邻的浮动元素停下来。float：left | right | none | inherit清楚浮动————clear：left | right | both | none | inherit （both代表左右两侧均不允许有浮动元素）2、目前兼容性比较好的清除浮动的方法：运用after伪类，在父级加上.clearfix{ *zoom:1; }.clearfix:after{ content:""; display: clear: }3、当父级的盒子小于子级的盒子时，子级的盒子会显示溢出，解决办法是在父级加上overflow：hidden；超出的部分会被隐藏，如何加上overflow：scroll；就会在父级盒子的边上加上滚动条。4、position：relative；相对定位：不会使元素脱离文档流，也就是说元素移动之后的原始位置会被保留。top | bottom | left | right 定义元素的偏移位置。5、position；absolute；绝对定位：使元素完全脱离文档流，如果有定位父级则相对于父级发生偏移，没有定位父级则相对于document发生偏移。6、position：fixed；固定定位，始终相对于整个文档定位，IE6不支持固定定位。7、层级默认后者高于前者，可以使用z-index：[number]定义各个元素层级。8、透明度opacity：[0到1]；0为全透明，1为不透明。
没有更多推荐了，
加入CSDN，享受更精准的内容推荐，与500万程序员共同成长！本人已经上班第三天，分享下我从自学到找到工作的经历【web前端开发吧】_百度贴吧
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&签到排名：今日本吧第个签到，本吧因你更精彩，明天继续来努力！
本吧签到人数：0成为超级会员，使用一键签到本月漏签0次！成为超级会员，赠送8张补签卡连续签到：天&&累计签到：天超级会员单次开通12个月以上，赠送连续签到卡3张
关注：50,186贴子：
本人已经上班第三天，分享下我从自学到找到工作的经历收藏
今年年初听说前端入门简单，火爆，工资挺高，所以我就开始自学到目前为止3个多月吧
刚开始学的时候因为不知道在哪找资料，然后就百度到了 w3C，然后看了基础的 HTML, CSS，jq，js嫌太繁就没怎么看，照着例子过了一遍后感觉还是什么都不会，然后有点懵逼感觉不能这样黑学
然后开始加前端 QQ群，现在有10个左右前端群，然后还关注了贴吧。于是靠着群，贴吧友人分享的各路零散视频开始模仿写，然后1个来月过去了感觉没啥效果，做的页面很难看
我也想自学?
后来在10个Q群没事闲聊问哪里有学习的资料啥的，别人介绍了暮课网，极客学院之类的，又介绍什么韩顺平，李炎灰，兄弟连的一些好久的视频大概14年的，倒是学了点 h5，C s3,于是做了两个简单 PC端网站投简历试水，好不容易十几个有一个面试，去了看 自己还差在哪，结果回来开始学移动端，响应式怎么布局！？？
开个直播贴算了
话说暮课网，韩顺平，李炎灰，兄弟连我找到的视频有教这些，然后做了几个站，现在有 PC，流失布局移动， bootstrap都是首页一张而且很一般的站又找了半个月没找到，我当时就开始方了，那我还得学到啥地步才能找到工作?感觉 js一时半会肯定只能学个入门级的，然后就在前端技术群里面开始每个都问
最后又花了点时间做了个类似于支付宝官网那种全屏切换的网站，切换一次就有 div,过渡移动，旋转之类的动画，或许是这样才最终打动了面试官吧
能发我看下你的面试作品吗？
话说，有点晚明天发，睡觉去，因为工作3天包括这周的任务 切10来个页面我95%的都做出来了有感而发
楼主用了多长时间？？？？
楼主哪里工作，工作都做些什么，还有面试成功的情况说下呗
支持自学的
工作好难找，简历都石沉大海了，楼主能分享下简历和找工作吗
刚开始第一天刚去早上就让我切个网站首页，我当时第一次真正切图，自学没用过 PSD，还好看过暮课网知道怎么用切片，然后第一天首页做了一天，我还想着第一天是打酱油呢…
然后第二天下午才给我把10张内页 PSD图发来，做了一个页面的一半然后就被妹子叫出去帮忙了
第三天早上开会到10点多，然后到下午下班我切了6张 PSD，感觉适应了挺好切的
只是切图吗？还是连网页都要代码实现？
工资多少，坐标哪里？
好励志，在学UI，不过感觉对前端感兴趣些
1天半做了6个页面？？？
第四天已经把11张页面连选项卡，轮播这些全部搞完了，感觉自己萌萌哒
那要看你做什么内容的网页，简单还是复杂的，？像淘宝京东那种你能用多久写完？
楼主可能没有考虑不同浏览器版本兼容性吧，轮播图应该是插件，要不怎么做这么快，我都震惊了
楼主轮播图用bootsrap做的嘛
额，我们这做完一个app功能页面起码一星期。。。当然活动那些不算
楼主你好！我也是自学的。做了一个京东首页！感觉js 和Jquery不是很熟练！能不能推荐几个好的学习交流群？
登录百度帐号}