前端工程师必备收藏：学习资源全网罗

　　前言：

　　站在巨人的肩膀上，确实能让我们看得更远。而我认为学习的不二法门就是不断模仿，但是一定要有自己的思考。拿来主义如果少了思考，就会变得毫无意义。以下列出一些前端优秀网站，大家自行取其精华，批判吸收。

　 学习站点资源

• Adobe出的，Adobe其实是html5非常忠实的拥抱者。官方社区有非常多的html5资源http://beta.theexPRessiveweb.com/
• caniuse，非常好，谁用谁知道http://caniuse.com/
• 前端观察站，腾讯的前端技术，挺有含金量http://www.qianduan.net/
• html5和CSS3开发，还是Adobehttp://www.adobe.com/cn/devnet/html5.html
• MDN，mozilla官方出品的HTML5资料库，我认为是地球上最好的前端资料库https://developer.mozilla.org/zh-CN/
• css3参考手册在线版，很全http://css.doyoe.com/
• 前端网（W3Cfuns） - 前端开发工程师互动平台http://www.w3cfuns.com/
• 站酷 (ZCOOL) - 设计师互动平http://www.zcool.com.cn/
• 优设-UISDC: 优秀网页设计联盟-SDC-网页设计师交流平台-听讲座，聊设计，找素材，尽在优设网http://www.uisdc.com/

　 CSS3媒体查询（MediaQuery）

• css3媒体查询官方文档http://www.w3.org/TR/css3-mediaqueries/
• css3媒体查询官方中文文档http://www.w3.org/html/ig/zh/wiki/CSS3%E5%AA%92%E4%BD%93%E6%9F%A5%E8%AF%A2
• 前端观察站的文章http://www.qianduan.net/media-type-and-media-query.html

　 CSS3弹性盒模型（伸缩盒）

• 使用CSS弹性盒MDNhttps://developer.mozilla.org/zh-CN/docs/CSS/Tutorials/Using_CSS_flexible_boxes
• 官方的CSS弹性盒模型http://www.w3.org/html/ig/zh/wiki/Css3-flexbox/zh-hans

　 viewport与设备自适应

• CSSDeviceAdaptation官方文档http://dev.w3.org/csswg/css-device-adapt/#the-atviewport-rule
• ATA技术社区，viewport笔记http://www.atatech.org/article/detail/12233/786

　 CSS3动画

• CSS3Animationhttp://www.w3cplus.com/content/css3-animation
• CSS3动画在线测试工具（腾讯团队弄的）http://ecd.tencent.com/css3/tools.html
• CSS3Transitions,Transforms和Animation使用简介与应用展示http://www.zhangxinxu.com/Wordpress/2010/11/css3-transitions-transforms%E5%92%8Canimation%E4%BD%BF%E7%94%A8%E7%AE%80%E4%BB%8B%E4%B8%8E%E5%BA%94%E7%94%A8%E5%B1%95%E7%A4%BA/

　 javaScript性能优化

• Javascript高性能动画与页面渲染http://www.infoq.com/cn/articles/javascript-high-performance-animation-and-page-rendering
• 前端工程打开速度优化的循序渐进总结http://www.cnblogs.com/zhengyun_ustc/archive/2013/05/09/frontendoptimize.html

　 用户体验

• DIVCSS5 - DIV+CSS布局教程学习与CSS资源分享平台http://www.divcss5.com/
• FEX 做最专业的前端http://fex.baidu.com/
• GMU - mobile UIhttp://gmu.baidu.com/
• IXDC－国际体验设计协会 | 引领中国交互设计行业发展http://ixdc.org/
• UEhtml设计师交流平台 网页设计 界面设计http://www.uehtml.com/
• UI设计_UI_UI设计师-Uimaker-专注UI设计http://www.uimaker.com/
• UI中国-专业界面设计平台www.ui.cn/
• 畅游视觉设计中心http://vc.changyou.com/

　工具类

• 在线工具 —— 开源中国社区view-source:http://tool.oschina.net/
• Placehold.it-图片占位符http://placehold.it/
• CSS 图片拼合生成器-css_spritehttp://cn.spritegen.website-performance.org/

　 阿里

• Iconfont-阿里巴巴矢量图标库http://iconfont.cn/
• 阿里巴巴（中国站）用户体验设计部博客http://www.aliued.cn/
• TaoBaoUED | 做地球上最好的 UEDhttp://ued.taobao.org/blog/
• 一淘-UX-用户体验中心http://ued.alimama.com/

　百度

• 百度MUXhttp://mux.baidu.com/
• 百度搜索用户体验中心 | 创建搜索引擎的极致用户体验http://vc.changyou.com/index.shtml

　腾讯

• TGideas-腾讯游戏官方设计团队http://tgideas.QQ.com/
• 腾讯CDChttp://cdc.tencent.com/
• 腾讯ecd – 电商用户体验设计部 E-Commerce User Experiencehttp://ecd.tencent.com/
• 腾讯ISUX – 社交用户体验设计 – Better Experience Through Designhttp://isux.tencent.com/
• 腾讯MXD移动互联网设计中心http://mxd.tencent.com/
• 腾讯alloyteamhttp://www.alloyteam.com/

　网易

• 网易用户体验设计中心http://uedc.163.com/
• 网易nec-更好的CSS样式解决方案http://nec.netease.com/

　新浪

• 新浪UED | 一个关注用户体验、关注工作流、关注作品质量的有爱团队http://ued.sina.com/
• 微博UDC | 让设计无“微”不至http://udc.weibo.com/

　最后是我强烈推荐的博客！

• 张鑫旭的个人博客_web前端技术文章http://www.zhangxinxu.com/wordpress/（让我学到了很多很多）
• 海玉http://www.hicss.net/

　　也欢迎把好的网站 & 个人blog推荐给我。