移动前端开发人员必知必会：移动设备概述

因为工作岗位的变换带来工作内容的变动，对于移动网站的前端开发已经疏远了好几个月，在这好几个月中有很多新的东西出现，自己所掌握的一些东西也已经陈旧，所以选择了这本书《HTML5触摸界面设计与开发》来系统地学习和整理一下关于移动网站前端开发的知识体系。

之所以选择这本书，一是因为这本书比较新，2014年04月发的第一版。其二是因为作者Stephen Woods，这是Flickr团队的资深前端，Yahoo主页的Javascript技术平台正是出自此人之手。

接下来的时间里会陆续上传关于这本书学习的一些知识点总结和梳理的心得体会。

移动和PC的差异

　　PC前端最担心的是页面能否兼容各种浏览器→很大一部分的工作是理解各种浏览器之间的差异，解决浏览器的兼容性问题。移动前端的问题不在各种浏览器的差异，而在于不同的设备差异。

设备的尺寸不同：

　　　　移动设备的尺寸比PC要小的多，而且没有鼠标，也没有习惯使用的键盘。

　　　　移动设备主要有：手机和平板（小型：7寸左右的屏幕，如Nexus 7、Galaxy Note、ipad mini；大型：ipad和10寸的Android平板）。

移动设备上的浏览器都是全屏浏览，唯一可通过旋转移动设备在横屏和竖屏之间切换的方法来调整浏览器的大小。所以，移动设备开发的网页就有了针对不同设备尺寸进行优化的需求，这就是响应式Web设计（这里不对响应式Web设计的概念进行介绍，之前的博客有对响应式Web设计做过详细的介绍）。

设备的计算能力不同：

　　　　硬件性能是移动设备和PC设备相比最大的致命弱点，不过，近期发布的移动设备都拥有了独立的CPU，性能上比早期的移动设备要好很多。

用户的使用习惯不同：

　　　　PC设备的使用场景比较单一化，但是移动设备确实利用了用户的时间碎片，排队、坐车、会议、甚至是上厕所。由于是时间碎片，所以移动网页的浏览对速度和性能的要求要比PC网页的要求要高的多。设想，你在上厕所，没打开一个移动网页需要10S左右的时间，我估计用户连大解都会受到影响。

界面操作方式不同：

　　　　PC通过鼠标点击和键盘输入来完成网页的浏览。但是移动设备是通过触摸界面来完成这些操作。

移动设备介绍

　　先来了解一下不同维度下移动设备的分类：

分类依据一：操作系统

　　　　移动设备的主流操作系统有：ios、blackberry os、android、windows 8，其中android已经是目前最流行的移动设备操作系统。

分类依据二：设备尺寸

　　　　根据设备尺寸的不同，移动设备主要有两种：手机和平板。

分类依据三：浏览器

　　　　Webkit是现在占额最高也是最流行的移动浏览器的内核。所有ios、android和blackberry的默认浏览器都是使用Webkit内核。

HTML5

HTML5已经不是一个具体的代码名称和编程风格了，而是一个功能统称和一个规范标准。所有移动浏览器共有的，为支持先进浏览器而存在的功能统称为HTML5。由于WHATWG（网页超文本技术工作小组）并没有给出官方规范的标准，正因为HTML5是一个动态的标准，所以各个浏览器对其支持性存在一定的差异，因此开发人员在开发的过程中要学会注意这些差异化。

HTML5的动态标准规范在：www.whatwg.org，完整的W3C官方规范在：w3.org。

移动页面对灵敏性的要求

触摸的界面给人的感觉是自然、流畅，如果一个移动页面打开很慢，操作很卡，这给用户的感觉会很不爽。那究竟什么样子的移动网页可以给用户很爽，很舒服的感觉呢？

原本我也以为从页面性能，服务器响应速度等多个方面来提升页面打开的速度，但是实际操作的时候这些都不会尽如人意。这本书中提出的一个观念让我眼前一亮，原来我们移动网页的性能审查标准不是单独的响应时间为参考维度的。而这本书的作者认为：页面只要让人“感觉”快，而不是真的快就可以的。所以“感觉”快，就是及时响应用户操作，让用户知道他的操作我们有反应了，并且能迅速给出反应的结果就OK了。

在移动智能设备上用户主要的操作就是滑动和触摸，针对这两个操作给出用户及时的响应你的页面就是成功的。可想而知，如果一个用户的滑动在操作的过程中突然停止了，一次也许可以忍受，如果第二次、第三次重复出现，我想这个用户可能永远都不会再访问你这个页面甚至整个网站，因为一个及时的相应造成的损失是不可估算的。

移动前端开发人员必知必会：移动设备概述相关推荐

前端开发人员需知——浏览器详解
浏览器主要分为shell(外壳)+内核,shell是面向用户的界面,即浏览器上集成的各种丰富的功能菜单,例如菜单工具栏目等,主要是提供给用户界面操作,参数设置等等,它是调用内核来实现各种功能的,内核才 ...
猿创征文｜计算机类学生必知必会的开发工具
计算机类学生必知必会的开发工具目录前言一.浏览器工具 1.在线工具 2.插件扩展二.优化电脑使用工具 1.notpad++ 2.plotplayer 3.Office Tool Plus--强大 ...
前端必知必会HTTP请求系列（二）简单一点的HTTP协议
http协议用户客户端和服务器之间的通信 http协议和TCP/IP协议族内的其他众多协议相同,用于客户端和服务器之间的通信. 那么问题来个如果两台服务器之间一台服务器向另一台服务器进行接口请求那谁是 ...
《渗透测试实践指南必知必会的工具与方法（原书第2版）》读书摘录
----------------------------------------------------------------------------分割线--------------------- ...
php7.2 开启mcy扩展,phper必知必会（二）
1.说说你对进程,线程以及协程的理解进程:是系统进行资源分配和调度的基本单位,是基本操作系统结构的基础.进程是程序基本执行的实体.进程与进程之间是独立的,拥有完全独立的地址空间,进程的切换只发生在内 ...
脑残式网络编程入门(三)：HTTP协议必知必会的一些知识
为什么80%的码农都做不了架构师?>>> 本文原作者:"竹千代",原文由"玉刚说"写作平台提供写作赞助,原文版权归"玉刚说&q ...
程序员必知必会之blog篇
程序员必知必会之blog篇网易广州赖勇浩(http://blog.csdn.net/lanphaday) 本文最初发表于恋花蝶的博客(http://blog.csdn.net/lanp ...
mysql第四章分页显示查询出租房屋信息_MYSQL必知必会读书笔记第四章之检索数据...
MySQL是一种开放源代码的关系型数据库管理系统(RDBMS),MySQL数据库系统使用最常用的数据库管理语言--结构化查询语言(SQL)进行数据库管理. 使用Select语句返回的数据,可能会发现显 ...
mysql中用完即删用什么_MySQL使用和操作总结(《MySQL必知必会》读书笔记)
简介 MySQL是一种DBMS,即它是一种数据库软件.DBMS可分为两类:一类是基于共享文件系统的DBMS,另一类是基于客户机--服务器的DBMS.前者用于桌面用途,通常不用于高端或更关键应用. My ...
风控成长之路---必知必会工具与业务
关注 "番茄风控大数据",获取更多数据分析与风控大数据的实用干货. 偶然翻开多年前的笔记,当时踏入数据行业就是从人生的第一条select的代码开始.还好多年前做的笔记,网络云盘还为 ...

移动前端开发人员必知必会：移动设备概述

移动前端开发人员必知必会：移动设备概述相关推荐

最新文章

热门文章