AI Image Alt Text

AIビジョンモデルを使用して画像フィールドのalt テキストを生成します。手動・自動生成の両方に対応し、言語を考慮した出力が可能です。

ai_image_alt_text
5,560 sites
24
drupal.org

インストール

Drupal 11, 10 v1.0.2
composer require 'drupal/ai_image_alt_text:^1.0'

概要

AI Image Alt Text モジュールは AI モジュールエコシステムの一部であり、AIビジョンモデルを使用して画像フィールドのアクセシビリティ準拠の alt テキストを自動生成します。このモジュールは Drupal の画像フィールドウィジェットとシームレスに統合され、「AIで生成」ボタンを追加することで、コンテンツ編集者がワンクリックで説明的な alt テキストを生成できます。

このモジュールは、生成された alt テキストを保存前に確認・編集できる人間参加型ワークフローをサポートしています。エンティティの言語を自動検出し、対応する言語で alt テキストを生成するため、多言語サイトに最適です。カスタマイズ可能なプロンプトは柔軟性のために Twig テンプレートを使用し、画像はAIプロバイダーとのコストと互換性を最適化するために画像スタイルを使用して前処理できます。

オプションのサブモジュール(AI Image Bulk Alt Text)は、サイト全体で alt テキストが欠落しているすべての画像を検索して修正するための一括インターフェースを提供し、既存コンテンツのアクセシビリティ準拠を簡単に改善できます。

Features

  • AIビジョンモデル(OpenAI、Anthropic、Fireworks AI など)を使用して画像フィールドの説明的な alt テキストを生成
  • 保存前の手動レビューのための画像フィールドウィジェット上の「AIで生成」ボタンによる人間参加型ワークフロー
  • 画像アップロード時の自動 alt テキスト生成(オプションでボタン非表示モードあり)
  • 多言語サポートのためにエンティティの言語で alt テキストを生成する言語対応生成
  • エンティティの言語名とファイル名のトークンを含む Twig テンプレートを使用したカスタマイズ可能な AI プロンプト
  • AI に送信する前に画像の解像度とフォーマットを最適化する画像スタイル前処理の設定(コスト削減)
  • 特定のAIプロバイダー/モデルの選択またはデフォルトのビジョンモデルの使用をサポート
  • サイト全体で alt テキストが欠落しているすべての画像を検索して修正するための一括 alt テキスト生成サブモジュール

Use Cases

新しい画像のコンテンツ編集者ワークフロー

コンテンツ編集者が記事に画像をアップロードすると、alt テキストフィールドの横に「AIで生成」ボタンが表示されます。クリックすると、画像が設定済みの AI プロバイダーに送信され、alt テキストフィールドに説明的でアクセシビリティ準拠の説明が入力されます。編集者はコンテンツを保存する前にテキストを確認・修正できます。

大量の画像があるサイトでの自動 alt テキスト

多くの画像がアップロードされるサイトでは、管理者は設定で「アップロード時に自動生成」を有効にできます。これにより、画像がアップロードされると自動的に alt テキストが生成され、オプションで生成ボタンを非表示にできます。編集者は生成されたテキストを確認するだけで済みます。

多言語 alt テキスト生成

異なる言語(ドイツ語やフランス語の翻訳など)でコンテンツを編集する際、モジュールは自動的にエンティティの言語を検出し、その言語で alt テキストを生成するよう AI に指示するため、アクセシビリティコンテンツの適切なローカライゼーションが確保されます。

一括アクセシビリティ改善

alt テキストが欠落している多くの画像がある既存サイトでは、管理者は AI Image Bulk Alt Text サブモジュールを有効にし、/admin/config/media/ai_image_bulk_alt_text に移動して、「AIで Alt テキストを一括生成」ボタンを使用して最大50枚の画像の提案を一度に生成できます。各提案を確認し、編集を加えて、すべての変更をまとめて保存できます。

ブランド一貫性のためのカスタムプロンプト

特定の alt テキストガイドラインを持つ組織は、設定で AI プロンプトをカスタマイズして、ブランドボイスを適用したり、特定の用語を含めたり、デフォルトを超えるアクセシビリティ基準に従うことができます。Twig テンプレートにより、画像ファイル名などの動的コンテンツをプロンプトに含めることができます。

Tips

  • 画像スタイル(デフォルトの「AI Image Alt Text」など)を使用して AI に送信する前に画像解像度を下げると、良好な alt テキスト品質を維持しながら API コストを大幅に削減できます
  • デフォルトのプロンプトを組織のアクセシビリティガイドラインやブランドボイスに合わせてカスタマイズしてください
  • 多言語サイトでは、モジュールが自動的にエンティティの言語で alt テキストを生成します - AI プロバイダーが必要な言語をサポートしていることを確認してください
  • AI は複雑または曖昧な画像を誤って解釈することがあるため、保存前に生成された alt テキストを確認してください
  • 一括生成サブモジュールは AI プロバイダーへの過負荷を避けるために画像を順次処理します - 大きなバッチには時間がかかります
  • 頻繁に画像をアップロードするが alt テキストを忘れがちなユーザーロールには自動生成を有効にすることを検討してください

Technical Details

Admin Pages 2
AI Image Alt Text 設定 /admin/config/ai/ai_image_alt_text

AI を使用した画像の alt テキスト生成方法を設定します。このページでは、AI に送信するプロンプトのカスタマイズ、画像前処理オプションの選択、使用する AI モデルの選択、自動生成動作の設定が可能です。

Alt テキストの一括生成 /admin/config/media/ai_image_bulk_alt_text

サイト全体で alt テキストが欠落しているすべての画像を検索して修正します。alt テキストのない最大50枚の画像をテーブルに表示し、個別または一括で alt テキストを生成し、提案を確認して変更を保存できます。

権限 2
AI Alt タグを生成

ユーザーが画像フィールドの AI alt テキストを生成することを許可します。この権限を持つユーザーには、画像フィールドウィジェットに「AIで生成」ボタンが表示されます。

AI 画像の alt テキストを一括修正

サイト全体で alt テキストが欠落しているすべての画像を検索して修正するための一括 alt テキスト生成ページへのアクセスを許可します。ai_image_bulk_alt_text サブモジュールによって提供されます。

Hooks 1
hook_field_widget_single_element_form_alter

画像フィールドウィジェットを変更して「AIで生成」ボタンを追加し、必要な JavaScript をアタッチします。alt フィールドが有効な ImageWidget インスタンスにのみ適用されます。

Troubleshooting 5
画像フィールドに「AIで生成」ボタンが表示されない

ユーザーが「Generate AI Alt Tags」権限を持っていること、画像フィールド設定で alt フィールドが有効になっていること、画像ビジョン機能を持つ動作中の AI プロバイダーが設定されていること(AI Image Alt Text 設定または AI モジュールのデフォルト)を確認してください。

AI プロバイダーが設定されていないという警告メッセージ

/admin/config/ai/ai_image_alt_text に移動して特定の AI プロバイダー/モデルを選択するか、/admin/config/ai の AI モジュール設定でデフォルトの「Chat with Image Vision」プロバイダーを設定してください。

alt テキスト生成時のエラー

選択した AI プロバイダーが画像ビジョンをサポートし、有効な API 資格情報で適切に設定されていることを確認してください。一部のプロバイダーにはサイズやフォーマットの制限があります。画像スタイルを使用して解像度を下げてみてください。

生成された alt テキストが間違った言語になっている

このモジュールは生成にエンティティの言語を使用します。コンテンツが正しい言語バリアントで編集されていることを確認してください。言語は {{ entity_lang_name }} トークンを介して AI プロンプトに渡されます。

一括生成ページに画像が表示されない

これは、すべてのコンテンツにわたる alt テキストが有効なすべての画像フィールドにすでに alt テキストが入力されていることを意味します。このページは alt フィールドが空の画像のみを表示します。

Security Notes 3
  • 画像ファイルは分析のために外部 AI プロバイダーに送信されます - これがコンテンツとプライバシー要件にとって許容可能であることを確認してください
  • 生成エンドポイント(/admin/config/ai/ai_image_alt_text/generate/{file}/{lang_code})は「generate ai alt tags」権限で保護されています
  • 処理前にファイルアクセスが検証されます - ユーザーは表示権限を持つファイルに対してのみ alt テキストを生成できます