如何提高网站打开速度，如何提高网站加载速度

如何提高网站速度

问某人是否希望自己的网站成为用户友好的，你肯定会收到一个肯定的答案。其中的一个用户友好的网站的方面是快速加载所有游客，不管设备他们使用的是在那个时候。不幸的是，任何人谁最近网上冲浪随时随地都有证明，快速载入的网站不一定是常态。

今天的网站是大-太大了，其实。一个网站的平均规模现在超过2MB的重量在大小。相比之下，回到2012网站的规模平均为1MB，在当时人们认为这是一个巨大的交易，并在需要网站有缩小。然而，我们在这里4年之后，并相反的事情发生。

该页面臃肿，我们今天看到的原因是多种多样的 – 这是不正常的画面，上增加额外重量的网页脚本和框架，从社交网站重质原料的依赖优化的巨大图像，更全部加起来造成大的页面。

为了解决这个问题，网页设计师需要做性能网站交付的核心组成部分。这是可以做到的一种方式是通过建立他们创建的位点的性能预算。

什么是绩效预算？

如同任何预算，绩效预算决定多少可以在某些项目中度过。想想你建立你的家庭财务预算。这项预算可能将不得不为你的房租或抵押贷款，水电费，餐饮，娱乐，以及是否有其他费用行项目。你只能买得起这么多，所以你需要确定你的预算是如何被分解。你可以花更多的在一个地区，只要你削减开支，在其他方面，这样，到最后，你留下你的预先确定的消费限额之内。这同样适用于网站和您建立对它们的性能预算如此。

一个网站的预算将包括组成这些页面上的各种元素，包括HTML文件，CSS样式表的图像（这是最大的一个，占当今网页大小的65％以上），脚本，字体，以及更多。就像一个财务预算，必须通过建立自己的网站的大小整体限制开始。从那里，你可以向后工作，以确定有多少可以在单个项目中度过。

制定预算

因此，有多少你能负担得起在网页上的文件大小“花”？作为一般规则，我尽量600K之间的所有页面保持1MB大小的。该区间的较高端仍然是一个相当大的有点下载，所以我的目标显然是要获得一个页面朝着该范围的较低端 – 甚至更低！然而事实是，不是在一个网站的所有页面将重量相同。某些页面会比别人更重，所以我用这个范围作为一个准则。我一直试图做一个网页尽可能轻，但我也是在这一努力中的现实。

例如，在一个网站一个页面，显示的是一些基本的文本内容，如“联系我们”页面，将是更容易下降挤压到较低的范围我不是一个产品页的预算目标，在电子商务网站。这是因为跟页面不太可能有一些产品页面将需要的页面元素-这有助于建立一个大的页面元素。为了最有效地显示产品，它的页面可能包含某种图像画廊。这不仅会需要若干图像的下载，但该功能也可能使用一些JavaScript，将需要该网页上加载。也可能有视频或音频内容或必须送入页面，就会出现功能码方面动力的网站的购物车，等等。所有这些项目加起来比简单的“联系我们”更大的下载要求页面会有。尝试这两种类型页挤入相同的预设置文件的大小限制是愚蠢。你需要有你不会超过（再次，对我来说这是1MB甚至我最大的网页）的临界值，但你也必须是灵活和现实中的这些网页的评估。

建立项目

考虑到你的整体预算，你现在就可以开始打破这一预算分解成单个的项目。在您的网站的预算类别将包括：

• HTML
• 脚本
• 字体
• HTML
• CSS
• 其他

与图像开始，因为该类别将弥补大部分的网页的体重，我试图在这里分配一个页面大小的60％左右。所以，如果我的目标是600MB，我可以在图像上“花”360MB。这是非常可行的，即使是网页大特色，屏幕图像跨越。当然，这些图像必须正确地优化和压缩为Web交付，并且会有时候，你必须做出一些必要的削减来实现这一目标。由于页面膨胀的最大贡献者是太沉重的图像，以接替在这里，你会过半实现你的整体页面权重的目标。

