您现在的位置是：首页 > SEO知识SEO知识
如何通过压缩html、Javascript和CSS文件来提高网站的打开速度
凤仙花2020-07-26【SEO知识】人已围观
简介我们可以通过压缩Javascript和CSS文件，减少Javascript和CSS文件的大小，从而提高我们网站打开速度。
当我们的网站内容多了之后，我们打开自己的网站就会非常的慢，有很多人呢就会换好的服务器和增加带宽；其实不是这样的，不妨我通过一些优化减少占用服务器和宽带的资源，从而提高网站打开得速度；
我想大家都接触过Javascript和CSS吧，网站大量的特性都会用到Javascript和CSS文件，如果网站做大了，这些文件也会越来越多，这些文件一多了，就要影响到网站打开得速度，怎么解决这个问题呢？我们就要显示是压缩Javascript和CSS文件，减少Javascript和CSS文件的大小，从而提高我们网站打开速度；
在这里给大家介绍一款html，javascript，css 压缩工具 ，可以比较方便的进行压缩：
一、压缩html和javascript：
我们用站长工具的JavaScript-HTML格式化工具，我们打开页面，我今天要压缩的文件js文件：common.js ，把js代码复制到到JavaScript/HTML格式化工具里面如下图所示：
点击下面的“普通压缩”和“加密压缩”按钮，经过我的精心测试，使用“加密压缩”，对文件压缩率是最好的，所以点击“加密压缩”，压缩后如图：
javascript代码压缩后，我们就把这些代码在复制到common.js文件里面，在吧这个文件上传到空间原来的位置，进行访问是否存在一些错误，如果没有什么问题说明压缩成功；
我的common.js 文件压缩前和压缩后的对比：
压缩前：
压缩后：
文件压缩前和压缩后确实有明确的减少，说明压缩确实减少文件的大小，
我们来测试文件压缩前和压缩后所有能的时间做对比(我是用火狐插件测试传输速度)：
压缩前所用时间：
压缩后所用时间：
压缩前所用时间是：125ms，压缩后所用时间：78ms ，文件压缩后给我们节省大量的时间，如果每个js都进行压缩，我们房子访问速度会更快的。
(注：html文件和javascript压缩原来一样的，当时压缩html要用到“普通压缩”按钮压缩)
二、压缩css文件：
我们打开站长工具的Css压缩/格式化工具页面，我要压缩的文件是五色旗保健品商城的css主文件style.css，首先我们打开站长工具的Css压缩/格式化工具页面 ，把style.css 代码放到Css压缩/格式化工具里面，如下图所示：
点击“压缩代码”按钮后，css代码压缩成功，如下图所示：
后边就是压缩后的css代码，你要不右边的代码复制到源文件style.css里面在上传到服务器空间里面，在访问一下网，看看网页样式有没有改变，如果有点变化就需要简单的调试一下，如果没有变样，说明你的css压缩成功了；
下面我们来看看styl.css文件压缩前和压缩后的大小和放在访问速度的大小：
文件大小对比：
压缩前：
压缩后：
压缩前30kb，压缩后23kb，明显的文件大小减小了
压缩前所用时间：
压缩后所用时间：
压缩前所用时间是：188ms，压缩后所用时间：93ms ，css压缩后明显的节省了95ms；
总结：一个大的网站可能会有很多的javascript和css，如果没有都进行压缩的话，一定会减少很多文件大小的，其实减少文件大少并不是很重要，最重要的是，文件容量减少了，能够快速的提高网站访问的速度，给用户带来好的体验，我们尽量的把文件压缩到最小，这样才有利于用户快速的打开网站。
Tags：html Javascript CSS 网站速度
很赞哦！ ()
随机图文
百度蜘蛛IP有哪些？各有什么样的作用？
我们在做SEO优化的时候可以根据不同的百度蜘蛛IP分析网站是个怎样的状态，今天为大家介绍一下百度蜘蛛的ip都有什么作用
seo优化网站用二级域名好还是用二级目录好？
当网站发展到一定时期，想要扩大网站规模、建立新频道的时候，相信很多人和我一样在选择二级域名和二级目录上犯了难。这篇文章我深入分析之后给出了答案。如果你的网站在使用二级域名和二级目录捉摸不定的时候，看看此文，会对你有所帮助的。
迄今为止最全的百度算法合集，做网站优化的快收藏
随着今年七月份百度细雨算法的推出，百度算法涉及到的范围越来越广，大部分站长做优化都是针对的百度搜索引擎，所以百度算法的更新就显得尤为重视，每次百度算法的更新，都会造成大量网站排名的浮动，所以了解百度算法，及时作出调整，对我们的优化排名至关重要。
网站地图在SEO优化中有哪些作用？
网站地图可以非常方便的让搜索引擎蜘蛛抓取网站页面，通过抓取网站页面，清晰了解网站的架构，网站地图一般存放在根目录下并命名为sitemap，为搜索引擎蜘蛛指路，增加网站重要内容页面的收录。
