Automatic Alternative Text

Automatically generates alternative text for images using Microsoft Azure Cognitive Services Computer Vision API when no alt text has been provided by the user.

auto_alter
186 sites
60
drupal.org

インストール

Drupal 11, 10, 9 v2.0.5
composer require 'drupal/auto_alter:^2.0'

概要

Automatic Alternative TextモジュールはMicrosoft Azure Cognitive Servicesと連携し、Drupal内の画像に対してAIを活用した代替テキスト生成機能を提供します。コンテンツ編集者が代替テキストを入力せずに画像をアップロードまたは保存すると、モジュールは自動的にAzureのComputer Vision APIにクエリを送信し、画像を分析して説明文を生成します。

このモジュールはエンティティ保存時に透過的に動作し、すべての画像フィールドを検査して、空の代替テキストフィールドにAI生成の説明文を自動入力します。また、画像アップロード直後に代替テキストを提案するオプション機能も提供しており、編集者は保存前にAI生成テキストを確認・修正できます。

生成された説明文にはAzure APIからの信頼度スコアが含まれ、オプションでステータスメッセージを通じてユーザーに表示できます。1MBを超える画像の場合、モジュールは自動的にスケーリングした派生画像を作成し、APIリクエストを最適化して帯域幅の使用量を削減します。

コンパニオンサブモジュール(Automatic Alternative Text Translation)は、Azureから返される英語の説明文をAzure Translator Text APIを使用してサイトの現在の言語に翻訳する機能を追加します。

Features

  • エンティティ保存時にMicrosoft Azure Computer Vision APIを使用した代替テキストの自動生成
  • 画像アップロード時の代替テキスト即時提案オプション
  • すべてのコンテンツエンティティタイプのすべての画像フィールドをサポート
  • APIリクエスト最適化のため1MBを超えるファイルの自動画像スケーリング
  • 生成された代替テキストと信頼度パーセンテージを表示するステータスメッセージ
  • インライン画像の代替テキスト生成のためのCKEditor画像ダイアログとの統合
  • 設定時に認証情報を検証する組み込みAPI検証機能
  • API通信問題の包括的なエラーログ
  • 生成された英語の説明文を他言語に翻訳するサブモジュール

Use Cases

Improving Accessibility Compliance

Organizations required to meet WCAG accessibility standards can use this module to ensure all images have meaningful alternative text. When content editors forget to add alt text or lack time to write descriptions, the module automatically generates appropriate text, helping maintain accessibility compliance across the site.

High-Volume Content Sites

News sites, e-commerce platforms, or other content-heavy sites where editors upload many images daily benefit from automated alt text generation. Editors can review and refine the suggestions rather than writing descriptions from scratch, significantly reducing content creation time.

Multilingual Sites

Sites serving multiple language audiences can combine the main module with the translation submodule to automatically generate and translate alt text. The Computer Vision API analyzes images and returns English descriptions, which are then translated to the visitor's language (German, French, Spanish, etc.).

Legacy Content Migration

When migrating content from systems without alt text or importing large image libraries, this module can automatically populate alt text for images that lack descriptions, improving the accessibility of migrated content without manual intervention.

CKEditor Inline Images

Content editors inserting images directly into WYSIWYG content using CKEditor can click the 'Get suggestion' button in the image dialog to generate alt text without leaving the editor, streamlining the content creation workflow.

Tips

  • Test your Azure API configuration using the built-in validation on the settings form before relying on automatic alt text generation
  • Enable 'Show status message to user' during initial setup to verify the module is working and see confidence scores
  • Use the 'Make suggestion' option to allow editors to review and improve AI-generated descriptions before saving
  • Monitor your Azure API usage to avoid unexpected costs, especially on high-traffic sites
  • The module creates an 'auto_alter_help' image style that scales images to 1440x1440 and converts to JPG - this is used automatically for files over 1MB
  • Consider the translation submodule if your site serves non-English audiences - it adds minimal overhead and ensures localized alt text

Technical Details

Admin Pages 2
Automatic Alternative Text /admin/config/media/auto_alter

Configure the Microsoft Azure Computer Vision API integration for automatic alternative text generation. This page allows you to enter your Azure API credentials and control how the module behaves when generating alt text.

Translate Automatic Alternative Text /admin/config/media/auto_alter/translate

Configure the Microsoft Azure Translator Text API to translate the AI-generated English descriptions into other languages. This settings page is provided by the auto_alter_translate submodule.

権限 1
Administer Automatic Alternative Text

Access the Automatic Alternative Text configuration pages to manage Azure API settings

Hooks 3
hook_entity_presave

Examines all image fields on content entities during save operations. For any image without alt text, calls the Azure API to generate and populate the alt text automatically.

hook_form_alter

Modifies entity forms to provide alt text suggestions when images are uploaded. Also adds a 'Get suggestion' button to the CKEditor image dialog for inline image insertion.

hook_modules_installed

Displays a reminder message when the module is first installed, prompting administrators to configure their Azure API credentials.

Troubleshooting 6
Status report shows 'Microsoft Azure API key and Endpoint URL is not set'

Navigate to /admin/config/media/auto_alter and enter your Azure Computer Vision API key and endpoint URL. You must create a Computer Vision resource in your Azure Portal first.

Form validation error: 'The API Key seems to be wrong'

Verify you copied the complete API key from Azure Portal. Ensure you're using the key from a Computer Vision resource, not another Azure service.

Form validation error: 'The URL for the endpoint seems to be wrong'

Check that your endpoint URL is complete and correct. It should include the region, API version, and describe operation. Example: https://westeurope.api.cognitive.microsoft.com/vision/v1.0/describe?maxCandidates=1

Alt text is not being generated for images

1) Verify API credentials are correct via the settings page validation. 2) Check Drupal logs for Azure API error messages. 3) Ensure the image field has the 'Alternative text' field enabled in field settings.

Translation is not working

Ensure the auto_alter_translate submodule is enabled, the 'Enable translation' checkbox is checked, and valid Azure Translator API credentials are configured. The source language must differ from the target language.

Large images causing timeout errors

The module automatically scales images larger than 1MB using the 'auto_alter_help' image style. If issues persist, consider reducing maximum upload size or optimizing images before upload.

Security Notes 4
  • API keys are stored in Drupal configuration - ensure proper access controls on configuration export files
  • The module sanitizes API responses using Drupal's XSS filter before storing alt text
  • Image data is transmitted to Microsoft Azure servers for processing - review Azure's data handling policies for compliance requirements
  • Ensure 'administer Automatic Alternative Text' permission is granted only to trusted administrators