移动端网站SEO优化该怎样做?

过去几个月在问答社区回答了一些关于移动端网站优化问题,发现很多移动SEO的问题涉及到用哪种架构做移动站。不少SEO貌似对独立移动站,也就是单独的m.domain站有不小的执念,认为独立移动站才是效果最好的。

问答后台看到另一位读者“一条爱做梦的咸鱼”,也是问“新网站做移动SEO,使用m站还是响应式?”:

您好,我在某个回答中看到了你的回答,有一些疑惑,您建议:“新网站,或者刚刚要做移动SEO的,最好就直接采取响应式了。”,为什么直接采取响应式呢,我自己的感觉是目前移动搜索排靠前的都是m站较多

翻看了一下以前写的关于移动SEO的帖子,才发现移动端SEO到底应该选哪种方式优化还没有仔细写过。今天的帖子就深入探讨一下怎样选择移动优化的三种方式。

移动优化的三种方式

移动网站大体上有三种方式可以选择:

响应式设计(responsive design):

PC站和移动站的URL是完全一样的(不管用什么设备访问都一样),返回给浏览器的HTML代码也是一样的,不同宽度的屏幕排版不同是通过CSS控制的。以前也经常称为自适应设计,就是因为排版是根据屏幕宽度自动适应的。

动态服务(dynamic serving):

PC站和移动站的URL是完全一样的,这点和响应式设计相同,但动态服务方式返回给浏览器的HTML代码(以及CSS)是不一样的,PC设备得到的HTML代码是PC版,移动设备得到的HTML代码是专门做了移动优化的移动版本。

独立移动站(separate m. site) :

移动站的URL和PC站是不一样的,通常用单独的子域名,比如PC站是www.seozac.com,移动站是m.seozac.com,当然移动站的HTML代码(以及CSS)与PC站也是不一样的,是专门做了移动优化的。换句话说,这种方式下,移动站就是个独立的网站。

这三种方式各有各的特点。

响应式设计

既然URL一样,所有设备得到的 HTML代码也一样,好处显而易见:简单明了,搜索引擎不会被弄糊涂。搜索引擎抓取、索引一套页面就行了,提高索引效率,尤其对大网站,抓取份额浪费在多个URL上,就意味着降低深层页面被抓取的机会。自适应设计只有一个URL,链接、权重计算都集中在一个URL上,不会出问题。

用户也不会被弄糊涂,收藏书签、分享页面也不会因为URL的不同而出问题。

站长方面开发维护一套代码就可以了,后端开发成本相对低一些。建设的外链也集中在一个URL上。不需要判断设备、浏览器类型,也不需要转向,也就不会出错。

当然也有坏处。比如,移动设备由于屏幕大小的关系,经常要隐藏一些内容和功能,但还是需要下载完整的HTML代码,经常还包括图片,所以会浪费带宽。手机网速慢的话,多下载文件就意味着速度变慢。而且,同一套代码要在所有设备显示正常,还要尽快开始渲染,前端设计需要比较高的水平。

响应式设计的页面必须设置viewport,告诉浏览器按照屏幕宽度自动调整页面排版:

<meta name=”viewport” content=”width=device-width, initial-scale=1.0″>

虽然有缺点,但随着移动网速、手机性能的提高,响应式的缺点逐渐显得没那么致命,而它的简捷性就更显优势了。所以,响应式设计是今后的方向,是大势所趋。这也就是为什么我建议新网站,或者刚刚要做移动SEO的网站,肯定直接就做响应式了,不用考虑其它选项。(除非贵公司不差钱,可以考虑动态服务。)

独立移动站

和响应式设计相比,独立移动站显然开发成本要提高,要开发维护两套代码。随着国内人力成本提高,需要重复做的事情会越来越不划算。

