谷歌网页速度测试工具

用户体验（UX）
网站加载速度是必要的整体用户体验，这也是一个搜索引擎优化排名的因素之一。事实是，现在，人们没有耐心等待超过五秒的页面加载。如果你的网站不够快，你会失去潜在客户。与更多的…

网站加载速度是整体用户体验的一个优先事项，也是搜索引擎优化排名的一个因素。事实是，现在人们没有耐心等待超过五秒的时间来加载页面。如果你的网站不够快，你会失去潜在客户。
随着超过50%的在线流量来自移动设备，每个人都希望网站加载几乎瞬间。记住，在这篇文章中，我将向您展示我们如何设法得分100 / 100谷歌pagespeed工具反向链接的见解为桌面和移动监控。

动机

我们的网站已经非常快地被载入了，但是我们知道，总有一个办法让它更好。
有一天，在和pagespeed工具，我注意到谷歌的网站有移动设备的一个可怕的得分，59 / 100。在100 / 95的桌面版本做得更好。

也许他们应该使用他们的工具来改进他们的网站，对吗？
这是推动我们使我们的网站加载速度更快，证明你可以得到100 / 100。这不是一个痴迷，它的目标是完美的。
我们开始在87 / 100。
这是我们在实施一些技术后，得到的结果，与大家分享。

如何使网页加载速度更快
在我开始显示出我们遵循的具体步骤，让我告诉你，pagespeed工具是最好的网络性能的做法只有一个准则。它提供了建议，为优化您的网站页面加载速度，并实现良好的效果取决于如何建立您的服务器环境。
虽然这些步骤中的一些步骤需要专业技术，其他人不。请注意，他们可以使用几乎任何内容管理系统。

pagespeed工具提出见解，我们优化我们的图片载入速度减少文件大小。为了解决这个问题，我们做了2个重要的事情：
压缩所有图片使用像compressor.io和tinypng工具。这些工具是免费的，可以减少图像文件大小超过80%，在某些情况下，不降低图像的质量。
减少图像的大小而不降低图像质量。例如，如果我们想要在我们的网站上150x150px有图片，这是图片应该是在我们的服务器上的大小。你永远不应该比你想让他们呈现在较大的图像，也不能减少它们的大小使用CSS或者HTML标签。
我们下载我们的每一个图像，然后手动压缩和调整他们的。优化后的图像，最好是一个习惯，优化所有的新图像上传到您的服务器。每一个新的形象应该是压缩和调整大小。
谷歌还提供了选择下载您已经优化的图像，并且您可以将它们上传到您的服务器。你可以用JavaScript和CSS一样。
rpectd4.png
步骤2：#缩小CSS和JavaScript

谷歌已经告诉我们，我们必须减少我们的JavaScript和CSS文件。
修正的过程，通过消除不必要的空格字符减少文件的大小，和评论你的CSS和JavaScript文件。程序员通常会留下许多空间和意见，而编码。这些甚至可以增加一倍的大小，你的CSS和JavaScript文件。

为了解决这个问题，我们安装在我们的服务器gulpjs。该工具会自动创建一个新的CSS文件，删除所有的空间。它还创建了一个新的CSS文件，自动为你做出的新变化。在我们的例子中，它帮助我们的主CSS文件的大小从约150kb 300KB的减少。不同的是所有不必要的字符。关于如何删除白空格的更多指令，检查谷歌指南。
如果您使用的是WordPress的，我建议你安装插件autoptimize。
你也可以从pagespeed工具优化文件下载。下面是一个例子：
下面是我们经过修正CSS和JavaScript的结果。

步骤3：利用浏览器缓存#
对于许多网站运营商利用浏览器缓存是最具挑战性的部分。

为了解决这个问题，我们感动每个静态文件从我们的网站CDN（内容分发网络）。
CDN是一个位于世界各地的网站服务器的网络。他们能够缓存网站的静态版本，如图像、CSS和JavaScript文件。在其服务器上你的网站的内容的CDN存储副本，当有人用你的网站，静态内容是从最接近他们的服务器负载。
例如，如果你的网站的服务器主要是来自德克萨斯，没有一个CDN，一个来自阿姆斯特丹的游客必须等待服务器负载的网站所有的方式从美国用CDN，网站从一个位置，靠近用户加载。在这种情况下，这是一个靠近阿姆斯特丹的地方。因此，网站加载速度更快。
这里是如何从CDN作品GTmetrix视觉表现

我们把所有的图片，JavaScript，和CSS文件到CDN和只保存HTML文件在我们的服务器。托管你的图像在CDN将如何快速你的页面加载的网站访问者有很大的不同。
当我们这样做，pagespeed工具还烦人的建议，我们利用我们的浏览器对于一些第三方资源缓存。这里的截图：

结论
这是我们来监测反向评分100 / 100与谷歌的速度工具中最重要的步骤。我们没有优化网页。我们还优化内页，免费的反向链接检查器。

你可以采取的三个最重要的行动，以提高您的网站是：
使用CDN（内容分发网络）。
修复渲染阻塞问题。（避免对身体有JavaScript编码。你的代码应该放在文件的底部。）
优化图像的大小和压缩。
您的团队为您的网站做了这样一个项目吗？如果是这样，你的结果是什么？

牧羊人设计文章推荐：

深圳积分入户页面制作

深圳育捷教育自学考试竞价页面制作案例

响应式网页设计面临的挑战