什么是图片SEO?
图片搜索引擎优化是优化你网站上的图片的过程,这样你的网页和图片可能会在免费的搜索引擎结果中排名更靠前。从而为您的网站带来更多的流量。
常见的图片SEO策略包括:
调整大小和压缩图像
为图像提供描述性文件名
向图像添加替代文本(alt文本)
SEO图像优化之所以有效,是因为它使谷歌等搜索引擎更容易找到并理解您的图像。这意味着他们更有可能为相关的搜索查询显示你的图片(以及它们所在的页面)。
优化后的图像加载速度也更快。并帮助用户获得他们需要的信息。这些都是谷歌在对搜索结果进行排名时看重的东西。
你的访客也会欣赏这些东西。
提示
使用Semrush的网站审计工具为您的网站获得图像SEO建议。
图片在搜索中可以出现在哪里?
图像搜索引擎优化的主要好处之一是它可以帮助您的图像出现在搜索引擎结果页面(serp)中。从而吸引有价值的用户点击。
许多用户直接访问谷歌Images。要得到这样的结果:
b谷歌Lens上每个月也有数十亿的搜索量。这是一个让人们进行视觉搜索的应用程序。,用他们的相机或图像搜索。
结果是这样的:
另外,谷歌定期在标准结果中显示图像。
例如:2024年4月29日,Semrush Sensor显示,美国55.62%的标准serp包含图像包。
比如这个:
图像结果对于吸引用户的注意力和点击非常有用。
但请记住,为图片做SEO也可以帮助你的其他排名。
如何为SEO优化图像
应用这些图片搜索引擎优化的最佳实践,让你的网站对搜索引擎更友好。增强用户体验。
1. 查找或创建有用的图像
SEO图像优化的第一步是选择或创建支持您目标的图像。
例如:
照片可以展示产品和分割文本块
平面设计可以传达抽象的概念
图表和图形可以显示复杂的数据
图标可以改善网站导航和可用性
商标可以加强你的品牌形象
截图可以提供清晰的说明和示例
尝试创建自己的图像,而不是使用库存图像。这样,你就能为用户提供独特的价值,让谷歌有更多理由对你进行排名。
如果您确实使用了其他人创建的映像,请确保您具有必要的权限。否则,你可能会违反版权法。
提示
我们的最佳内容创建工具列表提供了许多用于图像创建和采购的有用工具。
2. 选择正确的图像格式
您可以将图像文件保存或转换为许多不同的格式。
SVG通常是图标和徽标的最佳选择。因为svg可以在没有任何质量损失的情况下调整大小。并使用JavaScript或CSS(网站编码语言)进行操作。
WebP是其他类型图像的最佳格式之一。因为:
主要的搜索引擎、互联网浏览器和社交媒体网站都支持它(尽管一些旧的浏览器/系统不支持它)。
它通常创建比其他格式更小(因此加载速度更快)的文件
它支持透明度和动画
它使用有损和无损压缩(这有助于确保文件大小和图像质量之间的良好平衡)
然而,SVG和WebP图像可能更难创建和管理。
最好的选择是:
标准图像的JPEG
PNG用于具有透明度、文本或大量细节的图像
用于简单动画的GIF
3. 给你的图片一个描述性的文件名
谷歌使用图像文件名来更好地理解图像所描述的内容。因此,最好的做法是为您的图像提供描述性(但简洁)的文件名。
例如:
?apple-iphone-15-pink-side-view.jpg
?苹果最新iphone - 15 -模型-活力-粉色-颜色-方-角-视图展示-相机镜头和按钮- 2024 release.jpg
?IMG00353.jpg
请注意
不能在文件名中使用空格。谷歌建议用连字符分隔单词。
如果您在内容的翻译版本中使用相同的图像,请确保相应地更新文件名。
例如,您可以在西班牙语域名中使用文件名iphone-apple-15-rosa-vista-lateral.jpg。
4. 添加描述性Alt文本
Alt文本是存储在网页代码中的图像的书面描述。
具体来说,它在图像标记的alt属性中排序。是这样的:
Alt文本主要用于辅助功能:文本到语音的工具可以大声朗读这些描述,以便视障用户知道图像所传达的内容。
当页面加载不正常或加载缓慢时,它就会出现。
但是,所有文本对图像搜索引擎优化也很有用。因为搜索引擎使用所有文本来更好地理解图像所描绘的内容。
以下是一些alt文本的最佳实践:
仅为功能性图像编写所有文本,而不是装饰性图像。这确保了使用辅助技术的人们获得较少的破坏性体验。
描述图像在上下文中重要的方面。例如,如果你使用同一个图表来展示不同的观点,那么每个例子都使用不同的文本来清楚地解释你的观点。
最大长度不超过125个字符。一些辅助技术此时停止读取所有文本。
如果你的所有读者都需要知道一些事情,那就把它放在正文内容或图片说明中——而不是全部文本中。所以每个人都能接触到。
避免使用像“image of”或“photo of”这样多余的短语。很明显,所有文本都指向图像。
你可以用Semrush的网站审计工具检查你的图片是否缺少所有文本。
打开该工具并按照提示启动审计。
然后,进入“Issues”报告,在搜索栏中搜索“alt attribute”。查找“# images don ‘t have alt attributes”警告。
点击“# images”查看受影响的图像。
如果您不想将所有文本添加到图像中,因为它是装饰性的,请单击眼睛图标以隐藏结果。
否则,去你的网站并添加图像和文本。(正确的方法取决于你的网站设置。如果你需要帮助,请与开发者联系。)
然后,您可以重新运行您的站点审计,以检查一切工作正常。
5. 调整图像
将图像大小调整为更小的尺寸有助于减少加载时间。而且它不会影响图像质量。
一般来说,网站图片的宽度不需要超过2500像素。
但特定图像所需的最大尺寸取决于:
容器的最大宽度:如果你的图像被放置在一个容器中(在网页设计中用于管理布局的元素),它不应该大于容器的最大尺寸
图像的用途:例如,您可能需要大的产品照片,以便用户可以放大细节并清楚地看到它们——但是缩略图可以小得多
用户的设备:使用谷歌Analytics 4来查看访问者使用的屏幕分辨率,这样你就知道你需要迎合什么样的尺寸
图像编辑和创建工具(如Photoshop)通常可以很容易地调整图像大小。
但是你可以使用一个网站插件来自动调整你上传的图片(例如,WordPress的Resize Image After upload)。
6. 压缩图片
各种工具和插件允许您压缩图像-即。,减少图像文件大小,同时保持所需的图像质量水平。
是这样的:
一些最流行的选项包括TinyPNG、Squoosh和GIMP。
无论你选择什么工具,你都需要配置各种设置来达到预期的结果:
设置
描述
准则制定
有损与无损
有损压缩通过删除“非必要”图像数据来减小文件大小。无损压缩减少文件大小而不影响质量,但通常节省较少的空间。
有损
品质因数
对于有损压缩,通常可以选择从0到100的质量因子。数字越高,质量越高,文件大小越大。
75 - 85
决议
这通常用每英寸像素数(PPI)或每英寸点数(DPI)表示。数字越高,质量越高,文件大小越大。
72 dpi
7. 使用响应式图像缩放
响应式图像缩放意味着网站图像会根据用户视窗(显示网页的屏幕部分)的大小自动调整。
它有助于确保在各种设备上都有良好的用户体验。因为它可以防止图像太难看到(例如,在移动设备上太大或在桌面上太小)。
因此,响应式图像缩放可以最大限度地减少加载时间,因为图像不会比需要的更大。这就是它对图像搜索引擎优化有好处的主要原因。
你可以在这里看到响应式图像缩放:
您可以使用CSS使图像响应。
一些网站建设者(如Wix)默认使用响应式图像缩放。如果没有,你需要找一个合适的插件或从web开发人员那里得到帮助。
8. 实现延迟加载
延迟加载确保内容直到显示在用户的视口中才加载。
这意味着初始加载时间只受页面上方内容(用户在滚动之前看到的页面部分)的影响。因此速度更快。
实现延迟加载最简单的方法是为图像标签添加loading=“lazy“属性。
是这样的:
< img src = “ image-file-example.jpg”加载= “懒惰“alt=“ alt文本移到这里”>
只对出现在每种设备类型的折叠下方的图像执行此操作。否则,您将使页面变慢而不是变快。
9. 创建一个图像站点地图
图像站点地图是专门为图像制作的XML站点地图。
换句话说,它是一个特殊格式的文件,其中列出了您希望搜索引擎抓取和索引的图像(即,查找并添加到可能的搜索结果数据库中)。
创建图像站点地图有助于确保搜索引擎机器人在爬行您的网站时不会错过任何重要的图像。
谷歌建议你这样构建你的图像站点地图:
< ?xml version=“1.0“ encoding=“UTF-8“?>
< urlset xmlns = “ http://www.sitemaps.org/schemas/sitemap/0.9 “
xmlns:图像= “ http://www.google.com/schemas/sitemap-image/1.1 “ >
< url >
< loc >[网站网页的网址]< / loc >
<图片:图片>
<图片:loc >[本网页图片的网址]< /图片:loc >
< /图片:图片>
<图片:图片>
<图片:loc >[此网页另一张图片的网址]< /图片:loc >
< /图片:图片>
< / url >
< url >
< loc >[您网站上另一个网页的网址]< / loc >
<图片:图片>
<图片:loc >[本网页图片的网址]< /图片:loc >
< /图片:图片>
< / url >
< / urlset >
有许多站点地图生成器工具可以帮助您。
创建图像站点地图后,使用Semrush的站点审计工具检查任何问题。
打开“问题”报告,搜索“站点地图”。
您将立即看到是否有错误、警告或通知需要处理。
单击“为什么以及如何修复它”以获取有关任何问题的更多信息。
点击蓝色链接查看详细报告。
10. 使用内容交付网络
内容分发网络(CDN)允许您在世界各地的多个服务器上托管图像。
这提高了加载速度,因为数据从每个用户“最近”的服务器传输。而不是每次都从原始服务器传输。
距离的远近并不一定取决于地理位置,而是取决于哪个服务器能够更快、更可靠地传输数据。
如下图所示:
为你的图片实现一个CDN,你需要:
选择一个CDN提供商(例如,Cloudflare或Amazon CloudFront)
整合CDN与您的网站(例如,通过插件)
上传你的图片到CDN
更新您的DNS记录,以便图像请求通过CDN
修改您的网站HTML(和您的图像站点地图),以引用新的图像url
你将需要网络开发人员的帮助。
11. 启用浏览器缓存
浏览器缓存是指访问者的浏览器在指定的时间内存储某些文件(如图像)。这样,当它们再次被请求时,它们可以更快地加载。
假设一个新用户访问你的主页:
如果你的网站标志被缓存365天,当用户点击到你网站的另一个页面时,它会加载得更快。并且/或者在接下来的一年中再次访问你的网站。
如果您的站点徽标没有缓存,则浏览器每次都需要重新下载图像。这会消耗更多的带宽,并增加服务器必须处理的请求数量。
通常,图像可以缓存很长时间,因为它们很少更新。
您可以使用谷歌Lighthouse来查看站点上的图像是否被缓存了适当的持续时间。
安装Chrome扩展后,选择灯塔查看器选项来分析特定网页。
12. 应用页面SEO最佳实践
页面搜索引擎优化是优化页面以在搜索结果中排名更高的过程。它还可以帮助页面上的图像表现得更好。
首先,写一个描述性的标题标签。
谷歌查看这个标题是为了更好地理解你的页面是关于什么的。它还会影响出现在搜索结果旁边的标题链接。
例如,David Austin Roses在其中一个页面上使用了“杏&橙玫瑰”的标题标签。
这个标题出现在一个相应的图像结果旁边:
也要写一个有效的元描述。
这是可以出现在搜索结果中的页面摘要。是这样的:
为了减少文本被截断的风险,标题最好写50-60个字符,元描述最好写105个字符。
更多的优化思路,使用Semrush的网页SEO检查。
它提供基于最佳实践和竞争内容分析的定制建议。
13. 添加结构化数据
向站点添加结构化数据(也称为模式标记)可以增加获得丰富片段搜索结果的机会,其中包含引人注目的额外元素,例如图像。
例如,Cooking Classy使用模式标记来帮助谷歌识别其funfetti蛋糕食谱的主图像、评论、准备时间和配料。
这有助于它获得像下面这样丰富的结果:
可以使用模式为文章、事件、组织等指定图像。
还有一个ImageObject模式,允许您提供关于图像的额外细节(例如,创建者的名称和图像许可证的链接)。
这些细节可能显示在谷歌图像结果中。是这样的:
有关每种模式类型的详细信息,请访问谷歌的指南。
实现模式后,使用Semrush的Site Audit工具检查它是否正常工作。
如果您发现“#结构化数据项无效”错误,请点击查看报告。
然后可以看到受影响的url和字段。并采取纠正措施。
14. 优化你打开的图形元标签
你可以使用Open Graph元标签来确保你的页面在各种平台(如社交媒体网站)上共享时得到最佳预览。
每个页面都有四个必需的属性:
title指定应该出现在预览中的标题
Og: type指定对象的类型(例如“article”)
log:image指定要预览的图片的URL
log:url表示页面的url
您还可以添加许多其他类型的标签。
例如,Semrush的主页使用以下Open Graph标签:
这是你在Facebook上分享链接时的样子:
如果你的网站建设者不允许你自定义打开图形元标签,你可以使用像Yoast SEO这样的插件来代替。
如果你需要帮助,可以向开发者求助。
如何检查你的网站的图片
你可以用Semrush的网站审计工具检查你网站上的图片和SEO问题。
设置好项目后,转到“问题”选项卡。然后搜索“图像”。
您将看到7项检查的结果:
# internal images are broken:链接到您的站点并托管在您的域名上的图像不能工作,可能是因为文件被删除了
加载速度慢:加载速度慢的页面,其中优化不佳的图像可能是一个因素
# external images are broken:链接到你网站上的图片,由外部域名(例如,CDN)托管,可能是因为URL输入错误
# images don ‘t have alt attributes:图像标签不包含任何alt文本的实例
#在robots.txt中阻止内部资源的问题:您的域上的资源(如图像)通过您的robots.txt文件被阻止,因此无法访问搜索引擎
# resources被格式化为页面链接:当一个href链接包含资源的url(例如,图片)而不是网页时,通常应该使用另一个标签
#在robots.txt中阻止外部资源的问题:资源(如图像)在另一个域中通过网站的robots.txt文件被阻止,因此无法访问搜索引擎
如果您有任何“错误”,请单击蓝色链接以了解更多信息。
例如,下面是一个关于内部图像损坏的报告。
使用眼睛图标来隐藏任何不需要修复的问题。
然后,使用复选框和“发送到…”按钮在Semrush CRM、Trello或Zapier中创建任务。
在解决任何图像搜索引擎优化“错误”之后,移动到“警告”,然后是“通知”。
也检查该工具标记的任何其他问题。它们都可能对你的SEO表现产生负面影响。