当您在网站上运行Google的Firebug/Firefox的PageSpeed插件时,它会建议可以无损压缩图像的情况,并提供下载此较小图像的链接.
例如:
这适用于JPG和PNG文件类型(我没有测试GIF或其他.)
另请注意Flickr缩略图(所有这些图像都是75x75像素.)它们可以节省很多.如果这真的很棒,为什么雅虎不会将这个服务器端应用到整个库并减少存储和带宽负载？
即使Stackoverflow.com代表一些非常小的节省:
我已经看到PageSpeed建议使用Photoshop的"Save for Web"功能创建的PNG文件相当不错.
所以我的问题是,他们对图像做了哪些改变以减少它们呢？我猜不同的文件类型有不同的答案.对于JPG来说,这真的无损吗？他们怎么能打败Photoshop？我应该对此有点怀疑吗？
直到最近,我的网站(www.heatexchangers.ca)在Google Page Speed上得分为98%.有一些我无能为力的事情,比如来自网络字体的查询字符串.我对此非常满意,因为这代表了我所能做的一切.
最近谷歌添加了一些影响页面速度得分的东西,我现在只有89%的页面速度得到这个建议:
解决此问题的建议似乎涉及拖拽我所有的.css和.js文件并分离它们的某些部分并将它们内联添加到我的html中.这让我有些困惑,因为我的印象是我们必须尽可能多地保留HTML和CSS.
究竟什么是"折叠以上"的内容？如果它是一些样式,如字体,背景颜色等; 然后我可以看到包括内联可能不是太大的交易.我无法找到确切的列表.
我正在尝试针对开发人员的Google文档优化CSS交付https://developers.google.com/speed/docs/insights/OptimizeCSSDelivery#example
正如您在内联一个小CSS文件的示例中所看到的那样,内联中的内核中的关键CSS和原始的small.css在页面加载后加载.
<html>
<head>
<style>
.blue{color:blue;}
</style>
</head>
<body>
<div class="blue">
Hello, world!
</div>
</body>
</html>
<noscript><link rel="stylesheet" href="small.css"></noscript>
关于这个例子的问题:
如何在页面加载后加载大型css文件？
我在httpd.conf上设置了Expiry
ExpiresActive On
ExpiresDefault "access plus 1 month"
ExpiresByType image/gif "access plus 1 month"
ExpiresByType image/jpeg "access plus 1 month"
ExpiresByType image/png "access plus 1 month"
ExpiresByType text/css "access plus 1 month"
ExpiresByType text/javascript "access plus 1 month"
ExpiresByType application/x-javascript "access plus 1 month"
这有助于浏览器缓存图像,字体文件,站点自己的CSS和js文件.但我的网站上也有外部JS:
http://connect.facebook.net/en_US/sdk.js (20 minutes)
http://apis.google.com/js/client.js (30 minutes)
https://apis.google.com/js/rpc:shindig_random.js?onload=init (30 minutes)
https://platform.twitter.com/widgets.js (30 minutes)
https://www.google-analytics.com/analytics.js (2 hours)
Google Pagespeed Insights针对上层文件说: 在静态资源的HTTP标头中设置过期日期或最长期限,指示浏览器从本地磁盘而不是通过网络加载以前下载的资源.
如何利用浏览器缓存这个外部JS文件？任何帮助？
我有一个WordPress网站,我的客户想要完美验证(使用W3C验证器).其中一个问题是Google的pagespeed,它似乎默认由托管服务提供商启用.
我尝试使用以下内容禁用.htaccess文件中的mod_pagespeed,但由于某些原因它不起作用:
<IfModule pagespeed_module>
ModPagespeed off
</IfModule>
我可以通过向URL添加"？ModPagespeed = off"来禁用它,但这并不能解决我的问题.
还有什么我可以尝试的吗？我只能通过FTP访问(没有服务器conf访问,没有c-panel访问等).
因此,我正在创建一个超优化的网站,我的网页加载速度与https://developers.google.com/speed/pagespeed/为99(满分100分).
让我远离满百的唯一一件事就是这样:
通过指定缓存验证程序 - Last-Modified或ETag标头 - 可以确保可以有效地确定缓存资源的有效性.
什么？!我不知道该怎么办.如何为google webfonts设置缓存验证程序？
我喜欢这样的webfont : <link href='http://fonts.googleapis.com/css?family=Open+Sans:400,800' rel='stylesheet' type='text/css'>.
如果重要的话,我在ubuntu上使用apache2.
将webfont下载到服务器并从那里使用它会将分数降低到96,这样也无济于事.
我是巴西人，我开始写体育博客。我去了 PageSpeed ??Insights 对我仍然需要调整的内容进行评估，但分析在 50% 处停止并出现以下错误：
“来自引用者https://www.googleapis.com/ 的请求被阻止”
可能是什么问题？解决起来会不会很简单？
Lighthours 和 Pagespeed 洞察力不断告诉我为图像定义明确的宽度和高度。但我的大部分图像来自图片标签，因为移动设备和桌面图像尺寸不同。如何根据所选图像提供不同的宽度和高度值？
<picture>
<source media="(max-width:767px)" srcset="img_pink_flowers_small.jpg">
<source media="(min-width:768px)" srcset="img_pink_flowers_large.jpg">
<img src="img_pink_flowers_small.jpg" width="?" height="?">
</picture>
我在网站中使用外部JavaScripts,因为我总是试图将JavaScript保持在底层和外部.
但谷歌的页面速度正在给出这个建议
以下外部资源具有较小的响应主体.在HTML中内联响应可以减少页面呈现的阻塞.
此外部js文件仅包含此内容
$(document).ready(function() {
$("#various2").fancybox({
'width': 485,
'height': 691,
});
});
但在Yslow,我得到了这个建议
关于Make JavaScript和CSS外部的等级n/a
如果您的属性是普通用户主页,请考虑这一点.
Run Code Online (Sandbox Code Playgroud)There are a total of 3 inline scripts每次请求HTML文档时,都会下载HTML文档中内联的JavaScript和CSS.这减少了HTTP请求的数量,但增加了HTML文档的大小.另一方面,如果JavaScript和CSS位于浏览器缓存的外部文件中,则HTML文档大小会减少,而不会增加HTTP请求的数量.
哪个是谷歌或雅虎？
关于使用像按钮或盒子这样的Facebook,使用谷歌的pagespeed在线服务有一个常见的问题我得到: 从一致的URL 提供资源以下资源具有相同的内容,但是从不同的URL提供.从一致的URL提供这些资源以保存1个请求和25.3KiB.- http://static.ak.facebook.com/connect/xd_arbiter.php?version=7 - https://s-static.ak.facebook.com/connect/xd_arbiter.php?version=7
很明显,一个用于安全的ssl连接而另一个用于不安全的连接是否有任何可能的方法使facebook加载一个？
google-pagespeed ×10
html ×3
javascript ×3
caching ×2
css ×2
optimization ×2
pagespeed ×2
.htaccess ×1
apache ×1
apache2 ×1
compression ×1
etag ×1
facebook ×1
image ×1
imaging ×1
jquery ×1
php ×1
yslow ×1