7月份在部门内给设计中心的同事们带来《让H5页面适配移动设备全家 - 设计师篇 - PPT》的分享，在视觉和交互稿上提出页面适配的建议及提升页面体验的好处，促进前端和设计双方更好的合作，同时也提升页面体验，分享后跟设计师们沟通，反应情况良好，说明这套适配的方案是有一定价值的。在9月份很荣幸收到TID同事的邀请，参与【TID重构主题交流会】第六期：体验的前端分享，于是在设计师篇的基础上重新整理了前端篇，通过分析当前市场的数据，结合实际的项目需求，总结出适配各种移动设备分辨率的思路和解决方法，相信认真品味该ppt对页面适配的思考上会有改观，良心制作，再此推荐给大家。

目录

  • 大数据的启发和思考
  • 3种适配模式
  • pageResponse.js

PPT内容

精彩截图

相关文章

《pageResponse - 让H5适配移动设备全家》

《让H5页面适配移动设备全家 - 设计师篇 - PPT》

《为什么选择iPhone5的分辨率作为H5视觉稿尺寸》

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

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

    上一篇文章<pageResponse - 让H5适配移动设备全家>中分享了一个小插件让一套H5页面适配几乎所有移动设备,得到了一些同学的推荐和认可,这里感谢大家的支持. 在此之前也在部门前 ...

  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. 版本控制工具比较-CVS,SVN,GIT

    首先介绍几个版本控制软件相互比较的重要依据: a.版本库模型(Repository model):描述了多个源码版本库副本间的关系,有客户端/服务器和分布式两种模式.在客户端/服务器模式下,每一用户通 ...

  2. git revert和reset区别

    1.在github上建立测试项目并克隆到本地 2.本地中新建两个文本文件 3.将a.txt commit并push到远程仓库 执行 git add a.txt, git commit -m " ...

  3. C#基础回顾（二）—页面值传递、重载与重写、类与结构体、装箱与拆箱

    一.前言 -孤独的路上有梦想作伴,乘风破浪- 二.页面值传递 (1)C#各页面之间可以进行数据的交换和传递,页面之间可根据获取的数据,进行各自的操作(跳转.计算等操作).为了实现多种方式的数据传递,C ...

  4. 《Head First 设计模式》之策略模式

    作者:Grey 原文地址:http://www.cnblogs.com/greyzeng/p/5915202.html 模式名称 策略模式(Strategy Pattern) 需求 模拟鸭子游戏,游戏 ...

  5. 我的runloop学习笔记

    前言:公司项目终于忙的差不多了,最近比较闲,想起叶大说过的iOS面试三把刀,GCD.runtime.runloop,runtime之前已经总结过了,GCD在另一篇博客里也做了一些小总结,今天准备把ru ...

  6. 在数据库访问项目中使用微软企业库Enterprise Library，实现多种数据库的支持

    在我们开发很多项目中,数据访问都是必不可少的,有的需要访问Oracle.SQLServer.Mysql这些常规的数据库,也有可能访问SQLite.Access,或者一些我们可能不常用的PostgreS ...

  7. wxWidgets

    wxWidgets Code::Blocks环境 Code::Blocks下载: Code::Blocks使用: codeblocks-16.01mingw-setup.exe 它的gcc版本为4.9 ...

  8. VNC软件的安装及使用方法说明

    本篇仅为作业... 实验课程:Linux系统 指导老师:刘臣奇 实验机器:联想y410p 实验时间:2016年9月11日 学生学号:140815 姓名:杨文乾 在一台机器安装viewer的同时,在另一 ...

  9. xinetd cpu 100%

    今天,有个给客户试用的环境出现xinetd cpu 100%,而且连续运行很长时间了.之前也有环境发生过,今天排查解决了三四个问题,实在是查的身体都不舒服了,还没时间查这个问题... 知道的求解...

  10. 开始我的IT博客之旅

    这是一个好的开始,过程很漫长,但我却乐在其中. 在大学之际,这是我的又一个开始,随便写点啦. 想把每一次的过程记录下来 这样以后对自己 对别人都会有所帮助. 好啦 作为一名大三的学生党  加油吧!