随着手机的普及，目前手机端的流量越来越大，很多站长开始重视移动端的优化，做好移动端优化，移动适配是非常重要的一步，最近翻阅了不少资料，也分析了几个网站，发现一般网站比较常用的pc和移动端跳转有几种方式：

1，响应式布局

这种一般是比较常见的跳转方式，意在实现不同屏幕分辨率的终端上浏览网页的不同展示方式，pc和移动用的是同一套html代码且网址是同一个网址。

下面这行代码一般放在标签里面，目的是告诉浏览器，使用设备的宽度作为视图宽度并禁止初始的缩放；

网页样式一般在css中调整，用@media screen and (max-width: 980px) {}这种形式，意思是屏幕宽度小于980px时使用{}里面的样式，这种响应式布局，宽度常采用百分比的形式，如果害怕图片变形，可以使用{width：auto；max-width：100%}。

2，跳转适配

这种一般也比较常见，站长在做优化时，会有www和m两个站，一个pc一个移动，用户在访问网站时，检测当前所用设备，跳转到对应的网址，pc和移动用的是不同代码且网址也不同。

在pc版网页上，添加指向对应移动版网址的特殊链接 rel="alternate" 标记。

在移动版网页上，添加指向对应pc版网址的链接 rel="canonical" 标记。

例如，假设pc版网址为http://www.abc.com/id.html，且对应的移动版网址为 http:/m.abc.com/id.html，那么在pc版网页上，添加：

而在移动版网页上，添加:

3，代码适配

这种方法比较复杂，一般的话是比较大型的网站会使用的跳转方法，网站是使用的同一网址，但是根据访问端口的不同，返回不同的代码，如果是电脑端，就会返回电脑端的代码，如果是yd端，返回的代码就又不同了。

这种方法会需要添加Vary HTTP 标头，其作用借用百度文档里的解释：

1、它会向百度传递一个信号，表示说这是个代码适配的站点，百度就会尽快把网站抓取一遍进行适配；

2、它可以防止用户接收到错误的网页缓存。

这部分是在网站的服务器上进行的，有可能是 Nginx,Apache, IIS 等， 需要在服务器的配置里，设置 Varyheader 为 Vary:Accept-Encoding, User-Agent

为了让百度蜘蛛更好识别是PC站还是移动站，百度可以通过基本html特征来判断是否适合无线端浏览。方法如下：

代码放在标签里面

如果是PC站，代码为：

如果是手机移动站，代码为：

响应式网页可标识：

注意：关于移动适配，百度不建议使用js实现pc和移动间的跳转

本文部分资料来源于网络，若存在理解偏差、知识点错误可与我联系，谢谢！