0
+1
网页的加载速度对于网站关键词排名和用户体验都非常重要,很多SEO技术人员都在想方设法提高网页加载速度,但经常会忽略了对图片的处理来优化网站。
简单的理解图片处理就是通过选择图片的类型以及调整图片大小、对图片进行压缩,来减少图片对网页加载速度的影响。
在我们浏览一些网站时,发现一些网站加载速度很慢,部分原因是服务器配置不高,还一个主要原因是网站使用的图片质量过高,导致页面体积过大。经常看到某个页面超过10M大小,一张图片好几M,加载这张图片都得一定时间,特别是一些商城网站。如果不能有效修改图片大小,那么一定会影响用户体验。
那我们该对图片进行怎样的操作来提升加载速度?
不要通过网站后台来调整图片大小,大部分网站后台对图片的处理只是调整图片大小,有的也是瞬时进行压缩,图片的比例是网站后台设定好的,但这样压缩的图片比正确压缩大25%左右,占据了更多的服务器空间。
对于一些有多张图片的页面,那是一定会产生影响,我们应该在图片上传之前就进行优化处理。
首先调整图片大小,调整图片大小属于简单也是容易忽略的。举个例子,正常要上传的图片宽度为1000像素,而只需要在网站上显示500像素宽度,即使在后台中调整大小,也会要求压缩整张图片里的所有信息,这会让图片变得更大。
在上传之前就修改为要显示的图片大小,有些后台还会进行调整,但保证好初始图片小是我们可以做到的。
二是选择合适的图片格式,网页主要还是浏览效果为重,不能一味的选择体积小的图片处理后上传,很多人没有处理图片的经验,所以在网站这个页面该使用PNG时使用了JPG的图片,这是要改正的。
我们常见的图片类型有:JPG、PNG、GIF和WEBP,除了部分特殊站点会用到GIF,其他的站点基本都看不到,这里就不多做解释。
JPG是常用的图片文件格式,可以有极高的压缩率,但这种压缩是有损失的,图片里重或不重要的资料会被修饰,因此容易造成图像数据损伤,要保持一定的浏览效果,图片压缩是尽量不要低于50%的质量。
PNG形式的图片无损压缩,有着高的压缩比但不会损失图片的数据,它利用特殊的编码方法标记重复出现的数据,对图片的颜色没有影响,重复保存也不会降低图片质量。PNG有24位和8位两种,要减小图片大小时,需要8位PNG设置。
WEBP同时支持有损和无损两种压缩方式,相比JPG和PNG更加的好和稳定。在相同质量下webp图片要比JPG图片的体积小40%,但WEBP格式未能像JPG那样,得到各种软硬件的广泛支持,使用这种格式需谨慎。
在上传到网站前对图片进行有效的处理,可大大减小图片的体积,这样网页加载时需要加载的体积减少,降低加载时间。
相关热搜词:
");
praise_txt.removeClass("hover");
text_box.show().html("-1");
$(".add-animation").removeClass("hover");
num -=1;
praise_txt.text(num);
tijiao(319 , "jian");//参数
}else{
$(this).html("
");
praise_txt.addClass("hover");
text_box.show().html("+1");
$(".add-animation").addClass("hover");
num +=1;
praise_txt.text(num);
tijiao(319 , "jia");//参数
}
});
//传参数AJAX
function tijiao(newsid,ftype){
$.post('ajax/fabulous.php', {newsid:newsid, ftype:ftype}, function(d){
}, 'json');
}
//function tijiao(newsid,ftype)//提交表单
// {
//$.ajax({ type:'POST', url:'ajax/fabulous.php',{newsid:newsid,ftype:ftype} , function(data){
// }
//};
});
(function(){
window.scrollReveal = new scrollReveal({ reset: true, move: '50px'});
})();