网站优化中的图片优化教程 优化图片须知的8个小技巧分享!

JPEG (或者说 .jpg) 是最常用的图片压缩格式,支持最高级别的压缩。通常,对于显示要求比较高的图片来说,JPEG格式展示的图片效果较GIF和PNG有明显的优势。

GIFs (.gif) 的图片显示质量要比JPEGs逊色很多,通常用作非常简单的图片展示,比如素材或者装饰性图案,gif也可以用来制作动画。gif不适合用作高显示质量的图片。

PNG图片是比gif更好的选择,因为PNG图片支持的色彩要比GIFs多。此外,和JPEG一样,PNG反复保存也不会影响图片质量,而且对于小图来说,PNG占用的体积极小,PNG完美支持透明背景,所以一般logo或一般装饰性图案都会选择PHG格式。注意PNG-24图片体积要超3倍地大于同样情况下的PNG-8版本,对待PNG你要十分小心,看仔细了。

如下是一个例子,通过对比相同体积下(都是24kb)不同格式的图片显示效果:

网站优化中的图片优化教程 优化图片须知的8个小技巧

你可以很清楚的看到,JPEG 很显然是获胜者,在同样的体积下,GIFs和PNGs必须以牺牲图片质量为代价。不过话又说回来,如果对于非常小的图片来说(比如小于5K),PNG是比较好的选择,相比GIF,PNG可以在体积很小的情况下依然不会让图片失真。

当我们选择图片格式时,如下一些tips供大家参考,

对于电商网站来说,产品图片的质量要求极高,JPEGs毫无疑问是首选,他们有相对高质量的图片显示且不会占用太大的体积。

绝对不要用GIFs来当做产品大图。不然的话文件尺寸会非常大,也没有很好的办法去压缩它(一压缩就失真)。可以用GIFs做动画或是装饰性小图。

PNG可以作为JPEGs和GIFS的替代,如果你想把产品图片做成PNG格式,尽量用PNG-8而非PNG-24。PNGs同时也擅长处理简单地装饰图而只需很小的体积,PNG将会变得越来越流行。

顺便提一句,大部分的图片编辑软件可以转换以上三种形式的图片格式。

6. 正确看待缩略图

大部分电商网站都有缩略图展示,它可以让访客迅速的扫描到尽可能多的商品样式而不需要再去点击一个额外的页面。

网站优化中的图片优化教程 优化图片须知的8个小技巧

缩略图很棒,但是要小心,他们可能是你网站的速度杀手。他们通常会出现在关键的购物流程之中,若因此影响了购物流程的流畅性,额… 那你就可能又损失了一个顾客。关于缩略图,我个人有如下两点建议:

尽可能压缩缩略图体积,缩略图的图片不要过高的追求显示质量,当用户点击到下一层详情页面的时候再给他一张高质量的图片。

尽量不要为缩略图设置alt标签,通常我们并不希望搜索引擎索引的是缩略图而应是产品详情页的高质量原图。

7. 使用图片地图

如果你的网站用JS做图片效果来更好的提升用户体验,你是否担心图片是否还能收录?当然通常来说蜘蛛是不会爬取不显示在源代码里面的图片文件的,但是谷歌对于这点已经很有经验了,通过图片地图的提交,即把图片地址一个个老老实实地列出来,搜索引擎就可以爬行了。

网站优化中的图片优化教程 优化图片须知的8个小技巧

对于图片地图,我就不多说了,因为谷歌有许多指导文档来帮助你提升图片的搜索排名,看这里。

8. 留心装饰性图片

非产品类的图片比如背景图、按钮图,边框图等都可算作装饰图,作为一个优化者,你需要仔细去检查这些图片的体积是否过大,是否会影响网站载入速度。

这里有一些关于如何压缩装饰图的建议:

如果只是一些边框类的、或是简单的样式图片,使用PNG-8或者GIFs,你可以创建非常好看的图片并且只占几百bytes的体积。

如果可能的话,尽量使用css来创建一些特殊效果,而非图片。

不建议为网站设置背景图片,如果一定要有的话,在保证清晰度的前提下最大程度去压缩体积。你还可以把背景图当中镂空或保持透明来压缩体积。

好了,今天关于图片优化我就分享到这里,大家有无更好地建议?期待您的留言,咱们一起探讨共同进步。

—-想了解网站优化中的图片优化教程 优化图片须知的8个小技巧分享!且更多的seo优化教程关注<计算机技术网(www.ctvol.com)!!>

本文来自网络收集,不代表计算机技术网立场,如涉及侵权请联系管理员删除。

ctvol管理联系方式QQ:251552304

本文章地址:https://www.ctvol.com/seoomethods/461437.html

(0)
上一篇 2020年10月25日
下一篇 2020年10月25日

精彩推荐