Автоматизация добавления alt-текстов к изображениям в WordPress с помощью YoastSEO

Почему важно автоматизировать alt-тексты для изображений в WordPress

Alt-тексты — ключевой элемент SEO и доступности сайта. Они помогают поисковым системам понять содержание изображения и обеспечивают пользователям с ограничениями зрения доступ к информации. Однако в крупных проектах или интернет-магазинах с WooCommerce вручную прописывать alt ко всем изображениям крайне трудозатратно. Автоматизация с помощью YoastSEO и кастомного кода позволяет повысить качество SEO без дополнительной нагрузки.

Диагностика проблемы: как понять, что alt-тексты отсутствуют или не оптимальны

Для проверки alt-тегов используйте следующие способы:

• Инструменты разработчика браузера: откройте консоль, найдите теги <img> и проверьте атрибут alt.
• Плагин YoastSEO: в анализе SEO отмечает изображения без alt-текста.
• Онлайн-сервисы для аудита сайта, например Screaming Frog SEO Spider, позволяют экспортировать список изображений без alt.

Если вы видите много пустых или одинаковых alt, это сигнал к автоматизации.

Пошаговое решение: автоматическое добавление alt на основе заголовка или имени файла

YoastSEO сам по себе не генерирует alt-тексты, но позволяет расширять функционал через хуки WordPress. Рассмотрим пример, где alt автоматически подставляется из заголовка записи или имени файла, если alt отсутствует.

1. Добавляем фильтр для автоматической подстановки alt

function auto_generate_alt_text($attr, $attachment = null) {
    if (!empty($attr['alt'])) {
        return $attr; // Alt уже есть
    }
    if ($attachment) {
        // Пытаемся взять заголовок вложения
        $title = get_post_field('post_title', $attachment->ID);
        if ($title) {
            $attr['alt'] = esc_attr($title);
            return $attr;
        }
        // Если заголовок пуст, используем имя файла
        $file = get_attached_file($attachment->ID);
        if ($file) {
            $filename = pathinfo($file, PATHINFO_FILENAME);
            $attr['alt'] = esc_attr(str_replace(array('-', '_'), ' ', $filename));
            return $attr;
        }
    }
    return $attr;
}
add_filter('wp_get_attachment_image_attributes', 'auto_generate_alt_text', 10, 2);

2. Проверяем работу на сайте

Вставьте на страницу несколько изображений без alt. Обновите страницу — alt должен автоматически подставиться из заголовка вложения или имени файла.

Проверка результата после внедрения

Для проверки:

• Откройте страницу и через инспектор браузера убедитесь, что у тегов <img> появился атрибут alt с корректным текстом.
• Проведите повторный аудит с помощью YoastSEO или Screaming Frog — количество изображений без alt должно уменьшиться.
• При необходимости очистите кэш сайта и браузера.

Частые ошибки и как их исправить

• Alt не меняется после добавления кода: проверьте приоритет фильтра, возможно, другой плагин переопределяет атрибуты, используйте более высокий приоритет, например 20 в add_filter.
• Пустые заголовки вложений: если заголовок пуст, добавьте его вручную или расширьте логику для генерации alt из других метаданных.
• Некорректное отображение символов: используйте esc_attr() для безопасности и корректного вывода.

Практические советы по безопасности и производительности

• Добавляйте код в дочернюю тему или через site-specific плагин, чтобы не потерять изменения при обновлении.
• Избегайте тяжелых операций внутри фильтра, чтобы не замедлять загрузку страниц.
• Если на сайте много изображений, используйте кеширование результатов генерации alt.

Сравнение способов автоматизации alt-текстов