分享笔记:

如何自动添加图片描述和 ALT 替代文本

自动填写图片ALT文本

网站搜索引擎优化很繁琐的一项任务就是上传的图片添加常见的属性标签,例如 title、alt、description 和 caption,保证它们具有语义化的标题和标签,帮助搜索引擎和用户正确地索引这些图片。

应该自动填写图片标签嘛?

如果你有一个小博客或者只有少量文章时,手动操作添加图片标签绝对是最好的方法。但是在其他情况下,比如一家很大的新闻网站或者一个有很多写手的网站,要让团队正确给图片添加标签几乎是不可能的。这种情况下,最好的选择可能就是自动填写图片需要的信息。

在 SEO 中任何自动化操作都有可能适得其反,影响你的网站排名。如果因为应用了本篇笔记里的某些技巧,导致某篇文章或网站的 SEO 表现变差,别来沾边。

警告过后,接下来我们就来看看如何在WordPress自动化图像的 SEO 标签信息。

如何在 WordPress 自动化图片的 SEO 标签

WordPress 有多种方法可以自动化图片的 SEO 标签。你根据自己的需求选择即可。

通用的 SEO 插件

如果你在用WordPress做网站,那么你的网站肯定是有安装一款搜索引擎优化插件的,而现在大多数市面上的 SEO 插件都可以自动化图片标签的生成。通过这些插件,你可以配置参数,自动为图片生成 titlealtdescription 等标签,通常基于图片的文件名或文章标题。

首先告诉你,Yoast SEO 就算是它的 PRO 版本也不包含任何可以自动化标签优化的功能。Yoast SEO 只会提醒你图片缺少标签,而不会自动生成标签。相反,其他插件像 Rank Math、All in One SEO 或 SEOPress,都可以通过不同的方式提供这个功能。

wordpress seo 搜索引擎优化插件

All in One SEO 只有在它的付费版本里提供这个功能,允许通过使用格式或标签自动为图片添加 ALT 和 title 属性,类似于自动生成其他标题的方式。你可以预先定义规则,自动从内部标签生成图片的 title、alt 和说明标签。

all in one seo 插件图片优化

这种方法的优点是,它的工作原理与文章标题的自动标签生成相同,操作简单。

all in one seo 搜索引擎优化插件添加图片alt代替文本
All in One SEO

另外一个我非常推荐的搜索引擎优化插件就是 Rank Math SEO它的免费版就提供了自动添加 `alt` 和 `title` 属性的选项,同样可以使用插件的内部标签来生成这些属性,为用户提供了极大的灵活性。

rank math seo 插件优化图片alt
Rank Math SEO

最后,如果你使用 SEOPress,在免费版也有一个非常完善的图片 SEO 设置界面。通过这个页面,你可以自动添加图片属性,不过它相对来说更加手动。这样的方法是否更好,就看你的需求了,选择权在你手上。它可以完全自动化地添加 `alt`、`title` 标签,还可以添加图片的说明和描述,但这里是基于文件名的,这代表你上传图片时要认真地用描述性词为图片文件命名。

seopress 插件优化图片alt
SEOPress

如果你上传的图片文件名为 “IMG-20241025-1432.jpg”(直接从相机或手机导出),插件会将其转为 “IMG 20241025 1432”,去掉连字符、标点符号和文件扩展名,不会自己随意生成标题或 alt 代替文本内容。所以我们上传图片的时候图片名要注意一下

SEOPress 还提供了一项进一步个性化的功能:可以把文章设置的目标关键字作为图片的 alt 属性,使图片的 alt 标签与文章的 SEO 目标完全一致。

其他图片SEO优化插件

除了上面提到的搜索引擎优化插件,还有一些专门做图片优化的插件可以生成未填的图片内容。

  • Alt Text AI: 主要用于自动为你上传的图片添加 alt 标签,它通过 ChatGPT 的 API 分析图片内容来生成标签,尤其擅长生成描述性内容。它还可以给已经在媒体库上传了的图片批量添加 alt 标签。
  • AI for SEO: 支持更多种类的属性标签,可以自动生成 title、alt、说明和描述标签。

自定义代码添加图片缺失文本

另一种实现这的方法就是使用自定义代码。很多插件就是基于这些功能开发的,与其使用一堆带额外的功能不然直接用代码添加需要的功能。

/* 自动填写文章标题到特色图片alt文本上 */
function jhchen_title_alt_featured_image($metadata, $object_id, $meta_key, $single) {
if(isset($meta_key) && $meta_key == '_wp_attachment_image_alt'
&& get_post_thumbnail_id() == $object_id
&& $single === true
){
$original_value = get_post_meta(
$object_id, '_wp_attachment_image_alt', false
);
if(empty($original_value)){
return get_the_title();
}
}
return $metadata;
}
add_filter('get_post_metadata', 'jhchen_title_alt_featured_image', 10, 4);

这个代码适用于所有主题,能够稳定地将文章标题设为特色图片的 alt 文本

在极少数情况下,我会使用另一段代码来实现同样的效果。以下是备用代码:

/* 文章标题替代特色图片 alt */
add_filter( 'post_thumbnail_html', 'jhchen_title_alt_featured_image', 10, 5 );
function jhchen_title_alt_featured_image( $html, $post_id, $post_thumbnail_id, $size, $attr ) {
$post_title = get_the_title();
$html = preg_replace( '/(alt=")(.*?)(")/i', '$1'.esc_attr( $post_title ).'$3', $html );
return $html;
}

这段代码的功能与前一个相同,也能很好地把文章标题设为特色图片的 alt 文本。不过它是每次页面渲染时进行实时替换的,所以和网站缓存不兼容。

自动将文件名设为图片的 title、alt、说明和描述属性

如果我们采用之前提到的 SEOPress 插件的策略,可以使用以下代码实现相同的功能,而不需要依赖插件。唯一的要求是,在上传图片之前,你需要给文件命名一个描述性的名称,之后代码会自动处理所有内容。

/* 自动填写图片缺失信息 */
add_action( 'add_attachment', 'jhchen_alt_img_auto' );
function jhchen_alt_img_auto( $post_ID ) {
// 检测上传媒体是否是图片,如果不是不做任何操作
if ( wp_attachment_is_image( $post_ID ) ) {
$my_image_title = get_post( $post_ID )->post_title;
// 去除名称多余符号
$my_image_title = preg_replace( '%\s*[-_\s]+\s*%', ' ',  $my_image_title );
// 首字母大写,不需要删除下面的代码即可
$my_image_title = ucwords( strtolower( $my_image_title ) );
// 根据需要选择保留或去除特定的属性
$my_image_meta = array(
'ID' => $post_ID, // Specify the image (ID) to be updated
'post_title' => $my_image_title, 
'post_excerpt' => $my_image_title, 
'post_content' => $my_image_title, 
);
// 图片 alt 代替文本
update_post_meta( $post_ID, '_wp_attachment_image_alt', $my_image_title );
// 标题、提要、内容
wp_update_post( $my_image_meta );
} 
}

选择有很多,具体使用哪种方法看你自己勒。

为笔记评分

平均评分 5 / 5. 摘星者: 3

有疑问?留个言吧!

?>

更多结果...

Generic selectors
Exact matches only
Search in title
Search in content
Post Type Selectors