网站图片优化主要方法有哪些?

2020年12月19日11:16:54
评论
183

图片是网页的基本组成元素之一。谷歌和雅虎将图片优化程度作为索引和抓取的参考标准之一;而在2013年年底,百度搜索引擎的搜索结果以图文并茂的形式进行展示。由此可见,图片的优化也是网页优化的重点。下面我们一起来看看网站图片优化主要方法有哪些吧。

网站图片优化主要方法有哪些?

图片优化是每个站长必须掌握的技能,首先,优质的图片能够第一时间吸引访客的眼球,增加网店的访问流量;其次,图片也是影响页面加载速度的关键性因素之一。那么,在本文中将主要介绍如何对图片进行优化。

一、图片大小与格式

为了提升网页图片的加载速度,方便用户在网站中的浏览,提升用户体验,网站对于上传的图片会有大小的限制,且不同的图片需要采取不同的保存格式。

1.图片的大小

根据权威的数据调查统计报告:通常情况下,PC端用户的等待加载时间不会超过3秒,移动端用户的等待加载时间不会超过5秒。如果网站的图片过大,会严重影响图片的加载,直接导致网站的跳失率过高。那么,该如何修改图片的大小呢?

站长可以通过Photoshop专业图像工具来修改图片的大小。在PS工具中打开需要修改的图片,单击菜单栏中的“图像”命令,在弹出的下拉菜单中再单击“图像大小”命令,如图所示。

网站图片优化主要方法有哪些?

在弹出的对话框中,将图片的宽度更改为500像素,高度和分辨率保持不变。更改完成后,对话框会自动显示更改后的图片大小为307.6KB,更改前的大小为687.2KB。最后单击“确定”按钮,即完成了图片大小的修改。

网站图片优化主要方法有哪些?

关于网站图片的大小,并没有严格的规定。在确保图片像素的前提下,尽量使用容量较小的图片,以缩短网站的加载时间,降低网站的跳失率。

2.图片的格式

目前有3种非常流行的图片格式,分别是JPEG、PNG和GIF。其中JPEG是最常用的图片压缩格式,支持最高级别的压缩;而PNG比GIF支持的色彩要多,占用体积小,支持透明背景,一般Logo或者是装饰性图案都会选择PNG格式;GIF容积较大,主要是动态图常用的存储格式。

在图片容积一定的情况下,JPEG格式是最佳的选择;但是针对容量小于5KB的图片,而PNG格式则最合适,不会让图片失真。大部分网站对网站图片的质量要求较高,且图片容积要小,毫无疑问JPEG格式是首选。

在PS工具中,单击菜单栏中的“文件”命令,在弹出的下拉菜单中再单击“存储为Web所用格式”命令。

在弹出的对话框中,将图片的格式设置为“JPEG低”,设置完成后即可看到图片的大小为21.85KB,如下图所示,最后单击“存储”按钮保存图片。

网页在加载的过程中,体积越小,加载的速度就越快,用户的体验就越好。因此,网页图片优化的核心点就是尽量减小图片的大小,在不影响图片质量的情况下进行无损压缩。

对于网站中相对比较固定的图片,为了合理利用缓存技术来提升页面的加载速度,网站可以适当延长这部分图片的过期日期,减轻图片加载对于服务器的压力。

网站图片优化主要方法有哪些?

网站图片优化主要方法有哪些?

如果网站中存在着一些出现频率高且体积较小的图片,网站可以采用CSS Sprite技术进行图片合并。CSS Sprite又叫作CSS精灵,是一种网页应用处理方式,它允许你将一个页面涉及的所有零星图片都包含到一张大图中去,这样一来,当用户访问该页面时,载入的图片就不会一幅幅地慢慢显示出来。

二、添加ALT标签

网站图片的优化主要是以图片为主,而图片的优化需要进行一定的补充说明,ALT标签则正好可以对图片进行精准的描述。站长可以根据图片的内容和网站服务项目来进行优化。

1.ALT标签的作用

ALT标签实际上是网站上图片的文字提示。在网页的图片中添加ALT属性具有双重效果,一是提升用户体验,当页面的图片由于某种原因不能加载的时候,在图片的位置上会显示图片ALT标签,如下图所示。这样用户就能清楚地知道图片的大致内容,浏览思路也不会被打断。

网站图片优化主要方法有哪些?

二是图片通过添加ALT标签能够提升SEO效果。一般来说,搜索引擎难以读取图片的内容。因此,在图片优化过程中添加ALT属性,使得索引器能够更好地理解图片内容。当图片不能加载的时候,系统会自动显示ALT标签指定的关键词,引导搜索引擎去抓取和索引,从而使网页被搜索引擎收录。

2.ALT标签的查看和优化

在初步了解了ALT标签的作用之后,就需要对ALT标签进行优化。而在优化之前,需要确定网站图片是否已经添加ALT标签。

(1)查看ALT标签

在网页的源代码中,调用网页搜索命令“Ctrl+F”,在源代码的右上角出现网页搜索框,输入查询关键词“<img”后按回车键,搜索框就会出现该网页中所有包含该关键词的结果,如图所示。

网站图片优化主要方法有哪些?

(2)ALT的优化

ALT标签在网页语言中的标准写法是:<img src="/图片路径"alt="图片描述"/>。

在ALT标签中,图片描述比较单一,都是直接用商品的名称命名。为了提升搜索引擎的收录,可适当增加关键词的数量。

例如,在第一个ALT标签中的描述是“系统工作台”,还可以设置为工作台、办公室工作台、前台接待台等。

ALT标签的描述最好简短明了,符合用户的搜索习惯,以便被搜索引擎收录。此外,不建议每张图片都设置ALT标签,也不能在每个标签上都采用关键词堆砌,这样可能被搜索引擎视为SPAM垃圾网站。

三、图片链接

当用户在浏览网页的时候,网站往往会在网页的两侧、底部添加一些相关内容推荐,以提升用户的访问深度。随着视觉营销理念的深入,往往以图文并茂的形式呈现给用户,能够在第一时间吸引到用户的注意力,提升网页的有效点击率。

如图所示是某电子商务网站的图文推荐,缩略图皆为网页文章中的插图,既增加了文章的阅读性,为用户提供了更加优质的用户体验,同时又更好地迎合了搜索引擎。

网站图片优化主要方法有哪些?

因此,在图片中增加站内链接是为了服务用户和搜索引擎。一方面,图片链接吸引搜索指数爬到与原网页相关度较高的页面,提升网站其他页面的收录量;另一方面,可以拓展用户在站内的停留时间,提升对网站的访问深度,降低网站的跳失率。

图片在网页的优化过程中扮演了相当重要的角色,不仅能吸引更多的访客,为网站带来大量优质流量;优化后的图片更加符合搜索引擎的检索规则,进而提升网站的收录量和排名。

大发贱志
  • 本文由 发表于 2020年12月19日11:16:54
  • 转载请务必保留本文链接:https://bigfa.com/239.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: