• 注册
  • 查看作者
  • 谷歌移动端网站SEO优化该怎样做?

    随着互联网不断发展和现在科技的提升,各种移动设备越来越多,人们不在局限于PC端,现在75%都是通过移动端设备搜索和浏览,那么我们现在的移动端是否符合搜索引擎的规则呢?作为SEOer的我们又该如何优化,Ueeshop跟大家一起来看看谷歌移动端SEO优化如何做。

     

    一、谷歌推进优先移动优先索引

     

    谷歌在近日又进一步的实施“移动优先索引”,谷歌将此方案扩大到更多的移动端好的网站。越来越多的人使用移动设备,对于以后来讲,移动优先索引可能是必然的趋势。

     

    谷歌其实在2016年的时候就有提出,无论是PC端、平板端、移动端的排名都是以移动端的排名为基础,谷歌对于这一实施的早前表现还比较满意,已经开始对那些移动端最好的网站采用了“移动优先索引”。

    二、移动端与PC端的区别表现

     

    1.排名区别:首先我们可以确认移动端的排名是落后于PC端的,因为我们使用百度客户端的时候,通过搜索关键词出现的网站都会被百度转码,然而PC端的网站百度是不能进行转码的。如果想要在移动端的网站排名靠前,那么你的网站就必须要有超越同行,拥有优质的移动端网站,这样的网站才会更快的让蜘蛛适应和抓取。

     

    2.相关搜索:移动端和PC端的相关搜索是不一样,认真观察手机的朋友会发现移动端还多出了一个推荐,那就是“其他人还在搜”,在网页的中间。同时,移动端的搜索结果是依靠手机或平板电脑的用户搜索习惯推荐的,移动端的搜索结果和相关推荐比PC端的更加精准,这一优点有利于商家投放移动端的广告。

     

    3.设备区别:在这里就不多说,相信大家都知道,PC端与移动端的尺寸不一样,还有手机的品牌以及兼容性。

     

    4.用户习惯:首先PC端主要是使用鼠标和键盘,而移动端主要使用的是触屏,并且移动端的屏幕较小,页面不要设计的太复杂,太繁琐,这样会影响用户的体验度。

     

    5.网速区别:移动端打开的网页速度绝对没有PC端的打开速度快,建议移动端不要添加过多的动画或大量的图片,如果要添加,尽量把他们都处理过,减少图片内存、压缩等。

     

    三、关于移动端的优化

     

    1.不要使用FLASH或JAVA:假如使用了这些功能,那么给个用户造成很大的流量,浪费用户的时间。对于搜索引擎来讲根本不理解这种功能。还有不论是苹果系统,还是安卓系统,他们是不支持其中的某一个功能,这样会给用带来不良的用户体验度,影响网页加载速度,浪费用户流量。

     

    2.URL规范化:如何才能规范URL,a.不能有多余的字符;b.缺少字符串;c.含有扩充字符;d.查询变量顺序混用等等。

     

    在这里不需要过多的废话一下,来解析一下这个URL到底是个什么东西,不要认识SEO这么久,连URL是什么都不知道。

     

    /——就是所谓的根目录,通过网站名可以找到服务器,再通过服务器存放网页的根目录。

     

    article ——这是根目录下默认的网页,我们有不懂得页面去百度搜索问题,不管是搜索什么问题,它的后面都会出现这个默认网页。

     

    链接——这个网址就叫做URL,

     

    3.PC端与移动端的相互切换:不论是在PC端还是移动端的网站上面都需要有相应的导航或提示的链接,让用户方便的浏览,同时也便于搜索引擎的抓取。

     

    4.页面规划:移动端与PC端最大的区别还是在于屏幕的尺寸大小,那么我们就需要考虑网页的复杂程度,以及广告占位,弹窗,动画,图片大小,网页加载速度等多方面去考虑。移动端要遵守简洁、清晰、明了的原则。

    ————————————————

    版权声明:本文为CSDN博主「Ueeshop」的原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接及本声明。

    原文链接: 链接

    移动优化的三种方式

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

    响应式设计(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=” 链接”>

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

    <link rel=”canonical” href=” 链接”>

    在搜索引擎两个版本都抓取了、并且正确判断的情况下,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代码是不同的。

    快速优化移动端网站,提高Google免费流量,所以下面的相关操作及介绍和Google密切相关,如何你还是打不开Google的小伙伴,请先阅读《如何安装谷歌访问助手,轻松访问谷歌(实操)》一文,助你快速访问Google。

    一. 单个网页测试

    1. 打开: 链接,进行移动设备适合性测试;

    2. 输入你的网站 – 运行测试;

    3. 查看结果。

    二. 整个网站测试

    1. 先在Google Search Console,就是我们常说的谷歌站长工具中验证网站所有权,也就是你的网站上有没有安装Google Search Console代码,确定您对该网站是否具有所有权;

    2. Google Search Console – 增强功能 – 移动设备易用性

    三. 根据报告优化

    根据“移动设备易用性”报告提示来进行优化。

    1. 使用了不兼容的插件

    说明网页中可能包含了大多数移动设备浏览器不支持的插件(例如Flash)。

    解决办法:删掉Flash,或者使用HTML5来代替即可。

    2. 未设置端视口

    网页未定义viewport属性,该属性用于指示浏览器根据设备屏幕大小来自动调整网页大小或缩放网页)。

    解决办法:将下面的代码插入的<head>标签中即可。

    1. #资讯

  • 0
  • 0
  • 0
  • 148
  • 请登录之后再进行评论

    登录
  • 单栏布局 侧栏位置: