图片优化对SEO优化的重要性

图片优化既是一门艺术,也是一门科学,图片优化是一门艺术,是因为单个图片的压缩不存在最好的特定性方案,而图片优化之所以是一门科学,是因为许多开发得很出色的方法和算法可以明显减小图片的大小。要找到图片的最优设置,需要按照许多维度进行认真分析:格式能力、编码数据内容、像素尺寸等。

很多SEO优化人员进行网站优化的时候,在内容上下足了功夫,往往却忽视了图片优化。今天我们一起来谈谈图片优化对SEO优化的重要性。
图片优化对SEO优化的重要性
文章源自MAY的SEO博客-https://may90.com/tech/images.html

一. 图片优化的重要性

你是喜欢看全篇都是文字的文章,还是喜欢看图文并茂的文章?May相信很多人都会比较喜欢看图文并茂的文章,这样不会太枯燥。好的图片能缓解用户视力疲劳,也能提高用户浏览体验;那搜索引擎呢?图片也是给搜索引擎看的,但是搜索引擎不能识别图片上的内容,图片需要优化后才能帮助搜索引擎更好地理解图片上的内容。文章源自MAY的SEO博客-https://may90.com/tech/images.html

二. 图片优化格式

不同的图片格式具有各自不同的特点,选择图片格式是图片优化的第一步。文章源自MAY的SEO博客-https://may90.com/tech/images.html

图片格式 压缩方式 透明度 动画 浏览器兼容 适应场景
JPEG 有损压缩 不支持 不支持 所有 复杂颜色及形状,尤其是照片
PNG 无损压缩 支持 不支持 所有 透明背景
GIF 无损压缩 支持 支持 所有 简单颜色,动画
APNG 无损压缩 支持 支持 Firefox, Safari, Safari iOS 半透明效果的动画
WebP 有损压缩 支持 支持 Chrome, Opera Android, Chrome Android Browser 复杂颜色及形状,浏览器有限制
SVG 无损压缩 支持 支持 所有(IE8以上) 简单图形,良好的放缩体验,动态控制图片特效

1. 需要颜色丰富的图片,JPEG(JPG)是通用的选择:文章源自MAY的SEO博客-https://may90.com/tech/images.html

JPG在压缩率不高的情况下保留的细节还是不错的;文章源自MAY的SEO博客-https://may90.com/tech/images.html

人眼的结构很适合查看JPG压缩后的图片,可以充分的忽略压缩后的部分并在脑中补齐细节;文章源自MAY的SEO博客-https://may90.com/tech/images.html

WebP能够比JPG减少30%的体积,但目前存在兼容性差的问题。文章源自MAY的SEO博客-https://may90.com/tech/images.html

2. 需要透明背景的图片,PNG比较好文章源自MAY的SEO博客-https://may90.com/tech/images.html

PNG可以为原图像定义256个透明层次,使得彩色图像的边缘能与任何背景平滑地融合,从而彻底地消除锯齿边缘。文章源自MAY的SEO博客-https://may90.com/tech/images.html

3. 需要较通用的动画,GIF是唯一的选择文章源自MAY的SEO博客-https://may90.com/tech/images.html

GIF格式的图片已经变成人们心目中约定俗成的动画格式,有多张图片保存为一个图片,形成动画的效果。

如果你实在是很难分清楚图片的格式,请记住:透明找PNG,动画找GIF,其他找JPG。

三. 图片优化尺寸

很多时候我们会很纠结,图片太大,打开的速度就会很慢;图片太小,看上去不是很清晰,影响用户体验。这时候往往需要我们来把握一个度,在尽可能保持图片清晰的前提下,让图片尽可能小。其中有一个需要我们特别注意的地方就是我们一定要控制图片的大小恰好是显示所需的尺寸,图片的大小恰好是显示所需的尺寸,图片的大小恰好是显示所需的尺寸,重要的事情说三遍!怎么理解?举个例子来说明,你上传的图片大小为200*200px,但显示的时候调整为100*100px,图片在展示时缩小,一方面图片给人的感觉是不清晰;另一方面浏览器需要先加载完200*200px大小的图片后再将图片缩小为100*100px,其中200*200-100*100=30000个像素是浪费的,影响了加载时间。再次提醒:图片大小恰好是显示所需的尺寸!