独立移动站的更大潜在麻烦是URL的不同可能造成混乱和各种出错。比如,既然移动和PC版本URL不同,搜索引擎就需要建立对应关系,必须判断PC页面对应的移动版本URL是什么,移动页面对应的PC版本URL是什么。网站需要在页面添加代码帮助搜索引擎判断:

PC页面需要加下面代码指明移动版本位置:

<link rel=”alternate” media=”only screen and (max-width: 640px)” href=”https://m.seozac.com/”>

对应的移动页面需要加下面代码指明PC版本位置:

<link rel=”canonical” href=”https://www.seozac.com/”>

在搜索引擎两个版本都抓取了、并且正确判断的情况下,PC和移动版本就建立了一一对应关系。但是,如果站长把标签加错了怎么办?搜索引擎只抓取了一个版本怎么办?搜索引擎没有准确解析<link ref>标签怎么办?

而且,要建立一一对应关系,需要PC版本和移动版本主体内容是一样的。很多时候m.移动版本页面内容精减或修改过多,搜索引擎认为内容不相符怎么办?甚至有的时候独立移动站只建了部分页面,很多PC页面没有对应移动页面又怎么办?

网站有两个版本,用户在添加书签、分享链接时,不可避免地会有一部分指向PC页面URL,一部分指向移动URL,链接权重将分散。

通常,为了用户体验和帮助搜索引擎判断对应关系,网站需要做符合规则的转向:

  • PC用户由于某种原因访问了移动URL的话,需要被自动301转向到PC版本URL
  • 移动用户由于某种原因访问了PC页面URL的话,需要被自动301转向到移动URL

301转向一般是服务器端做的,首先就需要根据浏览器用户代理匹配特征字符串判断用户设备和浏览器类型,上网设备和浏览器五花八门,程序100%检测正确不是件容易的事。判断出错,用户可能就只能看到一个排版错误的页面,甚至某些功能都无法使用。搜索引擎蜘蛛也可能被判断错,导致不能建立两个版本的对应关系。

大公司需要用子域名做多语言网站SEO的话,加上m.独立移动站,就会使管理子域名更加复杂,因为网站又要增加:

  • sg.seozac.com
  • m.sg.seozac.com
  • cn.seozac.com
  • m.cn.seozac.com

等等。多语言hreflang标签和独立移动站的<link ref>标签排列组合起来,哪个对应哪个不能弄错了。如果再加上Google AMP百度MIP页面版本,所有版本之间的对应关系和标签写法,可能会把人绕晕倒。

动态服务

动态服务和独立移动站一样,首先在服务器端判断设备和浏览器类型,然后在同样的URL上、根据浏览器屏幕宽度返回不同的HTML和CSS代码。

所以动态服务方法相当于把响应式设计和独立移动站的优点结合起来了,即有URL统一的简洁明了,又有独立移动站的代码优化,SEO效果是最好的。当然,代价是前后端成本都要提高。

对不差钱的公司来说,动态内容是最佳选择,比如amazon现在就是用动态服务做移动优化的,URL统一简单,不会出错,两个版本的代码还可以分别优化,据说,亚马逊移动版本节省了40%的文件下载量,对手机用户来说,页面打开速度的提升是至关重要的 。

是否使用动态服务要看公司情况。对大部分网站来说,页面内容、排版、功能没那么复杂,响应式设计已经满足需要,用高成本实现动态服务,节省的下载量没那么明显,比如SEO每天一贴这种博客,还有大量内容型网站,页面连个图片都没有,除了留言也没有别的交互,那是一点下载都节省不了,动态服务就没意义了。

搜索引擎蜘蛛访问动态服务的页面时,从HTML代码是无法自动知道不同浏览器得到的代码将会是不同的。比如PC蜘蛛访问时,得到的是PC版代码,但蜘蛛并不必然知道移动蜘蛛来访问的话会得到不同的代码,所以服务器端需要通过Vary HTTP头信息告诉搜索引擎蜘蛛,PC蜘蛛和移动蜘蛛得到的代码是不一样的,两个蜘蛛都要来访问一下。比如amazon.com页面的服务器头信息:

< Content-Type: text/html

< Content-Length: 6400

< Connection: keep-alive

< Server: Server

< Date: Sat, 27 Jul 2019 16:42:45 GMT

< Vary: Content-Type,Host,Cookie,Accept-Encoding,X-Amzn-CDN-Cache,X-Amzn-AX-Treatment,User-Agent

< Edge-Control: no-store

< x-amz-rid: KH589YRZC8QEW3QEWGKD

< X-Cache: Error from cloudfront

< Via: 1.1 1b52a5dd431f9e3c81753e61dfdf467a.cloudfront.net (CloudFront)

< X-Amz-Cf-Pop: SFO9

< X-Amz-Cf-Id: 0qtVw99a2_AustEZ-dxC_cs9hfVzyll-DmHnmWFDtBSWKtinpxhB2Q==

其中Vary那行就是通知浏览器/蜘蛛,根据后面列的情况不同,HTML代码是不同的,Vary: User-Agent指的就是根据浏览器用户代理的不同,HTML代码是不同的。

对独立移动站的执念来自何处

很多公司和站长对独立移动站情有独钟,认为m.移动站SEO效果是最好的,做新网站还要做独立m.站。这个执念可能来自两方面。

一是以前百度更建议独立移动站,我在2015年厦门百度之夜的帖子中说明过这一点。但现在4年过去了,百度现在的正式官方态度我没有看到,但两年前百度搜索主任架构师谭待明确跟我说过,百度也认为响应式设计是未来趋势,百度也推荐转向响应式设计。我的观察是,百度现在对响应式设计的支持没有问题。

Google一直以来就是推荐响应式设计的。

当然,这里说的推荐,并不是说响应式比独立移动站的SEO效果更好,而只是表明,百度和Google对三种方法是一视同仁的,排名上并不偏向哪一个,SEO效果是一样的。既然效果一样,当然推荐那个简单便宜的了。

第二个原因,就如开头读者说的,目前在百度移动搜索排名靠前的m站较多。这是个准确的观察,确实百度移动搜索结果中排名好的m站很多,在不少行业,m.站排在前面的占大部分。不过,这并不必然说明m.独立移动站有SEO优势,我觉得这更多是采样偏差造成的。

举个例子,数据表明,车祸发生大部分是男性司机造成的,不过这是否说明男司机开车有劣势呢?恐怕不能这么认为,因为必须考虑路上司机的男女比例,很可能开车的80%是男的,造成了70%的车祸,所以70%车祸是男司机造成,不能说明男司机开车水平比女司机差。

移动搜索排名也是同样道理。现在排名靠前的m.站居多,很可能这些站绝大部分是老站(所以才排名能力高嘛),而几乎所有老站当初开始做移动SEO时都是从m站入手的,不到万不得已,这些使用m站的老站不会去改为响应式设计,因为改动太大了,冒险,又没有明显好处(如前所说,三种方式SEO效果一样的),没有动力改。

所以,老站、大站排名好,而老站、大站又以m站为主,所以我们就看见m站排名好了。但这不说明一个新站就要学着做m站啊。

作者: Zac@SEO每天一贴
版权属于: 中新虚拟主机
版权所有。转载时必须以链接形式注明作者和原始出处及本声明。

