电子商务网站图片优化有那些技巧？假如你运营在线商城又或是大型电子商务网站,图片优化是你需要要学会的.不止是从吸引潜在买家,还是增加图片搜索流量,又或是提高网站加载速度,图片优化饰演者很重要的角色.但说到图片优化,不少传统意义上的网站优化人会说,图片要加alt标签,图片要压缩…如此的粗线条显然是不可以的.今天我就和大伙深入推荐一下图片优化需要知道的8个要点。
1. 用结构化数据写商品图片ALT
大家比较容易用照相机默认的图片编号当做图片们的命名,如此的话对于搜索引擎来讲,可能就没方法辨识图片的内容,从而大家就失去了从图片搜索那块儿带来的流量,这是很可惜的,尤其是当你的商品有数以万计的话.一般大家可以拟定结构化数据规则让技术职员设计程序批量替换图片的alt属性,而不需要大家手工操作.
大家要考虑一下,访客的搜索习惯是什么?会搜索什么关键字?最好可以再看一下Google统计里面的关键字数据,看看有无遗漏.基本上来讲,访客更倾向于搜索品牌词+商品系列的词组组合和变化,那样alt标签的结构化规则就出来了,可以写为:alt="{品牌词}{商品系列}-{商品型号}".对于商品图片的描述来讲,不主张写过多冗余内容,维持数据结构化,做到关键字辨识度高,关键字信息丰富就能了,千万不要做关键字堆积.
2. 图片拍摄角度问题
基本上拍摄商品照片不会只拍一个角度,访客一定不会满足于只有一张正面照,多角度的去展示图片才能更好的吸引访客在你的网站上停留更多的时间,才能去激起起他们的购买欲望,所以自然需要拍摄物体的正面,背面,侧面,细节等等,这时怎么样写alt标签?
最好的办法也是维持alt标签的结构化,继承主图的格式,千万不要去给这类图片一个全新的写法,正确的写法如下,alt={品牌词}{商品系列}-{商品型号}-正面
alt={品牌词}{商品系列}-{商品型号}-背面
alt={品牌词}{商品系列}-{商品型号}-侧面
维持主干"{品牌词}{商品系列}-{商品型号}"不变,可以让搜索引擎充分确认目前图片系列或是页面就是关于那个关键字,从而让这类图片被图片搜索引擎搜索到的几率大大增加.单枪匹马肯定倒下.
3. 关于大图的显示问题
假如你期望提供更大的图片让用户爽一下,这个思路非常不错,但要很小心,不主张将大图直接放在网页上然后用css将图片缩小,虽然你看起来图片变小了,但图片的尺寸还是实实在在存在的,这会干扰加载速度.相反,你可以先放一张较小的图片,然后提供查询大图功能的选项,无论是点击弹出大图还是另外新页面显示,都ok.
当然,还有一些人会把大图切成一张张小图做拼接,如此做可以让图片迅速显示,但同时一张图片切成小图之后,服务器的请求数会增加,从而会干扰网页加载速度.所以,假如图片的体积实在过大的话,建议为图片专门配置新服务器.
4. 给图片减减肥
先看看这类数据,大多数台式机或是笔记本用户不会等待超越3秒的网站加载速度…在手机上不会等待超越5秒钟
亚马逊发现假如他们的网站加载速度慢了1秒钟,他们一年将损失16亿USD搜索引擎将网站加载速度列入了排名算法之中
假如你很多的网站图片很臃肿,这将严重干扰网站加载速度,假如超越10秒钟,那你等着和你的顾客说byebye把.
图片文件应该多大?
有的理论说图片的大小应该维持在70kb以下,不过这个有时是非常困难的,特别对于大图片来讲几乎是不可能的,除非你不求明确度.我倒是感觉,不要用一个标准去限制每一张图片的大小,重要在于,大家有没去实行,有没看到我这篇博文后去真的压缩图片,这才是重要.
5. 用对图片格式
现在有三种很时尚的图片格式,他们是JPEG,GIF,和PNG.让大家来看看他们有什么不同,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)不同格式的图片显示成效,经过测试可以看到,JPEG
是获胜者,在同样的体积下,GIFs和PNGs需要以牺牲图片水平为代价.不过话又说回来,假如对于很小的图片来讲(譬如小于5K),PNG是最好的选择,相比GIF,PNG可以在体积非常小的状况下依旧不会让图片失真.
当大家选择图片格式时,如下一些tips供大伙参考,对于电子商务网站来讲,商品图片的水平需要极高,JPEGs毫无疑问是最佳选择,他们有相对优质的图片显示且不会占用太大的体积.
绝对不要用GIFs来当做商品大图.不然的话文件尺寸会很大,也没非常不错的方法去压缩它(一压缩就失真).可以用GIFs做动画或是装饰性小图.
PNG可以作为JPEGs和GIFS的替代,假如你想把商品图片做成PNG格式,尽可能用PNG-8而非PNG-24.PNGs同时也善于处置简单地装饰图而仅需非常小的体积,PNG将会变得愈加时尚.
顺便提一句,大多数的图片编辑软件可以转换以上三种形式的图片格式.
6. 正确看待缩略图
大多数电子商务网站都有缩略图展示,它可以让访客飞速的扫描到尽量多的产品样式而无需再去点击一个额外的页面.
缩略图非常棒,但要小心,他们可能是你网站的速度杀手.他们一般会出目前重要的购物步骤之中,若因此影响了购物步骤的流畅性,额…
那你就可能又损失了一个客户.关于缩略图,我有如下两点建议:
尽量压缩缩略图体积,缩略图的图片不要过高的追求显示水平,当用户点击到下一层详情介绍页面的时候再给他一张优质的图片.
尽可能不要为缩略图设置alt标签,一般大家并不期望搜索引擎索引的是缩略图而应是商品详情介绍页的优质原图.
7. 用图片地图
假如你的网站用JS做图片成效来更好的提高客户体验,你是不是担忧图片是不是还能网站收录?当然一般来讲蜘蛛是不会爬取不显示在源码里面的图片文件的,但Google对于这点已经非常有经验了,通过图片地图的提交,即把图片地址一个个老老实实地列出来,搜索引擎就能爬行了.
对于图片地图,我就不多说了,由于Google有很多指导文档来帮你提高图片的关键词排名,看这里.
8. 留神装饰性图片
非商品类的图片譬如背景图、按钮图,边框图等都可算作装饰图,作为一个优化者,你需要仔细去检查这类图片的体积是不是过大,会不会影响网站载入速度.
这里有一些关于怎么样压缩装饰图的建议:
假如只不过一些边框类的、或是简单的样式图片,用PNG-8或者GIFs,你可以创建很漂亮的图片并且只占几百bytes的体积.
假如可能的话,尽可能用css来创建一些特殊成效,而非图片.
不主张为网站设置背景图片,假如必须要有些话,在保证明确度的首要条件下最大程度去压缩体积.你还可以把背景图当中镂空或维持透明来压缩体积.
好了,今天关于图片优化我就推荐到这里,大伙有无更好地建议?期待你的留言,咱们一块探讨一同进步。
文章题目电子商务网站图片优化有那些技巧
