Google Search console新版本中更新了一个功能叫做：“移动设备易用性”。这个是用来检测你的网站流量是否可以完美的支持移动端设备。很多人不仅要问，移动端有什么好看的，主流不是PC端么？非也非也，给各位看官一组数据，如下图：
（数据来源：StatCounter，链接地址）
其实不难看出，移动设备的使用率已经远远高于PC端。你可以这么理解，如果你先在还没有开始做移动端页面，或者说你的落地页依然不支持移动端的话，你有可能损失大一波用户流量。
先来看下Google官方对于 “移动设备易用性” 的定义
“移动设备易用性”报告会显示您资源上有哪些网页在移动设备上查看时存在易用性问题。
顶级视图会显示移动设备易用性问题数量超出阈值水平的所有网页。点击某个具体问题可查看问题详情，包括受此问题影响的网页的示例列表、与如何修正此问题有关的信息，以及将修正情况告知 Google 的流程。
Google search console support
你的页面中的哪些元素会影响“移动设备易用性”呢？
使用了 Flash
大多数移动浏览器无法呈现基于 Flash 的内容。因此，使用移动设备的访问者将无法浏览依赖 Flash 来显示内容/动画或进行导航的网页。我们建议您使用现代网络技术来设计外观和网页动画。请在《网站制作基础资源》指南中详细了解外观。
未配置视口
由于网站访问者使用的设备各异且屏幕大小也各不相同（从大型的桌面设备显示器到平板电脑和小型智能手机），因此您应使用 meta viewport 标记为网页指定视口。此标记可以指示浏览器如何根据设备尺寸来调整网页大小及缩放网页。有关详情，请参阅自适应网页设计基础知识。
视口的宽度已被固定
其实简单点理解就是，当你页面通过手机打开的时候，是否需要用手左右滑动，如果是，那么你的手机体验会非常的差。
因为一般用户使用手机，只习惯于上下滑动，而不是左右滑动。
我们来看下Google官方对于“视口的宽度已被固定”说了些什么
此报告会指出哪些网页的视口宽度已被固定。为了使非自适应网页能够适合常规的移动设备屏幕大小，部分网站开发人员会将视口定义为固定的像素大小。要修正此类错误，请采用自适应网页设计，将视口设为可根据设备宽度自动进行调整和缩放。请参阅《网站制作基础资源》，了解如何正确设置视口。
Google Support
未按视口调整内容大小
其实一般对于页面前端涉设计师来说，目前主流的都是将CSS的宽度，高度，字体大小按照百分比去设置。而不是一个固定像素。
固定像素的CSS
font-size: 14px; margin-top:5px; width: 50px;
相对的百分比CSS
font-size: 120%; margin-top:1%; width: 100%;
这样一来，一些图片的宽高，还有文字大小会随着屏幕的变化而变化。可以使用不同设备的不同需求。
此报告会指出访问者在哪些网页上需要横向滚动屏幕才能查看其中的文字和图片。如果网页在 CSS 声明中使用了绝对值，或者网页使用的图片要在特定的浏览器宽度（例如 980 像素）下才能达到最佳显示效果，就会造成这种错误。要修正此类错误，请确保网页为CSS元素使用相对的宽度值和位置值，且图片可以缩放。有关详情，请参阅根据视口调整内容大小。
字体过小
这个还是我们说的CSS的问题，但是如果你的页面的字体大小是固定像素的，那么最起码，正文部分文字像素要不小于14像素，标题不小于16像素。一般字体会用CSS的 “font-size” 属性来进行调整。
此报告会列出因字体过小而导致内容模糊不清的网页。移动设备用户需要“张合双指进行缩放”，然后才能阅读这些网页上的内容。要修正此类错误，请在为网页指定视口后，将字体大小设为可在视口内适当地进行缩放。请参阅使用清晰可辨的字体大小，详细了解字体大小最佳做法。
触控元素间距过小
如果你的页面 “行间距” 是固定像素的，那么最起码，“行间距” 像素要不小于24像素，标题不小于28像素。一般 “行间距”会使用 CSS中的 “line-height” 属性进行调整。
此报告会指出哪些网站网址上的触控元素（如按钮和导航链接）间距过小，导致移动设备用户在用手指点按所需元素时，通常会按到相邻的元素。要修正此类错误，请务必为按钮和导航链接设置适合移动设备访问者使用的大小和间距。有关详情，请参阅适当调整点按目标的尺寸这篇文章。
总结：我个人推荐
为了满足谷歌的“移动设备易用性”，我个人推荐大家一个CSS关于字体，行间距的方案。正文部分，字体大小使用120%，行间距200%。标题部分，字体大小使用180%，行间距240%。图片宽度，以及窗口宽度统一100%。
当然，为了满足完美的 “移动设备易用性” 可能你的网站还需要前端工程是帮帮忙~