四. 图片优化属性

首先,我们要知道图片使用的是img标签,其中有五大属性:width、height、src、alt、title。正规的写法是将图片的五大属性写完整。我们有时候偷懒将一些属性忽略了,细节决定成败,完整地写好五大属性,无形中对图片进行了优化,对SEO优化有很重要的作用。

1. width和height属性分别定义图片的宽和高,搜索引擎在抓取的时候,就是根据width和height属性值来判断图片的尺寸。

2. src是定义图片的链接地址,可以是相对路径,也可以是绝对路径,各有优缺点,考虑以后可能会更换域名就使用相对路径;而绝对路径的优势就在于减少识别时间,有利于快速加载和SEO优化。

3. alt属性,到目前位置,搜索引擎蜘蛛还无法识别图片内容,alt属性值是给搜索引擎看的,是帮助搜索引擎更好地理解图片内容。在alt属性优化时,我们需要特别注意多张图片,不要重复解释,也就是每个alt属性值不要一模一样,且不要堆砌关键词,容易被认为有作弊的嫌疑。做好alt图片优化,会大大提高搜索引擎的友好度。

4. title属性,很容易被忘记和忽视,其实title和alt同样重要,当用户鼠标停留在图片上时会显示title中的内容,这对用户体验是很大的辅佐,同时也会多呈现一次关键词。

总结:图片优化SEO优化中重要的一个部分,帮助搜索引擎认识和理解图片内容,提高搜索引擎友好度;也帮助用户更生动地理解文字,方便用户阅读。

 

 

关键字:图片优化

我的微信
扫一扫微信,添加好友
weinxin
我的微信
我的微信公众号
关注公众号,了解最新动态
weinxin
我的公众号
 
  • 本文由 MAY的SEO博客 发表于 2019年4月6日
  • 转载请务必保留本文链接:https://may90.com/tech/images.html
什么是搜索引擎优化? SEO教程

什么是搜索引擎优化?

我们也许曾在某处看到或听到过“搜索引擎优化”一词。近年来,当数字营销接管传统营销时,搜索引擎优化的重要性和受欢迎程度日益增加。现在,什么是搜索引擎优化? 什么是搜索引擎优化? 搜索引擎优化是数字营销的...
什么是超文本? SEO教程

什么是超文本?

什么是超文本? 什么是超文本?超文本是提供指向其他文本的链接的文本,这些文本可以位于另一个网页,同一页面或文档中。通过单击超文本文档中的链接,用户可以快速跳转到其他内容。尽管超文本通常与网页相关联,但...
如何优化图片alt属性? SEO教程

如何优化图片alt属性?

alt是“alternative text”的缩写,译为“可替代文字”,是图片的简短文字说明。当由于某种原因图片无法查看时,alt将变得很有意义。精心编写的alt标签对您网站的可访问性以及搜索引擎优化...
什么是SEO?(一文秒懂) SEO优化

什么是SEO?(一文秒懂)

身边很多朋友都在问我:“你说你的职业是SEO,什么是SEO?是不是CEO啊?只相差一个字母耶。”每次我都很尴尬笑一笑。虽然只差一个字母,但是区别还是非常大的。对于没有接触过SEO的人来说问这个问题情有...
白帽SEO、黑帽SEO、灰帽SEO是什么? SEO教程

白帽SEO、黑帽SEO、灰帽SEO是什么?

黑帽和白帽在1920年代的西方电影中一直被使用。这是让观众分辨英雄和反派之间区别的简便方法。英雄戴白帽子。小人戴着黑帽子。这些年来,该术语已在各个行业中采用,尤其是安全性。黑帽子和白帽子是描述恶意和道...
评论  2  访客  1  作者  1
    • WordPress百宝箱 1

      图片SEO优化非常有用

        • MAY的SEO博客

          @ WordPress百宝箱 是的,有利于SEO优化。

      评论已关闭!