上一篇文章《pageResponse - 让H5适配移动设备全家》中分享了一个小插件让一套H5页面适配几乎所有移动设备,得到了一些同学的推荐和认可,这里感谢大家的支持。

在此之前也在部门前端组内做了分享,后来师傅跟我聊了下,其实现在前端和设计的合作上经常遇到页面适配问题,在沟通上影响工作效率,在页面设计上影响用户体验。

所以决定准备给设计师们带来H5适配的分享,内容大概是了解H5页面适配等问题,以便更好得配合前端完成页面,提升页面体验。

于是,在工作的业余时间,我把想到的点记录下在本子,经过几天整理,也有了点内容。考虑到是给设计的同学做分享,ppt几乎只有图片,所以看起来会比较清晰易懂~

说明:PPT主要数据取自友盟指数2015年5月份数据,国内活跃设备达10.3亿,另一部分数据取自腾讯分析2015年第一季度移动行业数据报告,覆盖设备数超过17亿,两者非常具有参考价值。

网络慢看不到ppt的同学可以看下部分截图:

【原】让H5页面适配移动设备全家 - 设计师篇 - PPT的更多相关文章

  1. 【原】让H5页面适配移动设备全家 - 前端篇 - PPT

    7月份在部门内给设计中心的同事们带来<让H5页面适配移动设备全家 - 设计师篇 - PPT>的分享,在视觉和交互稿上提出页面适配的建议及提升页面体验的好处,促进前端和设计双方更好的合作,同 ...

  2. 【原】pageResponse - 让H5适配移动设备全家(移动端适配)

    上一篇文章<为什么选择iPhone5的分辨率作为H5视觉稿尺寸>最后留下了问题:是否需要视觉设计师设计多套的视觉稿供给前端工程师做页面适配呢?按照自己以前的方法,通常会要求设计师设计2套的 ...

  3. 教你如何用 lib-flexible 实现移动端H5页面适配

    前话 好久没写教程了(可能会误导新手的菜鸟教程( ̄▽ ̄)"). 这是我的github,欢迎前端大大们和我一起学习交流 https://github.com/pwcong 最近入职公司做前端实 ...

  4. h5页面适配iPhone X的方法

    一.原生适配iphoneX 原生适配很简单,查看机型图:   只要用 #define KIsiPhoneX ([UIScreen mainScreen].bounds.size.height>8 ...

  5. H5页面适配所有iPhone和安卓机型的六个技巧

    http://www.th7.cn/web/html-css/201605/166006.shtml http://www.th7.cn/web/html-css/201601/153127.shtm ...

  6. H5 页面适配几种展现形式

    1.contain 模式:以内容中心为基点按照视觉稿的宽高比缩放以适配窗口显示全页面内容,窗口与内容的宽度比或高度比之间较小者缩放填满窗口,当窗口宽高比和视觉稿不同时,另一方向的两侧出现留空部分. 2 ...

  7. h5页面适配小结

    大概是去年的7月想写这个内容去加深自己的理解.现在终于回来补上这篇入门小结了. 1.问题描述 适配的目标:在不同尺寸的手机设备上,页面“相对性的达到合理的展示(自适应)”或者“保持统一效果的等比缩放( ...

  8. pageResponse - 让H5适配移动设备全家

    http://www.cnblogs.com/PeunZhang/p/4517864.html

  9. 移动端H5页面编辑器开发实战--经验技巧篇

    很久前的写的文章了,转载下发到这里 原本地址: https://blog.csdn.net/tech_meizu/article/details/52484775

随机推荐

  1. JavaScript 中对变量和函数声明的“提前”

    变量声明“被提前” JavaScript 的语法和 C .Java.C# 类似,统称为 C 类语法.有过 C 或 Java 编程经验的同学应该对“先声明.后使用”的规则很熟悉,如果使用未经声明的变量或 ...

  2. FWaaS 实践: 允许 ssh - 每天5分钟玩转 OpenStack(119)

    上一节应用了无规则的虚拟防火墙,不允许任何流量通过. 今天我们会在防火墙中添加一条规则,允许 ssh.最后我们会对安全组和 FWaaS 作个比较. 下面我们添加一条 firewall rule:允许 ...

  3. clipChildren和clipToPadding

    clipChildren 和 clipToPadding clipChild 用于定义子控件是否在父控件边界内进行绘制.clipChild 默认为 true.也就是不允许进行扩展绘制. clipToP ...

  4. Spring Bean的生命周期(非常详细)

    Spring作为当前Java最流行.最强大的轻量级框架,受到了程序员的热烈欢迎.准确的了解Spring Bean的生命周期是非常必要的.我们通常使用ApplicationContext作为Spring ...

  5. 前端CSS部分知识整理

    1.如何清除图片下方出现几像素的空白间隙? /*方法1:*/ img{display:block;} 方法2: /*img{vertical-align:top;}*/ 2.如何让文本垂直对齐文本输入 ...

  6. CSS教程:div垂直居中的N种方法以及多行文本垂直居中的方法

    在说到这个问题的时候,也许有人会问CSS中不是有vertical-align属性来设置垂直居中的吗?即使是某些浏览器不支持我只需做少许的CSS Hack技术就可以啊!所以在这里我还要啰嗦两句,CSS中 ...

  7. Redis分布式集群几点说道

    原文地址:http://www.cnblogs.com/verrion/p/redis_structure_type_selection.html  Redis分布式集群几点说道 Redis数据量日益 ...

  8. Kafka 如何读取offset topic内容 (__consumer_offsets)

    众所周知,由于Zookeeper并不适合大批量的频繁写入操作,新版Kafka已推荐将consumer的位移信息保存在Kafka内部的topic中,即__consumer_offsets topic,并 ...

  9. Entity Framework 教程——模型浏览器

    模型浏览器: 在之前的章节中,我们创建了第一个关于学校的实体数据模型.但是EDM设计器并没有将他所创建的所有对象完全显示出来.它只将数据库中的被选择的表与视图显示出来了. 模型浏览器可以将EDM所创建 ...

  10. shiro的使用1 简单的认证

    最近在重构,有空学了一个简单的安全框架shiro,资料比较少,在百度和google上能搜到的中文我看过了,剩下的时间有空会研究下官网的文章和查看下源码, 简单的分享一些学习过程: 1,简单的一些概念上 ...