今年折腾手机里的页面折腾的不少，一开始要求是用响应式，结果发现做点不变更需求的不要求快速上线的需求还好，可这TMD世界上有不变更的不快速上线的需求吗？
答案是木有啊！！！
先说说响应式页面
一套页面就要适应所有终端有木有，这是一个无底洞啊同志们！！！你要测多少设备，切多少适应式图片，写多少兼容性代码，特别是设计师同志设计出来的没有mobile first，这一开始就注定了后面源源不断的微调啊！！！
当然，今年主要都是跟活动类的需求，比起平台类的来说，时间要求高，过了这个点这活动上线就没什么意义了。所以在我分析了不少响应式页面后……
终于发现，原来做成PC和手机两套页面就可以了。为什么呢？
- 第一，从数据上来说，现在手机和PC是最大头的访问来源，别的设备，只要显示PC或手机中的页面就OK。
- 第二，从开发效率上来说，只做手机和PC很有针对性，不像响应式什么都是目标，那什么可能都捞不着。
- 第三，从性能上来说，因为有第二条有针对性，那么我们也可以针对两种设备做优化，响应式怎么个优化？
接下来就是手机中的页面要怎么弄
在分析了不少手机中的页面发现，基本上都按是320px宽来做，或做成宽自适应，或不做成。
做成宽自适应的当然最好，不过活动类的则可能只做到背景自适应，因为很多时给的设计稿就没考虑过自适应的问题。
当然这里也不怪设计师同志们，因为
- 首先，数据上来说320已经满足大多数手机中的要求了。
- 第二，自适应也会影响设计创意的发挥。
- 第三，定宽页面比自适应的要好实现多了，哈哈。
当然设计稿是不可能按320px宽来设计的，因为还有Retina，所以都是按640px宽来设计。我们有GAGA这样的神器，2x变1x，适应Retina代码自动生成。
然后写代码注意的
首先要用viewport把页面拉到屏幕宽，这代码网上一搜索一大堆。
然后可以用很多css3的高级东东，有这么多的高级属性可以用，你会发现写手机页面比写PC页面是多么爽的一件事。
然后针对WEBAPP的JS你会发现，PC上很多作法在这里是件很耗电的事，甚至让人家手机死机……这里初步研究主要是动画特效部分就放手都用CSS来做吧，JS来做特效那是PC时代的事了。
然后就是调试测试了
- 首先，外网服务器是必须的，因为手机要访问着看呢。
- 然后，什么weinre的可以用，不过用的不多，主要还是用CHROME开发工具模拟手机设备来调试。
- 最后，就是发布了，手机上的CACHE不太好清，手机设备也是为了省电才这么设定的吧，什么时间错之类都还很好用的。
当然你想要兼容的越多那肯定要调试测试的就越多，主要还是看数据吧，根据数据来制定兼容到那些设备。
最后还要说一说性能问题
在新时代我们不只是要发挥CPU的性能，还要发挥GPU的。
这里CSS已经走在了前面，在 High Performance Animations 一文中已经为我们指出 transform opacity 我们要大用特用，因为可以直接使用GPU加速。而 top left background color 等都会使用CPU，影响性能……
本想配图说明的，懒，就这样吧。