帮助文档

产品图片优化


      电子商务中由于不像线下交易可以看到产品的颜色、外观、质量等等,所以电商中产品图片就至关重要了,而产品图片不仅影响用户的购买欲,也影响网站的加载速度,因此,产品图片不仅需要高清,而且产品的大小也需要控制在一定的范围,本篇着重分享产品的优化

     网站的图片大小才663.99KB,右边是一个没有优化过的网站,图片就占了3MB,网站的打开速度可想而知哪个更快了。

 

首先我们来看下什么叫图像优化呢?

      图像优化是指在不牺牲质量的前提下尽可能减少图像文件的大小,这样页面载入时间就会缩短。也可以叫做图像搜索引擎优化。也就是说,当我们告诉搜索引擎这张图片代表的内容是什么,是否与你的文章匹配,可以提升搜索引擎抓取收录网站从而获取到排名

 

下面来跟大家详细的讲解下该如何优化网站的图片?

1、用关键词来命名您的图片

2、优化ALT标签

3、减少图片的文件大小

4、选择正确的文件格式

5、使用图片sitemap

6、图片原创

一、用关键词来命名你的图片

很多的用户不注重图片的命名,经常会出现如下命名:

例如:微信图片_201903271024.JPG

或者是一些根本看不懂的乱码,这些都是不注重seo的表现,那如何书写才是正确的呢?

尽可能的在命名中添加关键词,但是要注意不要堆砌关键词。

例如:下图命名为4s5d4hd6dh51h2s4.JPG 和 Venice.JPG,显然肯定是后者更好,直接用关键词命名更好

 

二、优化ALT标签

      首先我们要知道ALT标签的作用是什么?即当我的图片打不开时,alt消息才会显示出来。网页访问者能够通过ALT标签来判断该图片的内容。在alt标签中加入关键词是很好的提升关键词排名的方法。

在shopify后台添加alt标签特别简单,上传好图片之后直接在图片上点击alt就可以了。

 

 

填写上alt文本点击完成即可。

我们通常会多角度的去展示一个产品,这样才能吸引用户在网站上停留更多的时间,更好的去激发他们的购买欲望,所以需要拍摄物体的正面,背面,侧面,细节等等,这个时候该怎么写alt标签呢?

最好的方法是保持alt标签的结构化,保留主图的格式,不需要再给其余的图片一个新的名字,正确的写法:

alt={品牌词}{产品系列}-{产品型号/序列号}-正面

alt={品牌词}{产品系列}-{产品型号/序列号}-背面

alt={品牌词}{产品系列}-{产品型号/序列号}-侧面

保持主干“{品牌词}{产品系列}-{产品型号/序列号}”不变,可以让搜索引擎确认这是一个系列或者这是相同的关键词,从而让这些图片提升被搜索引擎搜索到的几率。

 

三、减少图片的文件大小

能用css样式替代的就尽量少用图片,能用列表的少用缩略图,能用色彩替换的少用大图做背景。这3点非常的重要。

当我们上传图片的时候,建议每张图片的大小都不要超过200K,控制在100K以内是最好的。

建议使用:https://tinypng.com/  图片优化后再上传,可以看到优化了81%

 

四、选择正确的文件格式

在我们的网站中一般是建议用JPG格式的,JPG格式的图片较小,图片质量也相对更好。

图片为动画形式,则可以使用GIF动画格式,存为JPG图片就不会动了。

图片为透明或半透明格式的,则建议使用24位PNG格式图片,例如logo,兼容性更好,边缘也展示的更好。

 

五、使用图片sitemap

网页抓取工具无法抓取未在网页源代码中专门调出的图像。所以为了让抓取工具知道未识别的图像,我们可以在图像站点地图中列出其位置。

在robots.txt文件中插入下面的链接显示站点地图的路径:

Sitemap:http : //example.com/sitemap_location.xml

或者可以使用Search Console将网站地图提交给Google

在制作图片站点地图的时候一定要准守google的准则。如下:

https://support.google.com/webmasters/answer/178636?hl=en

 

六、图片原创

这个非常重要,很多人都是在网站随便找的一张图片,这个对于网站权重来说是没有帮助的。搜索引擎不可能一直抓取重复的图片。

当然有些人说我没有自己的设计师,小团队,那怎么办?这里给大家推荐一些比较好的图片资源,至少比直接百度,google得到的图片质量要高的多。

Flickr(这个大家应该非常熟悉)

https://www.flickr.com/

Splitshire(免费可商用的图片库)

https://www.splitshire.com/

Pixabay(百万张免费高清图片)

https://pixabay.com/

Pexels(提供高清尺寸且质量好的免费照片网站)

https://www.pexels.com/

Stocksnap(可以快速的搜索到自己想要的高质量图片)

https://stocksnap.io/

7MX(国内的高人气图片平台)

http://7mx.com/

这些都是比较小的细节点,有很多人觉得对这些不是很重视,但是如果长久的坚持下来,你就会发现差距了