mobile-website-horror-movie.jpeg

您最后一次访问智能手机上的网站何时是不得不等待页面加载?

根据Akamai73%的移动用户表示,他们遇到了一个缓慢加载的网站。很多次,当用户不在WiFi并且依靠蜂窝连接时发生这种情况。

但是当网页加载需要几秒钟时,时间似乎慢慢爬行。网站加载的时间越长,我们变得越沮丧。谁能责怪我们?不应该移动网站加载速度一样快作为他们的桌面同行?

是的,他们应该。包括你的手机网站。

那么,移动网站今天是如何表演的?找到基准,Hubspot Research进行了一项研究分析了超过26,000个网站的性能。该研究不仅涂上了今天进行了多少业务的移动网站的不如此非常漂亮的图片,而且还揭示了加载时间慢的速度影响超过您的底线 - 它们影响了访客的心率。

让我们来到这项研究的一些结果,为什么加载速度缓慢是如此糟糕,以及如何更快地使您的网站变得更快。

您的移动网站是如何表演的?

机会是,它几乎不行。

根据Hubspot Research的研究,大多数网站都是不是表演得那么好。事实上,我们发现浏览这些网站的平均加载时间几乎是4秒- 本身就足以让许多游客跳跃并查看其他地方。

Website-Load-Time.png

有很多原因,为什么网站平均在研究中的性能平均获得D级。慢速加载时间的顶级贡献者之一是图像和视频。通常,这是因为没有针对网页优化图像或视频 - 尤其不是移动数据连接。

花点时间思考您可能在网站上的主页上的美丽,高分辨率图像。它只是您的品牌或产品的完美代表,不是吗?

好吧,那个图像可能看起来很好,但是它的大文件可能会导致你的网站加载缓慢,从而给你的移动用户一个糟糕的用户体验。

为什么快速加载时间很重要

在我们讨论如何让你的网站加载更快之前,让我们先讨论一下为什么快速加载时间很重要。

缓慢的加载时间给你的访问者带来压力

缓慢的加载时间会让你的网站访问者感到沮丧,影响转化率和品牌感知。但你知道它实际上会导致心率加快和压力水平吗?根据2016年爱立信的流动性研究单个网站加载延迟导致平均38%的心率增加。

很难量化心率增加38% - 特别是如果你不积极监测它。所以想想你最后一次做了一些压力,就像看恐怖电影一样。移动加载时间的延迟大致相当于您如何观看恐怖电影的方式。

慢动移动网站导致压力增加

作为营销人员,这是不是在访问我们的内容或评估我们的产品或服务时,我们希望访问者的方式。

游客可能会责备你的糟糕经历

在某些情况下,当网站访问者经历加载时间的延迟时,它们会责备他们的蜂窝提供商的糟糕服务。但延迟越长,延迟的责任就越响给您:内容提供商。

在同一爱立信的研究中,研究人员对客户进行了一项网络推广评分(NPS)调查,询问他们在什么情况下会把责任从移动服务提供商转移到内容提供商。

nps-mobile-load-times.png

对于在研究中没有延迟加载移动网站的研究中,他们的NPS分数急剧增加(4.5分),适用于他们的移动服务提供商。但经历了一些延误的客户开始归咎于服务提供商;延迟越长,他们归咎于实际提供者的越少,而且他们越多,网站本身后面的人们就越了。

慢视频似乎是最有压力的

使用大图像和背景视频已变得更多常见网站设计最近。视频是伟大的资产并为您的内容带来生命 - 但事实证明它们也可能是非常紧张的。

爱立信的研究人员发现了那个甚至在加载增加的观众的压力水平时甚至是两秒延迟的youtube视频;和一旦视频开始播放,只需一个暂停导致压力水平增加了15%:

Streaming-video-cryry.png

这种额外的压力将我们带回了那部恐怖电影——一种我们当然不希望留给游客的感觉。

知道负载时间延迟可能会影响访客的人生理,我们可以做些什么来使我们的移动网站更快,并给予他们更好的体验?

5种方式使您的移动网站更快

有很多进入网站性能,但让我们涵盖快速在您的移动网站加载中发挥作用的前五个因素。

1)确定您的移动网站是如何设置的。

你有一个单独的移动网站(如m。exampledomain..com)或者您的网站是否使用敏感设计

