举个栗子：关于响应式web设计的建议或者书籍。
回复内容：
从你的问题我提取4个关键词
html5 webapp 响应式 学习他们的书籍或建议
1，html5 本身是一个大类目...
2，webapp 应该是css+html+javascript 共同构建的~ 当然css3 和 html5 起到了很大的作用
3，响应式，这个是另外一个概念... 直接看 winter 推荐的文章，然后自己实践一下吧
总的说回答第4个关键词
我默认你已经掌握基本的css html javascript
那么你只要了解基本的html5概念 敲一遍css3的新属性那么你完全可以直接开工了...
发现问题google就行...
如果希望系统的学习。。
我也推荐
html5触摸界面开发与设计只看过这本，不过这本也只是一本 工具书
如果你想跳过这些东西 直接玩 webapp ~
那么 建议 直接在W3C看 jquery moble~ 不说性能与定制，但可以很快搭建一个webapp
推荐一下hbuilder 的 mui 框架～ 快速搭建ios系统级别的ui界面
再推荐一下 vuejs ...
温特菊苣给的那篇文章很全面，里面不止说了响应式设计中前端的工作，也包括了设计等其他方面，作为菜鸡我只能推荐几本书(有的我自己也还没看...)：
《响应式web设计：html5和css3实战》
封面是一只瓢虫，这本其实响应式的东西讲得比较少，大半内容是关于介绍h5和css3的基础知识，全书主要是带领读者做一个小网页来写的，如果同时想了解h5和css3和响应式设计入门，这本不错～
《响应式web设计实践》
《跨终端web》
《html5触摸界面开发与设计》
(先写一点，上完课再继续答)
我谈谈对「HTML5移动前端webapp」的一些建议，书籍的话市面上肯定是没有讲「移动前端webapp」的，如果非要说有的话，基本上都是「Angular.js 指南」「React.js 指南」之类，「移动前端webapp」是一个比较大的概念，如果加上「HTML5」就更大了。讨论「HTML5移动前端webapp」就像后端狗讨论如何开发 「WEB 服务端」一样，需要针对不同的技术框架针对性讨论。我感觉如果想要掌握并且能够擅长「HTML5移动前端webapp」的开发，是需要掌握很多要点的。
首先就是移动webapp，你需要学习各种新技术，比如 CSS3、ES2015/ES6、webpack/browserify、gulp/grunt、Less/sass，然后还要掌握周边的各种辅助技术，如生成sourcemap方便调试，以及rem可以更好的适配多种不同尺寸的移动终端，此外还有很多细枝末节都需要不断的去积累。如果能够掌握以上的几个技术点，并且踩过不少移动端的坑，你就可以开始研究一个框架了，现在比较热门的当属 React.js 及 Angular.js 了，开始这些之后会有更多的周边技术等着你去研究，对于webapp，路由基本上是由前端控制吧，你应该去学习一个控制路由的库，诸如 react-router，那么OK，如果到这一步你都能掌握的话，你就可以开始做「H5移动webapp」了，性能调优方面的话也应该了解一些，移动设备上最吃内存的就是图片，需要重点优化。
没了，暂时就想这么多，后续可以再补充
基础知识
1、
HTML + CSS 这部分建议在线教程 上学习，边学边练.
之后可以模仿一些网站做些页面。在实践中积累了一些经验后，可以系统的读一两本书，推荐《Head First HTML 与 CSS
中文版》，这本书讲的太细了，我没能拿出耐心细读。你可以根据情况斟酌。
2、Javascript 要学的内容实在很多，如果没有其他编程语言的基础的话，学起来可能要费些力，建议看《Javascript语言精粹》，JS是一门很混乱的语言，这本书能够帮助你区分哪些是语言的精华，哪些是糟
粕，对于语言精华，应该深入学习。糟粕部分能看懂别人写的代码就行，自己就不用尝试了。
有了以上基础，就可以进行一般的静态网页设计，不过对于复杂的页面还需要进一步学习。
1、CSS。必看《精通CSS》，看完这本书你应该对：盒子模型，流动，Block，inline，层叠，样式优先级，等概念非常了解了。作为练习可以看下《CSS艺门之匠》这本书，它对标题，背景，圆角，导航条，table，表单等主题都有详细的介绍。
2、Javascript。上面提到内容还不足以让你胜任JS编程。在有了基础之后，进一步学习内容包括：
a） 框架。
推荐jQuery，简单易用，上手jQuery即可完成一些简单的项目。学习方法也很简单，照着产品文档做
几个页面就行了，不用面面俱到，以后遇到问题查文档就行了。框架可以帮你屏蔽浏览器的差异性，让你能更专注与Web开发学习的精髓部分。补充： 可以使用
Codecademy 学习 Javascript，jQuery，用户体验真的很好（感谢 TonyOuyang ）。
b） Javascript 语言范式
。这个名字可能并不恰当，只是我找不到可以描述“面向对象”，“函数式”这个两个概念的概念。Javascript不完全是一个面向对象的语言，它的很多
设计理念都有函数编程语言的影子，甚至说如果你不用面向对象，完全可以把它理解成一门函数式编程语言。
Javascript的很多语言特性，都是因为他具有函数式语言的特点才存在的。这部分推荐先学习面向对象的基本理论，对封装，继承，多态等概念要
理解，维基百科，百度百科会是你的帮手，另外推荐《Object Oriented
Javascript》，应该有中文版。对与函数式编程我了解的也不系统，不好多说，可以自己百度一下。
c） Javascript 语言内部机制。必须弄清如下概念：JS
中变量的作用域，变量传递方式，函数的定义环境与执行环境，闭包，函数的四种调用方式（一般函数，对象的方法，apply，call），以及四种调用方式
下，‘this’指向的是谁。这部分内容你会在《Javascript语言精粹》中详细了解。另外，你必须理解 json。
d） dom编程，这个Web前端工程师的核心技能之一。必读《Dom编程艺术》，另外《高性能 Javascript》这本书中关于dom编程的部分讲的也很好。
e） Ajax编程，这是另一核心技术。Ajax建议在网上查些资料，了解这个概念的来龙去脉，百度百科，维基百科上的内容就足够了。真正编程是很容易的，如今几乎所有框架都对Ajax有良好的封装，编程并不复杂。
f） 了解浏览器差异性。这部分包括CSS和js两部分，浏览器差异内容很多，建议在实践中多多积累。另外对于浏览器的渲染模式，DOCTYPE等内容应该系统学习。
3、HTML5和CSS3 。HTML5规范已经于2014年10月28日发布了，移动端HTML5和CSS3已经得到了非常广泛的使用，必知必会呀。
再进一阶 · 代码层面：
有了以上知识，对于大多数小型网站，你应该已经可以写出能够工作的代码了。但要想成为更专业的前端，你还需继续努力。更高的要求大概还有四方面：1）易维护，2）可测试，3）高性能，4）低流量（移动端）。
1）易维护。对于页面你该理解‘样式’，‘数据’，‘行为’三者分离，对应的当然就是CSS,HTML,js。对于js代码，你最好了解设计模式，重构，MVC等内容。
2）可测性。
3）高性能。必读《高性能Javascript》
4）低流量。移动端关注比较多。
5）对于想要学习前端的同学，尤其是自学的伙伴，自学并非永久的，假如没有定力的还是找个培训机构吧。
再进一阶 · 工程层面：
前端项目同样面临软件生命周期的各个环节，首先是代码管理，你必须学会使用Svn和Git。其次是代码的构建，如今前端代码构建已经不是简单的压缩一下了，需要进行依赖管理、模块合并、各种编译，比需要学会使用Grunt、Gulp等前端构建工具。
对于前端开发，基本内容就这些了，可以根据自己的兴趣爱好选择性学习以下内容。
1、交互设计。大公司依然有专业人士搞这些，不过不懂交互的前端一定不是好前端。
2、后端。
应该说前段工程师必须至少了解一门后端语言，不过如果爱好也可深入学习，入手难度比较低的应该是PHP了。这部分由可分为基于页面，基于框架两种。
大型项目都是基于框架开发的，建议至少了解一个MVC框架，比如PHP的Ci、Yii、Yaf
等，好还框架的设计思想都大同小异。如今NodeJs在大公司已经得到普遍的使用，推荐大家使用在Node上使用Express框架做一些后端服务的开
发。
3、Android和IOS开发。
时至今日，前端的工作领域已经非常广泛，native的界面开发本质上也是前端开发，个大公司都面临着Native环境和web环境页面同时维护的问题，如果能够在技术上得到统一，将会有巨大的价值。对于学有余力的同学，应该了解Native开发的基本流程，至少了解到界面构建的技术。
books
JavaScript Mobile Application Development
Mobile JavaScript Application Development - O'Reilly Media
Mobile First Design with HTML5 and CSS3
Responsive Web Design by Example
Sencha Touch 2 Mobile JavaScript Framework
Mobile HTML5 - O'Reilly Media
Responsive Web Design by Example
HTML5 and CSS3 Responsive Web Design Cookbook
Responsive Web Design with HTML5 and CSS3
rwd
Media Queries
Responsive Design Knowledge Hub
关注spec.
Standards for Web Applications on Mobile: current state and roadmap
《HTML5 触摸界面设计》这本书讲的很不错
www.w3school.com.cn/
熟悉与HTML的关系和区别，熟练掌握CSS3（响应式布局）、绘图API以及相关JsAPI的使用
第一章： HTML5概述
1
HTML的发展，HTML5的诞生，HTML5和HTML的关系和区别
2
HTML5的目标、HTML5与之前HTML语法的改变、新增的元素和废除的元素、全局属性
第二章： HTML5基础
1
新增文档结构元素（Article、section、nav、aside、header、footer、address）
2
表单改良（input改良以及output元素的新增）、验证、自定义错误信息
3
文件API（FileList对象和File对象、FileReader接口）、和拖放API（自定义拖放图标）
阶段性项目： 复习具体知识点，和HTML4文档结构做对比，熟练使用表单和文件新功能
第三章： CSS3
1
CSS3的概念以及对比CSS2区别、新增的后代选择器、新增伪类选择器（before、after…）
选择器相关
2
文本阴影（text-shadow）、文本自动换行（word-break）、自定义字体（@font-face）
文本相关
3
圆角（border-radius）、图片边框（border-image）、盒阴影（box-shadow）、两端对齐
盒子相关
4
变形处理（transform）、动画（transitions）、帧定义（key-frames）、旋转（rotate）
动画相关
5
视角（perspective）、变形类型（transform-style）、圆点（transform-origin）、3D旋转
3D相关
6
响应式布局概念以及语法（@media）、web网页和mobile网页的区别、样式继承
响应式布局
阶段性项目： 课堂案例举一反三，作业完成，2D（网易邮箱首页动态图壁报）和3D动画（模拟3D城市）
第四章： HTML5高级之绘制图形
1
Canvas标签基础知识、绘制矩形、绘制圆形、使用路径、图像裁剪、保存为文件、简单动画
2
Svg体系的基础知识、和canvas标签的功能对比、和canvas的区别、绘制动画
阶段性项目： canvas实现银河系旋转、svg实现萌Q宝宝，时钟
第五章： HTML5高级之多媒体
1
多媒体的概念、audio音频元素、音频元素javascriptAPI、音频回调事件、audioContext
2
Video视频元素、视频元素javascriptAPI、视频回调事件
阶段性项目： 潭州音乐播放器（音乐播放、歌词同步、曲谱图、MV同步）
终篇： HTML5企业级实战技术
1
本地存储web storage、本地数据库基础概念和sql基础
本地存储
2
缓存概念、本地缓存和浏览器网页缓存的区别、本地缓存applicationCache
本地缓存
3
通信基础知识、跨文档消息传输的概念、webSocket通讯
通信
4
定位基础知识以及原理、通过GeolocationAPI获得地理位置信息、结合google（高德）地图定位
GPS及定位
5
PhoneGap实现各种传感器、光度传感器、方向传感器、重力感应等
传感器
阶段性项目： 每个都有对应的项目案例可以实现
综合项目（新浪微博手机响应式布局网站 潭州微商城开发 等企业响应式手机网站）
推荐个博客吧，前端学习者应该知道的比较多首页 » 张鑫旭
，希望对你有帮助
