图片优化须知的8个小技巧

2016-09-28    分类: 网站建设

图片优化是运营在线商城又或是大型电商网站必须要掌握的技能。因为图片不仅需要吸引潜在消费者,还可以增加图片搜索流量,同时也可以提升网站加载速度。但说到图片优化,很多传统意义上的SEO人会说,图片要加alt标签,图片要压缩等等这样的粗线条显然是不行的。其实只要注意了解8个方面就可以做到图片优化。

1. 用结构化数据写产品图片ALT

如果我们使用相机默认的图片编号直接给img标签加上alt,这样对于搜索引擎来说是不行的,因为搜索引擎没有办法来识别这一张图片的内容,这样就会损失图片带给我们的流量。

我们要思考一下,访客的搜索习惯是什么?会搜索哪些关键词?最好可以再看一下谷歌统计里面的关键词数据,看看有无遗漏。基本上来说,访客更倾向于搜索品牌 词+产品系列的词组组合和变化,那么alt标签的结构化规则就出来了,可以写为:alt=”{品牌词}{产品系列}-{产品型号}”。对于产品图片的描述 来说,不建议写过多冗余内容,保持数据结构化,做到关键词辨识度高,关键词信息丰富就可以了,千万不要做关键词堆积。

2. 图片拍摄角度问题

基本上拍摄产品照片不会只拍一个角度,访客肯定不会满足于只有一张正面照,多角度的去展示图片才能更好的吸引访客在你的网站上停留更多的时间,才可以去激发起他们的购买欲望,所以自然需要拍摄物体的正面,背面,侧面,细节等等,这个时候如何写alt标签?

最好的方法也是保持alt标签的结构化,继承主图的格式,千万不要去给这些图片一个全新的写法,正确的写法如下,

  • alt={品牌词}{产品系列}-{产品型号}-正面
  • alt={品牌词}{产品系列}-{产品型号}-背面
  • alt={品牌词}{产品系列}-{产品型号}-侧面

​保持主干“{品牌词}{产品系列}-{产品型号}”不变,可以让搜索引擎充分确认当前图片系列或是页面就是关于那个关键词,从而让这些图片被图片搜索引擎搜索到的几率大大增加。单枪匹马一定倒下。

3. 关于大图的显示问题

如果你希望提供更大的图片让用户爽一下,这个思路很好,但要非常小心,不建议将大图直接放在网页上然后用css将图 片缩小,虽然你看上去图片变小了,但是图片的尺寸还是实实在在存在的,这会影响加载速度。相反,你可以先放一张较小的图片,然后提供查看大图功能的选项, 不管是点击弹出大图还是另外新页面显示,都ok。

当然,还有一些人会把大图切成一张张小图做拼接,这样做可以让图片快速显示,但同时一张图片切成小图之后,服务器的请求数会增加,从而会影响网页加载速度。所以,如果图片的体积实在过大的话,建议为图片专门配置新服务器。

4. 给图片减减肥

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

5. 用对图片格式

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

  • 对于电商网站来说,产品图片的质量要求极高,JPEGs毫无疑问是选,他们有相对高质量的图片显示且不会占用太大的体积。
  • 绝对不要用GIFs来当做产品大图。不然的话文件尺寸会非常大,也没有很好的办法去压缩它(一压缩就失真)。可以用GIFs做动画或是装饰性小图。
  • PNG可以作为JPEGs和GIFS的替代,如果你想把产品图片做成PNG格式,尽量用PNG-8而非PNG-24。PNGs同时也擅长处理简单地装饰图而只需很小的体积,PNG将会变得越来越流行。

6. 正确看待缩略图

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

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

  • 尽可能压缩缩略图体积,缩略图的图片不要过高的追求显示质量,当用户点击到下一层详情页面的时候再给他一张高质量的图片。
  • 尽量不要为缩略图设置alt标签,通常我们并不希望搜索引擎索引的是缩略图而应是产品详情页的高质量原图。

7. 使用图片地图

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

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

8. 留心装饰性图片

关于如何压缩装饰图的建议:

  • 如果只是一些边框类的、或是简单的样式图片,使用PNG-8或者GIFs,你可以创建非常好看的图片并且只占几百bytes的体积。
  • 如果可能的话,尽量使用css来创建一些特殊效果,而非图片。
  • 不建议为网站设置背景图片,如果一定要有的话,在保证清晰度的前提下大程度去压缩体积。你还可以把背景图当中镂空或保持透明来压缩体积。
请登录网站了解更多成都创新互联科技有限公司的成都网站建设

公司http://chengdu.cdcxhl.com相关信息

新闻标题:图片优化须知的8个小技巧
浏览地址:https://www.cdcxhl.com/news/45160.html

成都网站建设公司_创新互联,为您提供微信小程序商城网站响应式网站网站维护外贸建站服务器托管

广告

声明:本网站发布的内容(图片、视频和文字)以用户投稿、用户转载内容为主,如果涉及侵权请尽快告知,我们将会在第一时间删除。文章观点不代表本网站立场,如需处理请联系客服。电话:028-86922220;邮箱:631063699@qq.com。内容未经允许不得转载,或转载时需注明来源: 创新互联

小程序开发