图片 SEO 完整指南

删除无用的图片

不要为了填满一个空间而创建大量图像.与创建图像作为事后的想法相同.您希望使用图像来增强您的内容和传达附加信息.正如我之前提到的，图像给网页增加了很多重量，所以如果图像不能增强您的内容，请离开.它.出来.

根据 Google 的数据，转化为与未转化的会话相比，用户拥有的图像少 38%.

更多的图像并非更好.事实上，如果您的内容有一些引人注目的图像，它们比具有大量图像的页面更有可能在搜索中出现.每个额外的图像都会从其他图像中窃取聚光灯，直到它们都没有任何明星的力量.出于同样的原因，画廊不会出现在搜索中，因此您要避免使用它们.

请勿在图片中包含文字

您希望避免在图像中包含文本.如果您有装饰性标题，则应使用 HTML 和 CSS 创建它.这不仅提高了可访问性和可读性，而且还允许您使文本移动响应.当您不想保留渲染文本所需的鲜明对比度时，您还可以提高图像的压缩级别.

为 SEO 准备最佳图像文件

一旦你决定了你的图像是什么，你需要采取一些步骤来准备图像文件.尺寸合适、压缩过、采用下一代格式并带有描述性标题的图像在搜索中的表现会更好.

我们还整理了图像优化终极指南，它扩展了以下内容.

调整尺寸

您在仔细阅读 Google 图片时会注意到，特别大和特别宽的图片(例如全景图片)往往不会出现在搜索中.大多数情况下，您会发现符合 4:3 或 16:9 比例的图片.

缩放图像

缩放图像 意味着将它们调整为您将在网站上使用的尺寸.如果您的图片过大，并且您使用 HTML 和/或 CSS 调整它们的大小以使其正确显示，则会为浏览器带来额外的工作并降低您的页面速度，这是我们不希望看到的.

您可以使用浏览器工具来确定图像需要的大小.

然后在您选择的编辑器中打开图像并将其调整为您将使用它的正确尺寸.

如果您有很多超大图片，Smush Pro CDN 等工具可以为您调整图片大小.您还可以使用 Photoshop 批量处理图像，但这只适用于 JPEG 图像.

视网膜图像

Retina 设备的像素是普通屏幕的两倍.我找不到任何证据表明 Google 会奖励具有较高页面排名的 Retina 图像，但我们可以假设，随着高清屏幕获得市场份额，这种可能性会越来越大，尤其是因为 Google 会奖励提供出色用户体验的网站.

为网络创建 Retina 图像很容易.您需要做的就是用两倍宽和两倍高的版本替换网站上的图像.为兼容设备提供正确的图像有点困难，但您可以使用像 WP Retina 这样的插件2x 使这变得容易.

我们整理了一篇关于在不降低 WordPress 速度的情况下将您的图像转换为 Retina 的帖子.

使用下一代格式

如果您最近使用过 Google 的 PageSpeed Insights，您可能已经注意到"以下一代格式提供图片"的机会消息.

Google 发布此消息的目的不仅是帮助创建更快的网络，而且他们还希望您考虑将所有图片转换为他们的开源 WebP 文件格式.用 Google 自己的话来说，您应该"旨在从 WebP 开始."下一代图像格式，例如 JPEG 2000 和 WebP，具有卓越的图像压缩能力.因此，您的网页不仅速度会更快，而且您还可以通过使用 Google 首选的图片格式来获得他们的青睐.

WebP 图像还具有 PNG、JPEG 和 GIF 的功能，所有这些功能都可以合并为一种格式，从而使全面转换变得容易且完全不费吹灰之力.

顺便说一下，

Smush Pro 可以帮助您提供 WebP 图像.您需要做的就是激活 CDN，将图像转换为 WebP 选项，您就可以开始了.免费试用 Smush Pro.

图像压缩

图像压缩是创建较小图像文件最容易被忽视的方法之一，而且做得对，您的访问者几乎不会注意到任何区别.

看看这两张图片.

一个被轻微压缩，而另一个根本没有被压缩.压缩后的图像小 2.5 倍.嗯，是的，请.

您可以在上传前使用 Adob​​e Photoshop 或其他图像编辑器等工具压缩图像，从而获得压缩的好处.或者您可以使用您猜到的图像优化插件，Smush 或 Smush Pro.两者都将使用我们闪电般快速的服务器完成工作并压缩您的图像.

如何为 SEO 命名图像:图像标题

在处理图像时您可以做的最后一件重要事情是使用描述性标题(而不是相机生成的默认标题)保存它.

您不想在图片标题中添加关键字，只需提供恰当的描述即可.这将有助于您的语义搜索引擎优化.

例如，我在雪地里的狗是 dog-in-snowy-forest.jpg.这比通用的 dog.jpg 更好.

如何提供对 SEO 友好的图片

好的，所以您已经经历了很多麻烦才能制作出令人垂涎的华丽图像.在本节中，我们将讨论您需要做什么才能提供服务.

您的图片如何到达很重要.没有人希望看到碧昂丝从没有崩溃的平托中走出来.您的图片值得更好.

在提供图像和网页时，您希望以速度为目标.

您需要满足三件事才能快速提供图片.

1. 启用浏览器缓存 – 静态缓存网页的加载速度比动态生成的网页快得多.浏览器缓存将允许您利用浏览器来存储站点文件，以便可以更快地加载后续页面.
2. CDN – CDN 现在无处不在.如果您的主机不提供包含您的托管计划的 CDN，那么他们甚至是您的主机吗?不.那不是真正的关系，我想要最好的.CDN 遍布全球，因此加载图片所需的数据传输速度更快.
3. 延迟加载 – 延迟加载不会更慢地加载图像.它对访问者正在查看的内容进行优先级排序，并等待加载首屏下的其他元素，直到需要它们为止.它提高了感知页面速度，尤其是在移动连接上.顺便说一下，我们刚刚为 Smush Pro 添加了延迟加载.

响应式图片

即使是最好的到来也不会将一个酸味的超大图像变成柠檬水 😉

正确提供图片的另一个方面是确保您使用的是响应式图片.这样您就不会试图在微型移动设备上提供巨大的图像.

响应式图像利用 srcset 属性为浏览器提供一个包含多种尺寸的多张图像列表以供选择.它不会下载和提供最大的图像文件，而是加载适当大小的文件.

响应式图像已在 4.4 版中添加到 WordPress 核心，因此您可能会被覆盖，但我仍然建议您检查主题文件中的图像.有时，只有页面内容中包含在 <img> 标签中的图像才会响应，而 CSS 文件中的背景图像和图标可能不是.您必须使用 CSS 媒体查询来提供不同尺寸的图片. >

我知道您并不是要让这些图片在搜索中排名，但它们会在移动设备上大大降低您的页面速度.至少要验证大背景图片是否具有响应性，因为这会增加最大的权重.

如何识别您的 SEO 图像

好的，现在我们已经到了您明确告诉 Google 您的图片所描绘的内容的部分.

图片标题

WordPress 中的图片标题与文件名标题不同.您在创建图像时添加的图像标题比 WordPress 媒体库中的图像标题字段更重要.前者有助于 SEO，而后者可以完全排除.

W3 警告不要在图片中使用标题属性，说:

警告:目前不鼓励依赖 title 属性，因为许多用户代理没有按照本规范的要求以可访问的方式公开该属性.

让我向您展示为什么图像文件名对 SEO 来说比您在 WordPress 媒体库中创建的图像标题更重要:

如上图所示，当您将图像导入 WordPress 媒体库时，更改标题字段中的图像名称不会更改图像 URL 中的文件名:

https://yourdomain.com/wp-content/uploads/2019/08/my-filename-matters-here.jpg

图像在搜索引擎中根据其文件名编入索引，而您在 WordPress 媒体库中为图像命名的名称主要影响它在附件页面中的显示方式......

图片搜索引擎优化的替代文字

当您将图片上传到 WordPress 时，您可以填写的最重要的细节之一是图片的 Alt 属性.它不仅可以提高使用屏幕阅读器访问您网站的访问者的可访问性，而且还是 SEO 的排名因素.

事实上，我们已经编写了一份关于如何在 WordPress 中编写图像 alt 标签以解决可访问性和 SEO 的综合指南.

您如何为图片编写对 SEO 友好的替代文字?

要为您的图片编写有效的 alt 属性，您需要对图片进行简洁的描述.您希望以这样一种方式来描述图像，如果有人看不到图像，就会理解图像中的内容，从而通过包含它来理解您想要传达的内容.

以下是野花草甸照片的一些图像替代文字示例:

alt text="yellow and purple wildflower meadow."

alt text="wildflower meadow in the mountains."

这两个图像替代文本示例都有效地描述了照片并提供了一些细节.

如果关键字可以帮助您描述图像中的内容，您可以包含这些关键字.

因此，如果您的帖子是 WordPress 中的图像分辨率，并且您包含一些自然图像和 WordPress 屏幕截图，就像我在这篇文章中所做的那样，那么在屏幕截图中包含诸如"WordPress 中的 Retina 图像"之类的关键字是合适的，但可能不适合自然摄影.

然而，编写替代文本还有很多.您在替代文本字段中输入的内容还取决于您的内容中使用的图像类型，这就是为什么我们建议您学习如何在 WordPress 中编写完美的图像替代标签.

图片说明和周围文字

您还会在上面的屏幕截图中看到媒体库中有一个空间供您添加标题.图片周围的标题和其他文字提供了图片上下文.

并非所有图像都需要标题，但标题的功能与正文中的标注类似.因为它们与文本的其余部分分开并突出显示，它们是四次尽可能被阅读.

更有理由将您的重点和关键字放入标题中，以推动您的观点并在此过程中创建对 SEO 友好的图像.下面是 Google:

Google 从页面内容中提取有关图像主题的信息，包括标题和图像标题.在可能的情况下，确保将图像放置在相关文本附近以及与图像主题相关的页面上.

但标题并不是唯一重要的相关文本.您需要在您希望 Google 最关注的明星图片附近添加关键字和相关词组.

描述呢?

描述用于图像附件页面.当您将图像插入帖子或页面时(如下面的"Hello World")，您可以选择要将图像链接到的位置.附件页面是选项之一.您在媒体库中设置的标题和描述将显示在页面上.这不是说"Hello World"的页面，而是 WordPress 仅使用此图像创建的附加页面.

这对 SEO 来说并不重要，除非您的目标是让您的附件页面排名.您可以在下面的示例主题附件页面中查看我的图像标题和描述的最终位置.( < 这句话实际上是一个很好的例子，说明图片附近的文字如何帮助 Google 理解图片的内容.)

元描述

您页面上的元描述确实会影响您的图片在搜索中的显示方式.

根据 Google 图片指南，您应该"检查您的页面标题和说明"，以帮助 Google"生成标题和摘要，以最好地解释每个结果及其与用户查询的关系."

页面元素

Google 还会考虑整个页面.页面标题是什么?网址是什么?即使这些与您的图片没有直接关系，Google 也会将它们用作排名因素.

如果可能，请在页面标题、页面 URL 和图片 URL 中包含您的关键字和相关短语.Google 使用网址路径和文件名来帮助它理解您的图片.

如果您使用 CDN 来提供图像，您需要避免更改 CDN 或激活 CDN 并停用.这会更改图片网址，并对您的图片排名产生负面影响.

加倍努力:图像站点地图、社交媒体标签和结构化数据

处理完上述所有事项后，在针对 SEO 优化图像方面，您比大多数人走得更远.如果您想为具有竞争力的关键字排名并需要加倍努力，请继续阅读.

XML 图片站点地图

为了确保 Google 将您的所有图片编入索引，您需要创建一个图片站点地图.如果您经常更新内容、拥有电子商务网站或拥有新网站并希望 Google 尽快将您的图片编入索引，那么站点地图就显得尤为重要.

如果您通过 Javascript 代码加载图片库，那么您需要创建图片站点地图，否则 Google 将无法"看到"这些图片.

您可以将图片添加到现有站点地图中，也可以仅为图片创建单独的站点地图.以下是您可以在 XML 站点地图中使用的图片标签. >

如果您想要一个简单的解决方案，您可以使用 SmartCrawl 生成站点地图. 安装插件后，访问仪表板，您可以在其中激活站点地图.只需按下蓝色的激活按钮.

然后在高级标签的包含图片部分，将开关拨动以在站点地图中包含图片.

社交媒体标签

我知道，这是图片发布的 SEO，但社交媒体标签可以帮助您间接创建对 SEO 友好的图片.

首先，什么是社交媒体标签?社交媒体标签是您标记内容的一种方式，因此当有人在社交网络上分享内容时，他们会分享您希望他们分享的内容.例如，您是否曾经在 Facebook 上分享过一个帖子，而图片是页面上的广告，而不是特色图片?社交媒体标签可以帮助您做到这一点.

Facebook、Twitter、LinkedIn 和 Pinterest 都支持 Open Graph，这是 Facebook 的社交媒体标签语言.Twitter 有自己的元标签，但如果 Twitter 社交媒体标签不可用，它会识别 Open Graph 数据.

图像的重要开放图谱标签是 og:image.