42 条评论 “移动端网站SEO优化该怎样做?

  1. 个人推荐自适应设计,简单方便。博客系统套一个自适应模板即可,多简单啊!还非要搞个独立站点干嘛?完全没有必要的。在说了你搞个独立站点话,那么就是相当于是个新站了,外链和权重都要从零开始。

  2. 受益匪浅
    一直蹲守这,坐等大佬更新
    看了之前的帖子
    学到PC端和移动端的优化有不少相同的优化操作
    想学学移动端相对PC端有哪些不一样的操作
    求翻牌子~-~

  3. 随着时间的推移我也觉得单独做一个手机站真是浪费时间,以前1是百度推荐做一个m的站点,2是开发一个响应式的还是比较费劲,尤其是我这种通过源代码改过(当时源代码就没有手机站版本),且我是个人站长,综合比较开发一个m的站点比改成一个响应式的站点更费钱,所以就单独做了一个m站点。

    现在觉得做一个自适应的响应式站点就行,从长远的成本考虑还是响应式省钱,维护简单,且seo成本最低,权重会更集中,永远不用考虑你发外链或者给用户分享的时候,他使用的是什么设备。

    对于老站现在大家都不考虑做响应式的,一个最主要原因我认为m站点已经有权重,百度已经可以很好的认知哪个是移动站哪个是pc站,何必要在掏钱开发,大家对网址的记忆越来越淡薄,无所谓了。

  4. 这里贴一段谷歌站长官方博客5月份发的文章关于独立移动端还是响应网站好的句子:
    While we continue to support responsive web design, dynamic serving, and separate mobile URLs for mobile websites, we recommend responsive web design for new websites. Because of issues and confusion we’ve seen from separate mobile URLs over the years, both from search engines and users, we recommend using a single URL for both desktop and mobile websites.
    大体意思就是说我们支持响应式网站,动态网站还有m独立网站,但是我们推荐使用响应式设计网站,因为过去几年我们发现m独立站点存在很多问题和疑惑,我们推荐移动端和PC端使用一个URL。

    我个人认为使用一套代码,一个URL方便蜘蛛判断和抓取,而且还能节省物力人力。

  5. 我们公司不一样,以前的老站点都是用的域名下面的目录,/4g/作为移动端,检测到手机端打开,自动跳转到4g目录,内页技术问题做不到,基本只有首页收录,后来用了响应式后,发现还是有问题,百度转码太厉害,很多页面图片读取不到,因为用到很多js效果,就很纠结了。

    1. 不一定,和网站大小关系不大,是看网站功能、复杂程度,纯信息类网站,用动态加载没什么意义,因为很可能和响应式的代码没什么大区别。

  6. 我也是用的WP的自适应网站,但是主站点电脑端在Google page speed评分有80分以上,移动端的速度就只有30多分了。要怎么来提高移动端的加载速度?

    1. 你理解错误,这个响应式的也不是说手机浏览看起来就不好,而是自适应的,排版上都有不一样,符合用户体验的效果,唯一区别是用来一套代码,而独立的是两套代码

    2. 字体或栏目适合手机浏览,和是不是在独立子域名上没有任何关系,自适应也是根据你的设计排版的,你设计什么样就是什么样,可以和独立子域名设计的一模一样。

  7. 个人站建那么多根本管理不过来,响应式模板维护成本更低,跟大站硬刚怎么都刚不过,只能吃剩饭

    1. 从长远看很好,如果对站点的未来不明朗不知道要做多久,也可能效果不好就放弃了的话,那建立独立站点,是唯一首选考虑,这个早期成本会很便宜(相比较而言)

  8. 惨…..早点看到我开发自己网站就用那个动态服务模式了,现在是用的独立移动站,,,,另外独立移动站感觉不能用301或是302在两种设备间跳转,我本来是302跳转,谷歌收录出现了PC域名收录的是移动页面的情况,链接是pc的,内容是移动端的,现在已经换成了js跳转了,不知道会不会有问题。

  9. 很棒,总结的太好了,响应式,M站,动态服务我都用过,目前我的网站用的是动态服务,一套链接,两个网页版本,PC返回PC版本,移动返回移动版本,经过测试,在百度上和其他方式没太大区别,但在搜狗和神马上,动态服务和响应式的排名明显比M站更好,当然,这只是几个网站的数据,并不能就此说明全网,就好比文中说的一样,注意样本偏差。

留个言呗:

您的邮箱不会被显示在页面上。标有*的是必填项。