外贸网站移动终端优化分析

文章来源:优帮云SEO 2021-06-03

自2015年推出所谓的mobilegeddon以来,移动设备的重要性与日俱增,网站移动优化已经成为一个必须关注的问题,从事 SEO优化工作的学生必须考虑环境的变化,从而对相应的项目进行相关操作。在移动优先索引的世界里,只有在移动设备上提供良好用户体验的网站才能受到百度搜索引擎的青睐。这意味着该页面必须是移动友好的和打开速度更快。我们可以通过几种不同的方式将移动功能引入到网站中,如子域、RWD、动态服务等。

1、 为什么网站要适应移动设备?

日前,杰克根据相关权威数据撰写了一篇题为《百度浏览器使用年度报告》的文章。文章中我们可以看到,2019年,百度浏览器移动端的使用概率将达到70%,而PC端的使用概率仅为30%。不用说,单凭这些数据就足以凸显移动设备在浏览器市场份额中的重要性!因此,我们应该尽力优化我们网站的内容,以更好地适应移动设备的内容可见性。

因此,我们需要考虑两个非常重要的问题:

1因为网站内容基本上都是在PC端设计和编辑的,PC端设备的显示宽度与移动端完全不同,PC端的内容怎么能在移动端呈现呢?所谓的自适应主题真的那么好吗!

2PC端使用的网络信号大多为100兆,网速稳定,网页打开速度快,而很多移动终端使用的是3G和4G网络,会受到外部环境的影响,那么如何优化移动终端的速度来提高呢?

我们不要急于回答这两个问题。首先,我们来看看市场上主流的三种移动终端优化方法:响应式设计(RWD)、动态服务(dynamic service)和移动终端域(subdomian)

2、 三种移动终端优化方法的优缺点

优势:

缺点:

然而,使用单独的移动子域也带来了许多问题。因为网站的每个页面都有一份文本,所以您需要找到一个防止重复内容的解决方案。另外,还需要想办法将合适的页面版本传递给特定的用户,否则很容易造成用户的阅读困惑和内容识别矛盾!

解决方案:

在百度的官方文件中,明确指出如果遇到上述问题——要标记移动页面,需要在页面代码中同时使用rel=canonical和rel=alternate属性。在PC端,您应该添加rel=alternate标记,它将指示给定页面的移动等价物。附加媒体标签描述rel=alternate链接中指示的设备的属性

杰克先生,让我们给学生们增加一些知识

1它可以将网站的PC页面指向移动页面,告诉搜索引擎你的PC页面有相应的移动页面,有助于移动搜索引擎向移动设备用户提供相应的移动页面;

2它可以告诉搜索引擎网站的RSS聚合内容和sitemap站点地图的位置,有助于搜索引擎抓取web内容;

三、它可以用来选择不同CSS样式表文件之间的切换控制效果

link标签的rel=“alternate”属性被添加到网页的head区域,即head和/head之间。

用法1:移动搜索适应网站的移动版本

响应式页面设计技术的引入,彻底改变了内容传递方式,真正提升了移动用户的用户体验。RWD意味着你的网站内容将在不同的显示设备之间进行转换,以便根据不同设备的显示宽度来调整布局和分辨率。根据设备的宽度,相同的HTML代码将提供给手机和桌面,而CSS将决定呈现页面的适当方式。

响应式设计的优点:

在每个页面的头文件中添加以下代码后,metaname=“viewport”content=“width=device width,initial scale=1”,学生不需要为每个页面部署特殊的移动设备显示效果版本,这为您节省了大量的机械化劳动。

响应式设计的缺点:

由于设计的需要,PC端的一些内容可能会与不同部分的内容重叠,这意味着div的边距和填充将与初始值有很大的不同。因为这些设置是用代码参数进行的,所以在PC端显示它们是没有问题的。但是,当它们显示在移动端时,由于边距和填充的参数没有改变,所以在显示移动端时它们没有改变,很可能是放错了位置!

三、动态服务

我不知道学生们是否听说过bootstrap框架。这是twitter推出的前端网页构建框架,能够很好地适应前端内容在不同显示设备上的显示,特别是移动内容的加载速度。Bootstrap框架采用12网格内容构建技术,通过代码监控不同显示设备的宽度来显示内容。

动态服务的优势:

响应时间快,无论是在移动终端还是PC终端都能很快的显示出网站页面的内容,如果优化效果更好,基本上页面都能达到秒级的效果。此外,所呈现的内容能够更好地适应移动终端设备的宽度,并且在上述两种方式中不会存在显示缺陷

动态服务的缺点:

需要有一些前端设计代码的基础知识,其中强调CSS代码的使用。因为在bootstrap框架下,很多原来的CSS代码都被重新编辑过,学生需要根据自己网站的实际情况进行设计。否则,显示的前端内容将放错位置。

最后,还有一项技术我需要在这里简单提及,它是由百度正式提出的。AMP页面的超常速度部分是因为Google缓存了加速页面,这样它们就可以通过自己的服务器非常快速地交付。Amp技术可以大大提高移动端页面的加载速度,但这种效果是通过牺牲一定的JavaScript效果来实现的。Amp页面是用特殊的HTML、JS库和CSS代码构建的,它们受到严格限制,以确保可靠的性能。但是,这些函数的局限性是很多人无法接受的,因此有一定代码基础的学生会选择使用bootstrap和其他框架来重建页面的内容!


本文标签:移动网站优化排名