图片优化如何影响SEO运作?优化5大步骤与7招技巧大解析
图片优化如何影响SEO运作?优化5大步骤与7招技巧大解析
图片优化是提升网站SEO效果的重要环节。本文将为您详细介绍图片优化的定义、重要性、具体步骤和技巧,帮助您优化网站图片,提升用户体验和搜索引擎排名。
图片优化是什么?认识图片优化让您的 SEO 更进一步
(一)图片优化是什么?图片优化简介
图片优化(Image Optimization)是一种处理图像文档的过程,最终目的在于取得图像品质和效能之间的平衡。图片优化通常应用于网络媒体管理、网页设计与行动应用开发等。
Google 图片搜索的运作过程也包括爬取、索引和排序 3 个步骤。Google 图片机器人会透过爬取网站上的图片,将其存入资料库后建立索引,以便日後提供使用者图片。而 Google 也秉持「提供用户最佳解决方案」的精神,信息越丰富的图片排名将越有机会靠前。
(二)图片优化重要性为何?4 大好处一次看
1. 提升网站 SEO 表现与优化用户体验:
搜索引擎将网站的效能纳入排名考虑因素之一。用户能顺畅的载入网站和应用程式,不仅能够提升用户体验,也有助于提高网站排名。因此图片优化与SEO运作有密切关系。
2. 提升网站速度与应用程式效能:
图片优化可以大幅减少网页载入与应用程式反应的时间,提供更快速的用户体验,这将有效提高访问者停留时间和转换率。
3. 节省设备储存空间:
在行动应用程式中,优化图片可以减小应用程式容量,节省用户设备上的储存空间。
4. 提供跨平台兼容性:
使用图片优化可以确保图像在各种设备与浏览器上都能够正确显示,不会因是否兼容而出现载入问题。
图片优化技巧有哪些?带你看 5 大步骤与 7 招技巧
(一)图片优化步骤
步骤 1:选择与文章内容相符的图片
首先,你必须选择与文章内容相符的图片,这会让网页整体内容更加丰富生动。适当且引人注目的图片会提高用户点入网页的意愿,相对的,如果用户感觉到「图文不符」的话,则会降低用户体验喔!
步骤 2:添加适当的图片档案名称
为图片添加有意义的档名,将帮助搜索引擎更好地理解图片内容,提高图片曝光度。因为Google 搜索引擎无法读取图片内的文字,因此它会参考其他文字内容或档案名称来决定搜索结果。
档案名称建议可以尝试用叙述性文字取代无意义的数字编号,例如比起使用「IMG00001.jpg」,置换成「a_happy_bird_in_the_tree.jpg」显然更恰当。
步骤 3:调整图片档案大小与尺寸
调整图片档案大小以及尺寸,将有利于提高网站速度和用户体验。你可以选择直接调整图片的尺寸大小,使其符合网页需求。当然你也可以直接压缩图片档案至最小,但必须确保图片不失真和影响图片呈现品质。
步骤 4:适当的描述图片内容(Alt)
如同前面提到的,Google 搜索引擎爬取图片时无法读取到图片上的文字,因此必须靠我们手动替图片加上描述性文字,也就是Alt 替代文字。
尤其当网页无法正常显示图片或视觉障碍用户浏览网页时,图片 Alt 将确保我们提供了足够的文字信息,帮助用户理解图像的内容与功能。另外,设置图片 Alt 时也要避免刻意塞入过多关键字,叙述也应该简短,只要能呈现图片的内容即可。
步骤 5:替图片加上合适的标题叙述
当 Google 搜索引擎在读取图片主题时,除了图片档名与图片 Alt 文字描述之外,还会爬取周围文字纳入判别范围。因此,在图片附近添加标题描述将有助于 Google 判别图片主题。这里就不得不提到另一个容易与图片 Alt 搞混的「Img Title」。
在 HTML 的 Img 标签中,除了 alt 属性,还有一个常被混淆的属性是 title,两者有不同的用途与呈现方式:
- Img Title:作为图片的标示文字,当鼠标移到图片上时会显示出来。
- Img Alt:作为替代文字,当图片无法显示时,能看到描述图片内容的文字。
从程式语法来看,两者的差异就很明显了:
- Img Title 语法:
<img src="图片网址" title="鼠标移上来就会看到这段文字">
- Img Alt 语法:
<img src="图片网址" alt="鼠标移上来就会看到这段文字">
总而言之,两者在使用上必须特别注意,不要搞混了。
(二)7 招图片优化技巧不藏私分享
1. 选择合适的图片格式并压缩图片档案
为图片选择适合的图片格式,将有助于图片在网页上的呈现品质。以下表格提供目前最多人使用的图片格式类型,帮助大家选择最适合自己网站设定的图片格式:
档案大小 | 图片品质与压缩率 | 建议的图片类型 |
---|---|---|
GIF | 大图时档案容易过大且不易压缩 | GIF 只支援 256 色,通常为非破壞性压缩 |
PNG | 图像複杂时档案較大 | 比 GIF 支援更多顏色且品質穩定,通常是非破壞性壓縮 |
JPG | 適合大幅壓縮來降低圖檔大小 | 較能取得品質和大小的平衡,通常是破壞性壓縮 |
WebP | 適合大幅壓縮且 WebP 的檔案大小比 PNG 檔少了 45% | 優秀的壓縮率和品質,並支援透明度 |
AVIF | 有效降低檔案大小,但又保有圖片品質 | 支援 PNG 的透明度、JPEG 的照片質感,也支援類似 GIF 的動畫功能 |
如果有图片档案压缩需求时,可善用线上压缩网站与资源。以下推荐图片档案压缩的线上工具,可依照自身习惯选择:
2. 行动装置友善
我们应该确保图片在电脑、iPhone、Android、平板等各种装置上都能正常浏览与显示,这能有助于提升网站流量和曝光率。另外,也能启用响应式图片设计,让网页可以根据自身环境选择适当的图片档案格式。
3. 加入结构化资料
所谓的结构化资料是指透过表单呈现系统性的资料,比如商品的名称、种类和价格等栏位。当搜寻引擎在爬取时,添加结构化资料能帮助它快速读懂网页所要提供的资讯。
4. 建立图片 Sitemap
图片Sitemap是一个特别纪录图片讯息的档案,你可以理解为这是一個图片档案地圖,上面記載了每個圖檔的個別資訊。這份地圖將引導搜尋引擎能更快速的讀取網頁上的圖片資料,讓圖片有更高機率出現在使用者搜尋結果中。
5. 避免版權爭議
網路發達的時代讓我們能夠更快速便利的取得需要的圖片,但仍需慎選圖片來源,避免日後遇到版權爭議。
6. 遇到大量圖片時善用延遲載入
延遲載入 (Lazy Loading) 让网页开启后不会一次载入全部图样,而是随着用户往下滚动浏览时再陆续显示。如此可降低载入时间,提高用户体验。
7. 善用浏览器快取
设定浏览器快取可让重复造访同一网页的用户,在后续造访网站时不必再下载图片,可有效提升网站载入速度。
4 大图片优化常见问题与解方
(一)日常工作繁多,图片优化真的有必要吗?
如同前面所提到的,图片优化涉及网站排名高低,当你和竞争对手的网站内容、效能不相上下,那图片优化可能就会成为在 SEO 排名至关重要的加分项!
因此建议还是要使用图片优化策略来维持网站排名的竞争力喔!当然,如果自身没有余力可以操作的话,建议可找厂商或SEO 公司代为执行。
(二)害怕遇到版權爭議,有推薦的免費圖庫嗎?
隨著網路的快速發展,線上的免費圖片資源也愈來愈豐富,以下推薦 4 個連新手小白都能輕鬆上手的免費圖庫資源:
(三)添加浮水印是否会影响图片优化?
由于 Google 搜索引擎现阶段还没办法直接辨识图片上的内容,所以添加浮水印不会干扰搜索引擎收录图片的成效,但还是要留意浮水印在图片中的占比不要过多而影响用户阅读体验喔。
(四)网页图片都要填入 Alt 替代文字吗?
由于一个网站内图片最多可能上达百张,全部优化显然要花费不少时间与精力。因此以下整理了「务必」以及「可不用」优化的图片类型:
務必填入 Alt 的图片类型:
- 产品图片
- 服务项目与流程图片
- 与内容营销相关的自制图片
- 专利技术与文件说明图
- LOGO 图片
可不用填入 Alt 的图片类型:
- 非自制图片
- 仅作背景或装饰用图片
- Icon 图示