Og:image 允许您指定当有人分享您的帖子时您希望 Facebook 和其他社交网络显示的图像.Facebook 的理想图像尺寸是 1200 像素 x 627 像素或 1.91/1 的比例.这将确保您的图片覆盖整个提要的宽度.如果您的图片小于 400 x 209，则它只会显示为小缩略图.

要使用 og:image 标记，您需要将其放在网页的 <head> 部分:

<meta property="og:image" content="http://www.yourdomain.com/image-name.jpg"/>

您还可以使用 SmartCrawl 等插件来简化此操作.在此处免费试用.

在 SmartCrawl 中，转到 社交 部分.要启用 Open Graph，请转到 Open Graph 部分并按下开关.

要在 Open Graph 之外或代替 Open Graph 使用 Twitter 卡片，请转到 Twitter 部分并翻转 启用 Twitter 卡片 开关.

那么您为什么要为您的图片使用社交媒体标签?

有些推文被搜索引擎编入索引，并在搜索中突出显示(我们将在下一节详细讨论).并且 Twitter 上的权威人士将他们的权威授予他们推文的页面.在确定如何对内容进行排名时，Google 将此作为其信号之一.

此外，有证据支持社交媒体提及或"引用"您的业务，让它排名更高，尤其是在本地搜索中.

结构化数据

在我们开始讨论如何使用架构来标记您的内容之前，我想警告您，这可能并不总是增加流量的最佳策略.有时，如果您真的加倍努力并使用结构化数据来识别您的图像，矛盾的是，您最终会得到更少交通:

诸如精选片段、相关问题和知识面板等知识图功能确实显着减少了对传统自然搜索结果的点击.

如果使用 Google 的人无需点击进入您的网站即可获得他们需要的信息，那么这并不是对您的图像优化 SEO 时间的最佳利用，因此您需要考虑整个 SEO 策略.

例如，如果您网站上的图片是您产品的照片，那么您将获得积极的结果和流量.这不仅限于电子商务.例如，如果您是总承包商，并且拥有您改造房屋的照片，那么您将体验到同样的结果.如果您有食谱的特色图片，则相同.通过 Google 图片搜索的用户会跟踪图片路径，直到他们到达您的网站，从而增加流量.

另一方面，如果您想通过图表或信息图来增加流量，所有重要信息都可能在图片中，这样搜索者就不会点击进入您的网站.

如何在您的网站上使用结构化数据

最简单的方法是使用 SmartCrawl.在帐户部分，只需打开启用架构标记输出的开关即可.

如果您不使用 SmartCrawl，则需要使用 Schema 标记您的页面，Schema 是一种用于识别您网站上元素的共享词汇表.谷歌将理解所有不同的元素，而不是文本块，因为它们以整洁的结构被识别和组织.您可以在 schema.org 上探索架构语言.

Schema 使用不同的内容"类型"，每种类型都有"属性".例如，recipe 类型具有 image 和 cook time 等属性.

Google 更喜欢您使用 JSON-LD 格式标记您的网页.当涉及到图像时，您的图像必须是可抓取的.另外根据 Google 的指南:

将图像指定为结构化数据属性时，请确保该图像实际上属于该类型的实例.例如，如果您定义了 schema.org/NewsArticle.image 的图像属性，则标记的图像必须直接属于该新闻文章.

换句话说，有些内容类型没有图像.所以你不能在不允许图像的内容类型上使用图像属性.并且您必须包含所有必需的属性，以便 Google 考虑您​​的内容.

要在您的网站上使用结构化数据，您需要将 JSON-LD 数据添加到网页的 <head> 部分.这是有关如何做到这一点的深入说明.

澄清一下，结构化数据不是排名信号，但它可以帮助您的图片获得应有的关注.

仅此而已

哇，真是一段旅程！如果您已经做到了这一点，那么您就拥有了在 Google 图片搜索中绝对占据主导地位所需的所有信息.认真的.

与常规文本内容不同，如果您使用与其他网站相同的图片，您将不会受到处罚.相反，优化得最好的图像将获胜.

如果您想真正让您的网站获得最大的提升，我建议您安装 SmartCrawl、Smush 和 Hummingbird.拥有 WPMU DEV 会员资格免费试用，即可访问我们的所有插件等.您可以在不到半小时的时间内配置它们，并看到显着的性能提升.发生这种情况时，别忘了跳一段快乐的舞，像拍拍立得照片一样摇晃它 😉

标签:

• formats
• images
• mobile
• optimizing images
• SEO
• seo for images
• sitemaps
• wordpress images seo