谷歌建议使用响应性设计作为他们的首选方法,并根据您的移动网站设置如何设置,您的团队可以调查性能优化。阅读此博客文章以了解如何为移动友好性测试您的网站

2)压缩图像。

请记住,上面提到的美丽产品或品牌形象实际上可以减慢您的网站?如果压缩该图像,则可能会耗尽页面的加载时间。由于网站通常具有大量图像,因此这通常是加载时间慢的最大原因 - 所以我们建议首先解决这个问题。

例如,假设您的产品图像显示在页面为500 x 500像素,但图像文件的实际大小为3500 x 3500像素。该图像可能重量兆字节(MB),并且在许多网站中,访问者浏览器将被迫首先加载3500像素版本的图像,然后将其正常调整到其较小版本 - 所有在加载过程中。在桌面连接上,这一切不断发生,但一般来说,它发生得很快,我们不会注意到它。

但是在移动设备上 - 特别是在蜂窝连接上 - 全尺寸图像可能需要很长时间才能加载,这可以真正挫败用户。要解决此问题,请考虑调整大小,裁剪,然后压缩你的图像。(Hubspot客户无需担心压缩其图像 - 上传到Hubspot软件的图像会自动压缩。对于非推荐客户,工具雷竞技苹果下载官方版Tinypng.将帮助您减少图像的文件大小。)

我们也推荐以JPG格式保存图像这相对轻,对你的页面有益,而且不会涂上用户的体验。

3)缩小所有代码,尤其是JavaScript。

“缩小代码”是在不影响网站功能的情况下删除不必要的字符的过程。它对处理网站代码所需的时间有重大影响,从而使您的网站在任何设备上加载速度更快,无论是桌面还是移动设备。

为了缩小代码,您可能希望网站团队或开发团队的人员参与进来,因为这确实涉及到直接更改网站上的代码。如果你能从移动版本的网页中删除一些JavaScript(或其他代码)来进一步加速,那就更好了。(要了解更多关于最小化代码的知识,从优雅的主题中查看这些说明)。

4)在背景中加载视频(或根本不)。

视频可能是你页面上最大的资源,在移动设备上加载耗时最长。如果视频对用户体验并不重要,可以考虑将其隐藏在背景中——或者根本不加载它。通过将视频隐藏在背景中,它们的加载将有助于感知你的网站加载速度快,但可能无法最终解决一个缓慢加载的移动网站的问题。

如何在后台进行视频加载?您或您的开发团队的成员可以将一些CSS插入代码中,以便当访问者在网站上的游客降落时,视频根本不会出现。

如果您的网站包含描述您的产品或服务的长视频,您可以尝试使用呼叫操作,而不是将视频直接放在网站上,因此可以将特定于移动的访问者电子邮件将视频发送给自己并查看它之后。这在近期节省了时间,并使移动体验大大面积为游客。

笔记:如果您选择为移动用户创建cta,请考虑您的文本框和图像周围的间距,以确保您的网页是清晰的,易于交互,无论您的访问者使用什么设备来访问您的页面。在小屏幕上难以与之交互的按钮可能会导致令人沮丧的用户体验。)

5)利用内容交付网络(CDN)的缓存和速度优势。

内容交付网络(CDN)帮助缓存和加载不同位置的服务器上的内容,以便无论互联网在互联网上哪里来自哪个设备,他们使用的是哪个设备,他们都会有更快的 - 更好的用户体验。如果您的网站不在CDN上,您可能会错过一些我们强烈推荐的绩效福利。

(Hubspot客户:Hubspot网站平台使用响应性设计,具有自动图像压缩,并通过我们的CDN备份,以便真正快速加载您的网站 - 因此您不需要担心这些事物。事实上,根据Yottaa的说法,一个独立的互联网绩效公司网站上的Hubspot负载速度比其他内容管理系统更raybet电子竞技快。)

营销人员有很多股份,确保我们的网站看起来很棒,但功能和表现得很好。一个快速装载的移动网站将确保您的访客不会从您的网站中反弹,并且他们不会遇到与观看恐怖电影相似的压力水平。您可以立即使用上面的提示来潜入并开始提高桌面和移动网站的性能。

新的文字-动作

最初发布于2016年2月25日7:00:00,2017年7月28日更新

话题:

移动优化