许多在线网路商店经常面临购物车放弃问题,影响整体业务,投资回报率降低,品牌价值下降。如果您的Magento网上商店在不到3秒内载入,那么您的网站已经是高性能的。
如果您的网站需要更长的时间加载会怎么样?有什么影响?本文将把您的所有后顾之忧,因为我们引导您沿着前端Magento网站设计和开发中的一些可靠的解决方案,提高您的整体性能,并为您提供一贯性能优化的网络商店,客户将会喜欢。
缓慢加载网站吸引更少的客户。目前,18%的购物者放弃购物车,而不进行任何购买,因为他们对一个缓慢的加载网站感到沮丧。这些缓慢的网站也不在Google最喜爱的列表或任何其他搜索引擎上,并且减少了获得索引的机会。
现在,您如何增加Magento网站的效能,以获得更好的结果?
在Magento网站上呈现优化的网站页面的四个重要方面包括:
减少HTTP请求的数量
优化JavaScript
优化CSS
优化图像
下面,我们详细介绍如何通过有效的前端网站设计解决方案来克服这些障碍,从而实现最佳的Magento性能,并提升您的销售数据。
减少HTTP请求的数量
加载网页时,页面上的每个样式表,脚本和图像都必须从浏览器到Web服务器进行单独的往返,才能正确显示。因此,由于每个组件在服务器和浏览器(HTTP请求)之间来回移动所需的延迟时间,因此加载页面的速度会延迟,从而导致用户交互的障碍。
为了克服这种延迟并减少HTTP请求的数量,一个有效的拇指规则是将所有脚本和CSS文件合并到尽可能少的文件中,以减少请求的总数,而不是不同地执行每个HTTP请求。但是,如果组件因页面而异,这将变得乏味。
在Magento中合并CSS文件
1.登录管理面板
2.转到>配置>ADVANCED>开发人员>CSS设置
3.选择“合并CSS文件”
4.单击“是”
在Magento中合并JavaScript
同样,您也可以将所有JavaScript文件合并为一个。
登录管理面板。
转到>配置>ADVANCED>开发人员>JavaScript设置
选择“合并JavaScript”
单击“是”
一个完成,你可以看到下面的图像的区别。
优化JavaScript
为您的网页优化JavaScript可以无数方式完成。在这里,我们提到一些方法可以优化您的JavaScript代码,并且在此过程中,可以在不同的服务器位置之间获得平滑无忧的页面呈现。
使用CDN
而不是改变Web应用程序以适应分布式架构,使用CDN(内容传送网络)始终是可行的,其中您的内容可以分散在多个地理位置的服务器上,从而方便快捷的访问网页。事实上,大多数用户的响应时间是花在网页上下载不同的组件,如样式表,图像,CSS等等。因此,分散您的静态内容首先标志着响应时间的显着减少,从而更快地向用户提供内容。
安全地设置跟踪脚本
需要安全地设置外部脚本(如GoogleAnalytics(分析)等)脚本,以避免在页面加载期间阻止网页上的其他事件处理程序。这是因为在html页面的head或body部分中出现的这些脚本停止浏览器中页面的渲染过程,当浏览器从顶部到底部读取页面时遇到脚本标签。这样做会阻止页面上出现的其他脚本,因为某些脚本可以修改页面,添加变量或添加其他直接影响页面加载时间的其他脚本。因此,为了避免这些情况,您可以:
在<body>部分的底部包含脚本标签
加载事件后包含脚本代码
包括异步跟踪代码
外部服务包含
社交媒体按钮是当今网页的一些流行工具。因此,随着人们在浏览会话期间经常使用这些按钮,有必要优化页面加载。一个更好的选择是将所有社交媒体请求的代码包含在一个脚本下,并将其包含在页面的代码末尾(</body>)之上。
延迟JavaScript
推迟JavaScript代码的过程意味着页面被完全加载,然后解析JavaScript的代码以加快页面加载时间。这样的代码不会影响页面的性能,只能重新整理整个加载过程以获得最佳结果。
优化CSS
优化CSS文件的最佳方法是将它们放在页面的<head>部分而不是底部。一些重要的规则是:
包含不超过一次的外部CSS样式表
避免内联CSS
避免@import调用
在样式标签叠加内容中包含小型CSS
优化图像
逃避使用更大的图像,因为您可以随时设置图像的宽度和高度在html。另外,有一个favicon.ico低于1k是有益的。这个favicon.ico的用法是不可避免的,因为浏览器总是要求他们,并且cookie每次都发送给这样的请求。所以最好不要在这样的请求期间返回错误页面。
上述步骤可以帮助您获得更好的流量,但不一定会增加您的业务投资回报率。