干货丨 落地页优化——落地页性能优化

干货丨 落地页优化——落地页性能优化

欢迎大家继续关注LPO系列教程的第三弹,这篇文章聚焦的是落地页性能的优化问题。

 

须知落地页也不过就是网站上的一个网页,所以要想知道什么是落地页的性能,必须得知道网站的性能的定义是什么,而网站的性能的定义如下:

 

整个定义可能会让互联网知识稍微匮乏一点点的小伙伴们一头雾水,那么我们就从几个关键点来解释下在我们的肉眼看到落地页的内容呈现(display)之前,到底发生了什么。

首先是网站域名的作用,域名是上网单位的名称,是一个通过计算机登上网络的单位在该网中的地址。一个公司如果希望在网络上建立自己的主页,就必须取得一个域名,域名也是由若干部分组成,包括数字和字母。某种意义上来说,域名就是IP地址的“面具”,因为域名主体可以是有意义的单词或拼音,可以让IP地址变得更加地好记和好认,通常情况下域名是越短越好的,但也不排除有个别奇葩域名,例如百度当年就曾就有这样一个超长的域名:

 

人们习惯记忆域名,但机器间互相只认IP地址,域名与IP地址之间是多对一的关系,一个IP地址不一定只对应一个域名,但一个域名只可以对应一个IP地址,它们之间的转换工作就称为域名解析(DNS解析),域名解析需要由专门的域名解析服务器来完成,目的就是为了把域名和IP地址连接起来,整个过程是自动进行的。

当你的网站制作完成后上传到你的虚拟主机时,你可以直接在浏览器中输入IP地址浏览你的网站,也可以输入域名查询你的网站,虽然得出的内容是一样的但是调用的过程不一样,输入IP地址是直接从主机上调用内容,输入域名是通过域名解析服务器指向对应的主机的IP地址,再从主机调用网站的内容。

而这个调用网站内容的请求需要目标服务器进行处理,在处理完成之后,将内容返回给浏览器,经过渲染(从模型生成图像的过程)之后才能真正地显示给用户。

这所有的一系列过程都是我们看到网站内容之前发生的,而这一过程的时间当然是越短越好,毕竟“天下武功,唯快不破”。

一旦网站打开的速度过慢,对于用户体验的伤害自然是极大的。

而且对于大型的网站,过慢的加载时间会直接导致真金白银的经济损失,亚马逊就曾经说过:

 

既然网站的打开速度如此的重要,那么我们要如何去查看网站的这一重要性能指标呢?当然有办法,最简单的方式就是使用类似Ptengine这样的工具,例如在Ptengine的数据中心的右下角,就能够非常直接了当地看到一段时间的网站页面平均加载时间,通常情况下这个平均加载时间是毫秒级的:

 

例如这个例子中的平均加载时间就是508毫秒,那么这段时间是不是很短呢?其实也不算非常短,因为人眨一次眼睛的时间大概是300毫秒,所以500多毫秒是要长过”眨眼间“的速度的,已经是数据肉眼能够感知的了,而且还有一点就是:

 

显示时间是一个不严谨的概念,大致就是我们肉眼看到网页内容的时间,而这个时间通常是要比加载时间更长的,所以很多小伙伴为了更好地衡量落地页的打开速度,开始去寻找和衡量更多的页面打开速度相关的指标。

这里给大家介绍除加载时间之外的其他指标,第一个就是:

 

关键帧时间和肉眼看到网页内容的时间非常接近,这个时间最好不要超过5秒,除了关键帧时间之外,还有:

 

首字节时间就需要更短了,因为它比较靠前,所以最好在200毫秒以内,还有:

 

开始渲染时间最好不要超过2秒。最后一个是:

 

资源请求数最好不要超过40,否则这些时间加在一起,就会导致关键帧时间(显示时间)非常的长了。

接下来就要说到如何提升网站的性能了,要想知道如何提升性能,还要再从底层代码的层面捋一遍网页出现的过程,然后我们看下哪些环节是我们能够干预的,下图就是代码层面网页呈现的过程:

 

HTML(超级文本标记语言)是为“网页创建和其它可在网页浏览器中看到的信息”设计的一种标记语言,DOM(文档对象模型,Document Object Model)是W3C组织推荐的处理可扩展标志语言的标准编程接口。在网页上,组织页面(或文档)的对象被组织在一个树形结构中,用来表示文档中对象的标准模型就称为DOM。在HTML转化成DOM这个模型之后,CSS(层叠样式表,Cascading Style Sheets)代码也转化成CSSOM这个模型,然后两种模型生成渲染树,所有视觉信息都在这个渲染树里。生成布局将所有节点进行平面合成之后,布局就被绘制在屏幕上,用户也就看到网页的内容了。而为了提升网页打开的速度,我们能通过优化干预的其实就是后面两个步骤。

那么具体可以优化的方式,这里也给大家罗列除了一些小tips:

 

以上就是关于如何优化落地页性能问题的一些思考,希望对大家能够有所帮助,欢迎大家指正和建议。

 

 

附:

LPO课程架构全目录预览

第一课 落地页制作的从0到1

1.1 内容流

1.2 体验流

1.3 数据流

1.4 制作落地页的三位一体

 

第二课 落地页建设工作流程优化

2.1 落地页建设工作流程优化之人员优化

2.2 落地页建设工作流程优化之团队优化

2.3 落地页建设工作流程优化之项目管理优化

2.4 落地页建设工作流程优化之SOP

2.5 落地页建设工作流程优化之checklist

2.6 如何加速落地页建设相关决策进程

 

第三课 落地页性能优化

3.1 落地页性能关键指标之关键帧时间

3.2 落地页性能关键指标之首字节时间

3.3 落地页性能关键指标之开始渲染时间

3.4 落地页性能关键指标之资源请求数

3.5 如何提升落地页性能

 

第四课 落地页内容优化

4.1 落地页内容优化八字诀之专

4.2 落地页内容优化八字诀之形

4.3 落地页内容优化八字诀之权

4.4 落地页内容优化八字诀之曝

4.5 落地页内容优化八字诀之诱

4.6 落地页内容优化八字诀之独

4.7 落地页内容优化八字诀之细

4.8 落地页内容优化八字诀之时

 

第五课 落地页设计优化

5.1 落地页设计重大错误之模糊的行动号召(CTA)

5.2 落地页设计重大错误之选择障碍

5.3 落地页设计重大错误之视觉分散

5.4 落地页设计重大错误之挂羊头卖狗肉

5.5 落地页设计重大错误之文字太多

5.6 落地页设计重大错误之表单过长

5.7 落地页设计重大错误之缺少信任和信誉

5.8 落地页设计重大错误之不符合平台规则

 

第六课 落地页监测分析

6.1 Web分析

6.2 可视化分析

6.3 反馈和调查分析

6.4 网站性能分析

6.5 竞争分析

6.6 可用性测试

6.7 电子邮件增强工具

6.8 营销工具制作落地页的利与弊

 

第七课 落地页A/B测试

7.1 方法论大于创意

7.2 通过A/B测试提高落地页转化率的方法论

7.3 落地页A/B测试之调查阶段

7.4 落地页A/B测试之假设提出

7.5 落地页A/B测试之假设优先级

7.6 落地页A/B测试之测试

7.7 落地页A/B测试之分析

7.8 落地页A/B测试之PDCA

 

第八课 如何借助Ptengine优化落地页

8.1 Ptengine优化落地页方法论-CLUE

8.2 Ptengine优化落地页案例

发表评论

电子邮件地址不会被公开。 必填项已用*标注