重磅揭秘 | 图片优化技巧十点建议

敖游
2015-12-22
来源:遨游建站

如果,你运营在线商城,又或是大型电商网站,图片优化是你必须要掌握的,不仅仅是从吸引潜在消费者,还是增加图片搜索流量,又或是提升网站加载速度,图片优化扮演者非常关键的角色。但说到图片优化,很多传统意义上的SEO人会说,图片要加alt标签,图片要压缩……这样的粗线条显然是不行的。今天我就和大家深入分享一下,图片优化必须了解的8个知识点。
1、用结构化数据写产品图片ALT
正常的图片标签是有 5 大标签(width、height、alt、src、Title)但是好多在写标签时往往会把 alt、Title 这两个标签给省略掉。但是这两个标签才是图片中最主重要的,要是没有这两个标签搜索引擎是没有办法去识别图片是什么东西,所以就不可能收录这张图片。

我们经常会习惯性的,使用照相机默认的图片编号当做图片的名称,这样的话,对于搜索引擎来说就没有办法辨识图片的内容,从而我们就失去了从图片搜索那块儿带来的流量,这是非常可惜的,特别是当你的产品有数以万计的话,通常我们可以制定结构化数据规则,让技术人员设计程序批量替换图片的alt属性,而无需我们手工操作。
我们要思考一下,访客的搜索习惯是什么?会搜索哪些关键词?最好可以再看一下,谷歌统计里面的关键词数据,看看有无遗漏,基本上来说,访客更倾向于搜索“品牌词+产品词”组合和变化,那么,alt标签的结构化规则就出来了,可以写为:alt="{品牌词}{产品系列}-{产品型号}"。对于产品图片的描述来说,不建议写过多冗余内容,保持数据结构化,做到关键词辨识度高,关键词信息丰富就可以了,千万不要做关键词堆积。

图片周边文字

图片周边描述文字也会影响到图片在搜索引擎上的排名,除了图片名和alt标签之外,图片周围需要配一些文字描述。这些文字要围绕着alt标签中的关键词来写,这能加强图片和内容的相关性,更容易使图片在搜索引擎上排名靠前。

2、图片拍摄角度问题
基本上拍摄产品照片不会只拍一个角度,访客肯定不会满足于只有一张正面照,多角度的去展示产品,才能更好的吸引访客在你的网站上,停留更多的时间,才可以去激发起他们的购买欲望,所以,自然需要拍摄产品的正面、背面、侧面、细节等角度,这个时候如何写alt标签?最好的方法也是保持alt标签的结构化,继承主图的格式,千万不要去给这些图片一个全新的写法,正确的写法如下:

alt={品牌词}{产品系列}-{产品型号}-正面
alt={品牌词}{产品系列}-{产品型号}-背面
alt={品牌词}{产品系列}-{产品型号}-侧面
保持主干"{品牌词}{产品系列}-{产品型号}"不变,可以让搜索引擎充分确认当前图片系列,或者页面就是关于那个产品的关键词,从而让这些图片被图片搜索引擎搜索到的几率大大增加,单枪匹马一定倒下。
3、关于大图的显示问题
如果,你希望提供更大的图片让用户爽一下,这个思路很好,但要非常小心,不建议将大图直接放在网页上,然后用css将图片缩小,虽然你看上去图片变小了,但是图片的尺寸还是实际存在的,这会影响加载速度。相反,你可以先放一张较小的图片,然后提供查看大图功能的选项,不管是点击弹出大图,还是另外新页面显示,都“ok”。
当然,还有一些人会把大图切成一张张小图做拼接,这样做可以让图片快速显示,但同时一张图片切成小图之后,服务器的请求数会增加,从而会影响网页加载速度。所以,如果图片的体积实在过大的话,建议为图片专门配置新服务器。
4、给图片减减肥
先看看这些数据,大部分台式机或是笔记本用户,不会等待超过3秒的网站加载速度……在移动设备上不会等待超过5秒钟,亚马逊发现,如果他们的网站加载速度慢了1秒钟,他们一年将损失16亿美元,搜索引擎将网站加载速度,列入了排名算法之中,如果,你大量的网站图片非常臃肿,这将严重影响网站加载速度,如果超过10秒钟,那你等着和你的客户说“byebye”吧!
最普遍的问题:网络图片文件应该多大?
清晰的图片更加有利于用户体验,图片不宜过大(指图片的内存属性不宜过大,并不是指图片的尺寸大小,图片内存较小,网页打开速度瞬间就能起飞)所以建议最好采用JPG格式保存,也可以选择“存储为web格式”即可。控制图片的大小让网站打开速度飞起来。

有些理论说,图片的大小应该保持在70kb以下,不过这个大小是很难把握的,特别对于大图片来说,几乎是不可能的,除非你不求清晰度。我个人倒是觉得,不要用一个标准去限制每一张图片的大小,关键在于,我们有没有去执行,有没有看到遨游建站这篇文章后去真正压缩图片,这才是关键。

