随着近年来智能手机的普及，通过移动设备浏览网站的用户越来越多，这使得我们也不得不要重视移动端的流量。（从本人的解梦小站来看，传统手机端的UC搜索已经成为搜索引擎的前几位，特别是早上，流量增长更迅速。）
谷歌也逐渐重视移动版的网站，不仅对移动端使用了专门的爬虫Google-Mobile，而且也对移动版网站的优化进行了说明。这篇文章就是研读了谷歌的《构建针对移动设备进行优化的网站》文章后的一些总结。
移动版网站的三种配置方式
针对移动端的网站一般有3种配置方式：
- 响应性网页设计，即同一网址，相同内容。
不管用户是哪种设备，PC，手机还是平板电脑，内容层的HTML全都一样，只是通过表现层的CSS来控制不同的表现形式，如在移动端和平板下会控制最大宽度，以适应屏幕显示。
- 同一网址，不同内容。
同一个网址，根据用户使用设备的不同，从而返回不同的内容。这是从服务器端控制，根据用户的身份（User-Agent，用户请求网页时提供给服务器的信息之一）来判断设备，从而提供不同的内容。
- 不同网址，不同内容。
根据设备的不同，网站呈现不同的网址，不同的内容。比如PC端为www.example.com，智能手机端为m.example.com，传统手机端为wap.example.com。通常情况下还会同时设置重定向，比如用智能手机访问www.example.com，会自动跳转到m.example.com上。
使用rel="canonical"和rel="alternate"
如使用上面第三种方式，不同的URL返回基本同样的内容，就会出现内容重复的问题，例如www.example.com/arti123.html和m.example.com/arti123.html。那怎么解决呢？rel="canonical"和rel="alternate"标签很好的解决了这个问题。
rel="canonical"和rel="alternate"是一种专门针对搜索引擎的建议，指明重复页面中的标准页面（目前谷歌，bing，百度都声明支持这个标签）。比如页面A和页面B2个相似页面，页面A是标准页面，页面B是替补页面，则页面B需要加上rel="canonical"标签，表明标准页面为A；而页面A则加上"rel="alternate"标签，说明还有个替补页面B。如：
页面A上：<link ref="alternate" href="www.example.com/B">
页面B上：<link ref="canonical" href="www.example.com/A">
桌面版网页和移动版网页跟上面的问题极其相似，通常桌面版网页为标准页面，而移动版网页为替补页面。则2类页面上可添加如下标签：
桌面版网页：<link ref="alternate" href="m.example.com/">
移动版网页：<link ref="canonical" href="www.example.com/">
另外，rel="alternate"标签还可用于站点地图中，如桌面版网页的站点地图中的代码：
<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
xmlns:xhtml="http://www.w3.org/1999/xhtml">
<url>
<loc>http://www.example.com/page-1/</loc>
<xhtml:link
rel="alternate"
media="only screen and (max-width: 640px)"
href="http://m.example.com/page-1" />
</url>
</urlset>
注：上面media="only screen and (max-width: 640px)"一行暂不理解。
网站间重定向
当在移动端使用不同的URL时（即上面第三种方式），网站一般同时还会设置重定向（即跳转），比如用户在智能手机端浏览www.example.com，会自动跳转到m.example.com，以更好的呈现页面。
Googlebot支持两种重定向设置方法：HTTP重定向和JS重定向。（具体设置过程我还没掌握。对于HTTP重定向我建议设置为302跳转，因为302含义为临时跳转，更加符合规范。）
很多网站在设置重定向时会犯同样一种错误，那就是重定向至无关地址。比如智能手机端访问www.example.com/talk/123321.html，却重定向至移动版首页m.example.com（注意：很多网站都会跳转至首页。）。用户在这种情况下忽然到达首页会感觉莫名其妙，很可能离开网页，即便不离开，也会增加访问成本。这样跳出率和最终转化率都会受影响。
另外，google还建议开放一种不使用重定向的途径，比如在智能手机端直接输入www的网址，可以不跳转正常访问。
Vary: User-Agent
谷歌强烈建议将Vary: User-Agent添加在HTTP响应头中，这个标签的含义是表明网页内容会根据User-Agent发生改变，需要在服务器端进行设置。一旦设置，就相当于给Googlebot一个信号，使其了解网站的配置，有助于更好的抓取和索引网站（适合第二，三种配置方法）。
以下截取一段HTTP内容：
请求头部：
GET /page-1 HTTP/1.1
Host: www.example.com
User-Agent: Mozilla/5.0 (Linux; Android 4.0.4; Galaxy Nexus Build/IMM76B) AppleWebKit/535.19 (KHTML, like Gecko) Chrome/18.0.1025.133 Mobile Safari/535.19
（...HTTP 请求标头的其余部分...）
响应头部：
HTTP/1.1 200 OK
Content-Type: text/html
Vary: User-Agent
Content-Length: 5710
（...HTTP 响应标头的其余部分...）零星问题
还有一些零星问题，整理如下：
- 对于平板电脑端。如果没有特别设计平板端网站，建议不要使用智能手机版网页（宽度有限），而使用桌面版网页，以最大程度上保证访问体验。
- 对于Googlebot。Googlebot有专门的移动版爬虫，具体User-Agent如下：
功能手机 Googlebot 移动版：
智能手机 Googlebot 移动版：
在上面三种配置方式中，对于Googlebot的访问，无需任何特别设定，只需按照正常的用户对待即可。
- 对于视频。由于智能手机端对flash并不是为完全支持，因此建议改为HTML5版的视频播放。
后记
- 因为本人未完全实际操作以上设置，对原文理解不够深入，细节部分掌握不够准确，如有问题，还望不吝赐教。
- 如需完整，深入的了解内容，请看谷歌原文：https://developers.google.com/webmasters/smartphone-sites/。
- 图片故事：2011年Google手机版截图，很多人抱怨头部导航占据了太多的空间。也是同期，Google在桌面版刚换上黑色导航栏。
图片摘自http://www.seroundtable.com/google-mobile-top-bar-13658.html