网站管理者肯定希望提高他的网站图片下载速度。这增加了搜索结果的排名; 此外,通过更快地响应他们的行为,网站访问者使用它更愉快。
为了寻找一种快速而直接的解决方案,网站所有者安装了大量插件,这些插件反过来消耗资源并且只会减慢其工作量。我们没有任何针对优化插件的东西,但是他们需要习惯于他们的工作原理。
此外,从未经历过管理的网站所有者通常会对优化产生误解。在他们的理解中,优化是不惜任何代价加速脚本。优化的任务是以最优的资源价格产生最佳的站点速度。因此,不能为所有站点提供通用指令。
对于任何资源所有者或网站管理员来说,快速建立网站是一项紧迫的任务。毕竟,页面加载速度是Web资源成功的最关键因素之一,以及高质量的内容和漂亮的图形设计。
缓慢加载有时会增加丢失用户的可能性。特别是当访客来自移动设备时。加速网站加载的简单建议,即使是没有经验的用户也可以在实践中实施,将有助于最大限度地减少流量丢失的可能性。
1.优化HTML代码和CSS-,JS-文件
如果不考虑进入网站时传输到用户浏览器的代码的“清洁度”,则无法进行下载优化。源代码中的大量字符会显着影响加载速度,因此其简洁性是一个关键的成功因素。
如何最小化代码以加快网站加载速度
删除不必要的字符,标记元素和源代码标记。自动化该过程将有助于在站点的HTML代码的开头和结尾添加一个小插入。
这种缓冲HTML内容的方法非常有用,但它可以在随机存取存储器上创建额外的负载。
将相同类型的CSS文件和JS文件分组。免费的PHP应用程序,如JCH Optimize,Cloudflare或Minify,将被复制到一个单独的目录中并传递所有站点文件,这将有助于组合这些元素。
2.删除额外的HTTP请求
在加载网站时,上传页面元素(javascript,图像,CSS和Flash文件)占用了大部分系统资源。对此类元素的HTTP请求显着减慢了网站的速度。
要避免“额外”请求,您需要减少页面组件的数量。这将导致服务器调用成比例减少,并将加快网站的加载速度。
这可以通过以下几种方式完成:
将多个图像合并为一个图形文件(CSS sprite);
在页面样式表中使用内嵌图像(内嵌图片);
一个页面上的多个CSS文件或脚本合并为一个文件;
最大限度地减少方案和插件的数量。
3.以正确的顺序排列JavaScript和CSS
建议将CSS文件放在页面代码的顶部,将JavaScript放在底部。在此优化之后,将首先加载静态内容,然后仅加载动态图形。
需要更多资源下载的Flash元素或动画不会“向前拉”并从第一秒开始破坏网站的印象。这将确保顺利下载内容并增加资源的美学吸引力。
4.减少外部脚本的数量
外部脚本是通过外部链接访问的代码(文本)。链接会向许多不同的服务器创建其他请求,这最终会降低网站的速度。为避免这种情况,建议主要使用嵌入在页面源代码结构中的本地脚本。
当然,关注本地脚本会对网站的外观和功能造成某些限制。但由此产生的下载速度优势值得这些“牺牲”。
5.启用Flush
这个PHP函数允许您不要等到用户的服务器从资源加载信息,而是将其输出为部分。当数据传输到浏览器时,打开的窗口不会保持为空,但会平滑地填充网站的可加载元素。对于具有复杂接口和高流量的web资源,这种加速尤其必要。
最好将刷新功能放在页面源代码的开头,紧跟在头部之后。从标题开始,HTML内容将打开得更快,您还可以启用CSS和JavaScript元素的并行加载。
6.缓存页面
缓存将站点页面(flash,图形,JavaScript和CSS)中的一些信息保存到用户的浏览器中。在下一次运行时,这些文件会立即从浏览器下载,从而为站点提供额外的速度。
您可以通过向HTML代码添加过期标头来启用缓存。WordPress站点可以通过安装具有免费或部分免费功能的插件轻松缓存,例如W3 Total Cache,Cache Enabler或Zen Cach。
对于新站点,最好仅在完全准备好启动后使用缓存。如果在开发期间启用该功能,则可能无法在站点上正确显示进一步的更改。
7.使用CDN
内容交付网络 – 分散在全球数据中心的一系列服务器,以提高内容传输给访问者的速度。访问者在地理位置上与CDN服务器越近,来自站点的数据包传输的速度就越快。
CDN的使用对于内容和高负载门户尤其重要,其主要受众与物理服务器相距甚远。此服务最大限度地减少了从海外网站下载的等待时间,从而有助于提高他们在本地搜索结果中的排名。毕竟,内容是从离他所在国家的用户最近的服务器存储器下载的。
8.优化图形和视频
您必须选择正确的图形和视频格式,因为文件格式直接影响向访问者显示信息的速度。
不同网站内容的推荐格式:
SVG – 用于矢量徽标和简单的界面元素;
PNG – 用于方案和非矢量标识;
JPG – 用于照片和图像;
MPEG4 – 用于视频和动画。
同样对于视频和动画,可以使用相对较新的WEBM格式。在大多数情况下,它提供的视频尺寸更小,质量相同。但是,该表单的浏览器支持有限(例如,macOS / iOS Safari浏览器不支持)。因此,建议使用WEBM文件作为优先视频源,并安装MPEG4作为替代源。如果共享不可接受或不方便,您也可以使用唯一的MPEG4。
另外,我们注意到矢量格式(SVG)允许缩放而不会损失图形质量。
图像优化的阶段
第1步 – 减小图像的大小。
许多流行的CMS,如WordPress或Joomla,都有内置的插件来优化原始图像。但是这种方法会产生额外的负载,并会降低网站的速度。每次页面加载时,浏览器首先访问源代码,然后才动态调整图像大小。
为了避免在加载图像时损失速度,操作系统内置的图形编辑器(如预览(Mac)或Microsoft Paint(Windows))以及具有类似功能的在线服务将有所帮助。与他们合作将需要最少的图形处理技能。
第2步 – 下载前压缩文件。
即使在优化图像尺寸之后,其“重量”通常仍然远非最佳。ImageResize或TinyPNG等便捷免费服务有助于缩小尺寸而不会降低图像质量。这里的大多数流程都是自动化的。用户只需要上传文件并下载已压缩到最佳图像大小。
9.应用Gzip文件压缩
Gzip是一种压缩站点文件以节省通道资源和加速加载的简单方法。使用Gzip,文件被压缩成一个存档,浏览器可以更快地下载,然后解压缩并显示内容。
启用Gzip非常简单 – 您只需要在.htaccess文件中添加几行代码即可。例如,当使用Apache Web服务器时,mod_gzip模块可用于网站管理员,以激活Gzip,在这种情况下,您需要将此类代码添加到.htaccess
完成Gzip文件压缩以减少从浏览器到服务器的请求数。Put,这项技术将文件的初始权重降低到70%,以加快下载速度。
嵌入Gzip压缩的方法
将以下代码段添加到“.htaccess”Web服务器配置文件中。
在Apache服务器上
# BEGIN GZIP COMPRESSION
mod_gzip_on Yes
mod_gzip_dechunk Yes
mod_gzip_item_include file \.(html?|txt|css|js|php|pl)$
mod_gzip_item_include handler ^cgi-script$
mod_gzip_item_include mime ^text/.*
mod_gzip_item_include mime ^application/x-javascript.*
mod_gzip_item_exclude mime ^image/.*
mod_gzip_item_exclude rspheader ^Content-Encoding:.*gzip.*
# END GZIP COMPRESSION
在Nginx服务器上
gzip on;
gzip_comp_level 2;
gzip_http_version 1.0;
gzip_proxied any;
gzip_min_length 1100;
gzip_buffers 16 8k;
gzip_types text/plain text/html text/css application/x-javascript text/xml application/xml application/xml+rss text/javascript;
gzip_disable "MSIE [1-6].(?!.*SV1)";
gzip_vary on;
10.改变主机
加速下载的最基本方法是更改托管服务提供商。节省资源分配通常会导致服务质量的显着恶化,这会破坏所有加速藤蔓场地的尝试。
如果对内容,代码和插件的操作没有带来结果,那么就该考虑为网站选择一个更体面的“家”了。在具有高可用性和周到技术支持的高质量主机上,互联网资源将获得提高工作速度的强大动力。这将受到感恩的观众的赞赏。
最重要的是……
有必要争取访问该网站不超过2-3秒。如果站点打开2秒甚至3秒并不重要,但如果有更多,那么这是考虑加速站点负载的原因。
您还需要了解页面加载速度有两个参数。
第一个是显示内容的速度(此时页面已经打开并显示给用户,而透明页面指示符仍然显示,直到连接了所有静态文件和异步脚本)。
而且,第二个是页面实际形成的速度,当所有必须连接的都连接起来时。您需要关注第一个参数,即在显示站点布局之前必须经过不超过三秒钟。
最后总结
你不能忽视这样一个数字,如加载网站的速度。从最初的几秒钟开始,他就为游客创造了一个舒适的环境。用户获得所需内容的速度越快,形成资源的正面图像和建立对其的忠诚度的可能性就越高。