7个方法从技术上提升网站的性能,加快加载速度

2021-02-08 17:31:17  23 浏览  0 评论   赞

尽可能的减少HTTP的请求数;使用CDN(内容分发网络);添加Expire/Cache-Control头;Gzip压缩;将css放在页面最上面;将script放在页面最下面

7个方法从技术上提升网站的性能,加快加载速度

图4929-1:

从我开始知道 SEO 这几年起,基本上所有的 SEO 活动都是基于前端的,从header 到 body,从小标签到 CSS,从链接到关键词密度;初期牛人们诊断一个网站 SEO 的标准也是从前端页面着手,不过的确也是,从排名算法前端的代码的确占了大部分的比例,但后端的服务器速度优化,也开始成为一个越来越重要的因素,特别是流言四起的 Google 将会把网站速度作为算法的一部分。

当然,服务器那种事不该是一个SEOer 或者 SEMer应该去精通的东西,其实只要了解并掌握其规律就可以了(推荐另外一片文章:大型网站架构演变和知识体系);但依然要熟悉网站系统或者 CMS 的加速手段,正如国平在《怎样形成一套非常科学系统的SEO方法 》中分析的

什么措施能影响网页加载速度呢? 网络环境、服务器硬件、CMS本身都能影响网页加载速度。优化其中的任何一项,都能提升网页加载速度。那马上又可以得出:网络环境影响SEO流量、服务器硬件影响SEO流量、CMS本身的速度影响SEO流量。

影响速度的因素有很多,这里做一个汇总(不包括硬件)

本文内容参考Yahoo:Best Practices for Speeding Up Your Web Site 和 高性能网页开发的14条军规

一、尽可能的减少 HTTP 的请求数

这个第一条是我们大多数SEO所知道的,我再做一个简单的描述:大多数的HTTP请求都是前端的,用户的大多数时间都被用来下载图片、CSS样式表、各种Scripts、Flash等等。当然或许将css,js文件拆分多个是因为css结构,共用等方面的考虑。阿里巴巴中文站当时的做法是开发时依然分开开发,然后在后台 对js,css进行合并,这样对于浏览器来说依然是一个请求,但是开发时仍然能还原成多个,方便管理和重复引用。yahoo甚至建议将首页的css和 js 直接写在页面文件里面,而不是外部引用。因为首页的访问量太大了,这么做也可以减少两个请求数。而事实上国内的很多门户都是这么做的。

而css sprites是指只用将页面上的背景图合并成一张,然后通过css的background-position属性定义不过的值来取他的背景。淘宝和阿里巴巴中文站目前都是这样做的。有兴趣的可以看下淘宝和阿里巴巴的背景图。

http://www.csssprites.com/ 这是个工具网站,它可以自动将你上传的图片合并并给出对应的background-position坐标。并将结果以png和gif的格式输出。

二、使用CDN(内容分发网络)Content Delivery Network

之前曾经问过张智勇公子关于 CDN 是否对 SEO 有影响,在征询了技术老总的意见之后,这个影响其实几乎可以忽略的,反而是用户端的速度体验提升了,对网站的正向作用更大。

CDN 加速现在很流行,几乎稍微大一点的网站都有用这个服务,就是将网站的镜像服务备份到多个服务器节点,从而加速该服务器周围的用户访问。

更详细地内容大家可以参考百度百科上对于CDN的解释

三、添加Expire/Cache-Control 头

这个规则有两个东西:

1、对静态的组件:设置为永不过期;

2、对动态的组件:设置为一个合理的缓存控制头来帮助有条件的相应。

通过设置Expires header 来缓存这些文件。Expire其实就是通过header报文来指定特定类型的文件在览器中的缓存时间。大多数的图片,flash在发布后都是不需要经常修 改的,做了缓存以后这样浏览器以后就不需要再从服务器下载这些文件而是而直接从缓存中读取,这样再次访问页面的速度会大大加快。

一个典型的HTTP 1.1协议返回的头信息:

HTTP/1.1 200 OK

Date: Fri, 30 Oct 1998 13:19:41 GMT

Server: Apache/1.3.3 (Unix)

Cache-Control: max-age=3600, must-revalidate

Expires: Fri, 30 Oct 1998 14:19:41 GMT

Last-Modified: Mon, 29 Jun 1998 02:28:12 GMT

ETag: “3e86-410-3596fbbc”

Content-Length: 1040

Content-Type: text/html

其中通过服务器端脚本设置Cache-Control和Expires可以完成。

如,在php中设置30天后过期:

<!–pHeader(“Cache-Control: must-revalidate”);$offset = 60 * 60 * 24 * 30;$ExpStr = “Expires: ” . gmdate(“D, d M Y H:i:s”, time() + $offset) . “ GMT”;Header($ExpStr);–>

<!–pHeader(“Cache-Control: must-revalidate”);$offset = 60 * 60 * 24 * 30;$ExpStr = “Expires: ” . gmdate(“D, d M Y H:i:s”, time() + $offset) . ” GMT”;Header($ExpStr);–>

在asp中设置绝对时间过期:

<% Response.ExpiresAbsolute=#May 31,2010 13:30:15 GMT# %>

也可以通过配置服务器本身完成,这些偶就不是很清楚了,呵呵。想了解跟多的朋友可以参考http://www.web-caching.com/

四、Gzip压缩

这个是目前应用最多的加速方式之一,代码也很简单,gzip的压缩比例非常大,一般压缩率为85%,就是 说服务器端100K的页面可以压缩到25K左右再发送到客户端。雅虎开发者特别强调, 所有的文本内容都应该被gzip压缩: html (php), js, css, xml, txt。

五、将css放在页面最上面

六、将script放在页面最下面

七、避免在CSS中使用Expressions

css表达是的执行次数是远远多于我们想象的,往往会严重地影响性能。而且,它只能在IE中执行。所以因尽量地避免它。这一条以前倒没想过,个人用 这个就是在对ie使用max-width和min-width属性的时候。大家知道IE是不支持max-width和min-width属性的。有时候的 页面(特别是自适应大小的页面)为了能在分辨率小到一定程度后还能显示要用到这个功能,怎么办。当时我的做法就是利用expressions:

 

转载请注明:网创网 www.netcyw.cn/b4929.html

赞 ()
发表评论
  • 昵称
  • 网址
(0) 个小伙伴发表了自己的观点
    暂无评论

Copyright © 2018-2019 小王子工作室 版权所有 滇ICP备14007766号-3 邮箱:yangzy187@126.com