图像后，接下来的两个领域有可能吃进您的预算大部分都是脚本和字体。如果你的网页在很大程度上依赖于JavaScript，例如，如果它有社会化媒体的饲料或使用Javascript的沉重的框架，这绝对是一个因素。我的目标是让我的脚本下载到我的页面权重或更小的约10％。

字体是下一个类别来考虑，并创建一个预算时，他们可以是一个具有挑战性的组成部分。根据网页字体加载的数量，以及有多大的个人文件，这是一个页面组件，在尺寸方面变化真的。我通常的目标是15％左右或更少我的网页的权重的字体。最终，上使用的字体较大比例将需要一些别的地方削减，我们很快就会覆盖。

最后，你必须衡量一个网页的HTML和CSS，这两者应该是相当渺茫，还有一个“其他”类别，其中包括我作为一个包罗万象的段。在许多情况下，您的网站可能没有任何属于这个“其他”一节。对于HTML和CSS，我通常要找的页面的重量任何地方从5％至15％。通常情况下，我的CSS文件会比HTML较大，但因为我的整个网站将使用一个CSS页面，该文件将被缓存的游客，他们将其加载在第一页之后。这将有助于他们在网站上浏览后续页面的速度。

那么到底，这里是一个样本预算：

• 图片 – 60％
• 脚本 – 10％
• 字体 – 15％
• HTML – 8％
• CSS – 12％
• 其他 – 0％

测试你的页面

为您打造您的网页，你将要测试它的下载速度和总体性能。还有一些功能强大的工具，可在网上，可以帮助你测试你的网页，并确定你可以进行改进，以帮助加快速度。许多这类工具将打破页面的下载分成上面列出的类别，所以你可以看到你可能已经在你的预算，并在那里的一些变化可能必须作出。这给我们带来了我们的过程的“切割”阶段。

削减制作

如同任何预算，将有次，当你超过你的号码，你必须作出一些削减。在某些情况下，你可能会做出牺牲在一个区域，这样就可以花更多的在另一个。例如，如果您的网站使用多个网页字体，你可能会超过该类别你的目标数字。您可以减少您正在使用的Web字体的数量和使用一些系统字体代替，也可以从其他线路在您的预算削减，以腾出文件大小使用的网站的排版。这里是你的选择，你将不得不作出一个项目，通过项目这个决定，甚至是页面逐页，基础。

有时候，你会削减对现有文件。这可能意味着压缩和优化的图像，或者它可以与缩小的CSS或JavaScript文件以除去不必要的空白，这也将减小文件大小。

一旦你取得了你的削减，你可以重新测试你的网页，看看有什么影响了。从那里，你将决定你是否都设置或是否需要额外的削减。再次，请记住，不是所有的页面将重量是一样的！我的主页很可能要权衡比大多数网站其他页面越多，这是确定。我们仍然可能决定削减了该网页的某些方面，比如动画旋转木马，需要多个图像和JavaScript文件进行显示（以我的经验，删除网页旋转木马是来显著减少页面的大小而不影响的最佳途径之一该页面的成功）。

最后，一旦你取得尽可能多的削减，您可以和减少了页面文件的大小尽可能多的，你必须接受你的绩效预算是一个指南，你必须在你如何遵循您的网站，指导现实。

持续测试

一旦一个网站开始运行性能测试还没有结束。被添加到该网站的随着时间的推移将增加其文件大小和影响其性能，所以项目该网站必须继续进行评估和改进通过其整个生命周期。正如你建立了绩效预算为网站的发展，所以应该在现场坚持这一预算在未来。任何时候都添加到页面制作，测试应该运行。此外，任何人负责更新网站使用一个CMS或其他工具应了解该网站的绩效目标，并优化和测试他们的工作流程的一部分。