收在这里慢慢学习，记得当初学习前端技术的时候，那个教程是比较枯燥，现在开始的设计师们，福利好哦

编者按：学习前端知识太过乏味木有挑战？整天对着w3school打瞌睡？有一个很棒的观点与你分享：学习一门技术最佳的方法就是把它用起来！如果你已经有了一点前端基础知识，但缺少实战经验，今天这组网站就太合适了，全都是集实战与教学为一体的综合性前端学习网站，收藏起来！

Codecademy

作为一款非常酷的在线编程学习网站，它向用户提供了一种全新的学习方式。在基于网络互动编程教程的基础之上，手把手帮助用户了解编程的基本原理，体味Codecademy的趣味性学习。

不仅如此，它还支持JavaScript、HTML和CSS、Python这四种语言呦，超赞的！

CodePlayer

它的优点是你可以看到作者是怎样一个个字母把代码打出来的。

有可以看高手写代码的网站，就有可以看高手一笔一划创作的网站！《超赞！有哪些很少为人所知，但是很有意思的网站？》

Codepen

这里面有很多很酷的特效，而且你还能看到它们的源代码。

CSSdeck

和CodePen差不多的一个站。

RunJS

国内的类似站。

CodeDrops

优秀的英文教程站。

NetTut+

这个站不仅有很多很棒的教程，还有关于前端最新的资讯，强烈推荐！

W3CPlus

国内的优秀教程站。

HTML5Rock

也是一个非常棒的前端教程网站, 有些文章还有中文版的哦。

Red Team Design

Hakim

（自备梯子）

WebStuffShare

（自备梯子）

SitePoint

Tutorialzine

这个站的教程也非常好，同样强烈推荐。

CSS Wizardry

Script Tutorials

Gotoandlearn

（自备梯子）

一个不错的视频教程站。

还有关于前段时间一直在UI上面的同学加我QQ的问题，之前QQ信息没更新，现在更新了，欢迎大家来交流，以后就不会出现加了没添加成功的情况了，谢谢小伙伴们的支持，多多交流，共同成长，奔向设计师的美好明天。哈哈

原文地址：zhihu

作者：@糖醋陈皮