5、用对图片格式
目前,有三种非常流行的图片格式,他们分别是:JPEG、GIF、PNG。让我们来看看他们有何不同:

JPEG (或者说 .jpg) 是最常用的图片压缩格式,支持最高级别的压缩,通常,对于显示要求比较高的图片来说,JPEG格式展示的图片效果较GIF和PNG有明显的优势;
GIF (.gif) 的图片显示质量要比JPEG逊色很多,通常用作非常简单的图片展示,比如素材或者装饰性图案,gif也可以用来制作动画,gif不适合用作高显示质量的图片;
PNG图片是比gif更好的选择,因为PNG图片支持的色彩要比GIF多。此外,和JPEG一样,PNG反复保存也不会影响图片质量,而且对于小图来说,PNG占用的体积极小,PNG完美支持透明背景,所以一般logo或一般装饰性图案都会选择PNG格式。

注意PNG-24”图片体积会3倍的大于同样情况下的“PNG-8”图片,对待PNG你要十分小心,保存时看仔细了
通过对比相同体积下(都是24kb),不同格式的图片显示效果,经过测试可以看到,JPEG 是获胜者,在同样的体积下,GIF和PNG必须以牺牲图片质量为代价,不过话又说回来,如果对于非常小的图片来说(比如小于5K),PNG是比较好的选择,相比GIF,PNG可以在体积很小的情况下,依然不会让图片失真。
当我们选择图片格式时,可下一些tips供大家参考,对于电商网站来说,产品图片的质量要求极高,JPEG毫无疑问是首选,他们有相对高质量的图片显示且不会占用太大的体积。
绝对不要用GIF来当做产品大图,不然的话文件尺寸会非常大,也没有很好的办法去压缩它(一压缩就失真),可以用GIF做动画或是装饰性小图。
PNG可以作为JPEG和GIF的替代,如果你想把产品图片做成PNG格式,尽量用PNG-8而非PNG-24,PNG同时也擅长处理简单地装饰图,而只需很小的体积,PNG将会变得越来越流行。
顺便提一句,大部分的图片编辑软件,可以转换以上三种形式的图片格式。
6、正确看待缩略图
大部分电商网站都有缩略图展示,它可以让访客迅速的扫描到,尽可能多的商品样式,而不需要再去点击一个额外的页面。
缩略图很棒,但是要小心,他们可能是你网站的速度杀手,他们通常会出现在关键的购物流程之中,若因此影响了购物流程的流畅性……那你就可能又损失了一个顾客,关于缩略图,我个人有如下两点建议:
6.1、尽可能压缩缩略图体积,缩略图的图片不要过高的追求显示质量,当用户点击到下一层详情页面的时候,再给他一张高质量的图片。
6.2、尽量不要为缩略图设置alt标签,通常我们并不希望搜索引擎索引的是缩略图,而应是产品详情页的高质量原图。
7、使用图片地图
如果,你的网站用JS做图片效果来更好的提升用户体验,你是否担心图片能不能收录问题?当然,通常来说,蜘蛛是不会爬取,不显示在源代码里面的图片文件的,但是,谷歌对于这点已经很有经验了,通过图片地图的提交,即把图片地址一个个老老实实地列出来,搜索引擎就可以爬行了。
对于图片地图,我就不多说了,因为,谷歌有许多指导文档来帮助你,提升图片的搜索排名。
8、留心装饰性图片
非产品类的图片,比如背景图、按钮图、边框图等都可算作装饰图,作为一个seo优化者,你需要仔细去检查这些图片的体积,看看是否过大,是否会影响网站载入速度。
这里提供一些关于如何压缩装饰图的建议
8.1、如果,只是一些边框类或是简单的样式图片,使用PNG-8或者GIF,你可以创建非常好看的图片,并且只占几百bytes的体积;
8.2、如果可能的话,尽量使用css来创建一些特殊效果,而非图片。
8.3、不建议为网站设置背景图片,如果一定要有的话,在保证清晰度的前提下最大程度去压缩体积。你还可以把背景图当中镂空或保持透明来压缩体积。

9、图片与内容的关联性

我们于展开图片改进的时,需留意的是,搜寻引擎辨别一个网页与否优质的规范,看的是网页内容的关联性,这里的网页内容绝不单单指的是文字,还有图片。尽管搜寻引擎绝不能非常好的辨识照片,但是绝对不能说图片不关键,由于网页的观众群体是用户,假如图片用的好,能引发用户的爱好,增加用户的黏性。最好的是用百度的图片侵权风险检测检测图片原创度。

10、使用良好的CDN进行图像传输

一旦解决了图像的大小和加载到特定页面上的图像数量,下一步就是确保快速加载网站上加载的图像。减少图像加载时间不仅可以帮助您获得更快的整体页面加载时间,从而更好地在您的网站上获得用户体验,还可以帮助您在搜索引擎上排名更高。


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


阅读205
分享
写评论...