Résoudre le défi de la rédaction de texte alternatif à grande échelle dans Craft CMS à l'aide d'outils d'automatisation

Ce guide vous explique comment configurer la génération automatique de texte alternatif dans Craft CMS, en utilisant des extensions alimentées par l'IA qui peuvent traiter des milliers d'images en quelques minutes. Vous apprendrez comment choisir le bon outil, le configurer correctement, générer du texte alternatif en lot et mettre en place des flux de travail qui maintiennent votre couverture de texte alternatif complète au fur et à mesure que de nouvelles images arrivent.

Prérequis

Avant de commencer avec l'automatisation du texte alternatif, assurez-vous d'avoir :

• Craft CMS 4.0 ou supérieur (version 5.x recommandée pour une meilleure compatibilité des extensions)
• Accès à Composer pour installer des extensions
• Permissions administrateur dans votre installation Craft CMS
• Clés API pour votre service IA choisi (OpenAI, Google Cloud Vision ou autres)
• Conscience budgétaire - les appels API d'IA coûtent de l'argent (généralement 0,01 $ à 0,05 $ par image)

Nous avons constaté que les sites avec plus de 500 images obtiennent le meilleur retour sur investissement de l'automatisation. Pour les sites plus petits, le temps de configuration pourrait ne pas en valoir la peine, sauf si vous ajoutez fréquemment des images.

Vous devriez également avoir :

• Une compréhension de base du système de gestion des ressources de Craft
• Une familiarité avec les gabarits Twig (pour les ajustements de sortie)
• Accès à la ligne de commande de votre serveur pour exécuter des tâches de file d'attente

Mise en œuvre étape par étape

Étape 1 : Évaluer votre couverture actuelle de texte alternatif

D'abord, vérifiez ce avec quoi vous travaillez. Vérifiez combien d'images n'ont pas de texte alternatif :

-- Exécutez cette requête dans votre base de données pour compter les images sans texte alternatif
SELECT COUNT(*) 
FROM assets 
WHERE kind = 'image' 
AND (alt IS NULL OR alt = '');

Dans le panneau de contrôle de Craft, vous pouvez aussi filtrer les ressources pour afficher seulement celles qui n'ont pas de texte alternatif en utilisant la recherche : alt:"".

Étape 2 : Choisir votre extension d'automatisation

Selon les options actuelles en 2025, voici vos meilleurs choix :

Pour la simplicité et la fiabilité : AI Alt Text (utilise OpenAI)

• Idéal pour : Les équipes voulant une configuration rapide avec un minimum de configuration
• Coût : 19 $ pour l'extension utilisation de l'API OpenAI (environ 0,02 $ par image)
• Installation : composer require heavymetalavo/craft-aialttext

Pour les sites multilingues : AltTextLab

• Idéal pour : Les sites nécessitant du texte alternatif en plusieurs langues (prend en charge plus de 130 langues)
• Coût : 29 $ pour l'extension utilisation de l'API
• Installation : composer require alttextlab/alt-text-craftcms

Pour les projets soucieux de la confidentialité : Altify (utilise HuggingFace)

• Idéal pour : Les sites qui ne peuvent pas envoyer d'images à des API tierces
• Coût : Gratuit (code source libre)
• Installation : composer require fork/craft-altify

Pour la flexibilité : Altomatic

• Idéal pour : Les équipes voulant basculer entre fournisseurs d'IA
• Prend en charge : OpenAI, Google Cloud Vision, AWS Rekognition, Azure
• Installation : composer require codegrain/altomatic

Étape 3 : Installer et configurer l'extension choisie

Passons en revue la configuration d'AI Alt Text comme exemple :

# Installer via Composer
composer require heavymetalavo/craft-aialttext

# Installer l'extension dans Craft
./craft plugin/install ai-alt-text

Maintenant, configurez dans le panneau de contrôle :

1. Naviguez vers Paramètres → Extensions → AI Alt Text
2. Ajoutez votre clé API OpenAI
3. Sélectionnez votre modèle (gpt-4o-mini fonctionne bien et coûte moins cher)
4. Définissez votre modèle d'invite :

Décrivez cette image pour quelqu'un qui ne peut pas la voir.
Concentrez-vous sur : sujet principal, détails importants, contexte.
Limitez-vous à 125 caractères.
Évitez : les phrases redondantes comme "image de" ou "photo montrant".

Étape 4 : Configurer les mises en page des champs de ressources

Rendez le texte alternatif obligatoire pour tous les volumes d'images :

1. Allez dans Paramètres → Ressources → [Votre volume]
2. Cliquez sur "Mise en page des champs"
3. Glissez le champ "Texte alternatif" dans la mise en page
4. Cliquez sur l'icône d'engrenage et cochez "Ce champ est obligatoire"
5. Enregistrez la mise en page

Cela garantit que tous les nouveaux téléversements nécessiteront un texte alternatif (manuel ou généré).

Étape 5 : Générer du texte alternatif pour les images existantes

Pour la génération en lot, utilisez la ligne de commande pour de meilleures performances :

# Mettre en file d'attente toutes les images sans texte alternatif
./craft ai-alt-text/generate/missing

# Traiter la file d'attente (ajoutez --verbose pour voir la progression)
./craft queue/run --verbose

Pour une génération sélective, utilisez le panneau de contrôle :

1. Allez dans Ressources
2. Filtrez pour afficher les images sans texte alternatif : alt:""
3. Sélectionnez les images que vous voulez traiter
4. Choisissez "Générer le texte alternatif" dans le menu d'actions des éléments

Étape 6 : Configurer la génération automatique pour les nouveaux téléversements

Dans les paramètres de votre extension, activez "Génération automatique au téléversement". Cela crée du texte alternatif immédiatement lorsque des images sont ajoutées.

Pour plus de contrôle, créez un écouteur d'événements :

// modules/sitemodule/SiteModule.php
use craft\events\AssetEvent;
use craft\services\Assets;
use yii\base\Event;

Event::on(
    Assets::class,
    Assets::EVENT_AFTER_SAVE_ASSET,
    function(AssetEvent $event) {
        $asset = $event->asset;
        
        // Traiter seulement les nouvelles images sans texte alternatif
        if ($event->isNew && $asset->kind === 'image' && empty($asset->alt)) {
            // Mettre en file d'attente la génération du texte alternatif
            \Craft::$app->queue->push(new GenerateAltTextJob([
                'assetId' => $asset->id
            ]));
        }
    }
);

Étape 7 : Mettre à jour vos gabarits

Assurez-vous que vos gabarits utilisent correctement le champ alt :

{# Implémentation de base #}
{% set image = entry.featuredImage.one() %}
{% if image %}
    

{% endif %}

{# Avec gestion de repli #}
{% set image = entry.featuredImage.one() %}
{% if image %}
    {% set altText = image.alt ?: image.title ?: 'Image liée à ' ~ entry.title %}
    

{% endif %}

Exemples de code avec explications

Invite personnalisée basée sur le contexte de la ressource

Parfois, vous voulez des invites différentes pour différents types d'images :

// Module personnalisé pour varier les invites par dossier de ressources
use craft\elements\Asset;

public function getCustomPrompt(Asset $asset): string
{
    $folder = $asset->getFolder();
    
    switch ($folder->name) {
        case 'products':
            return 'Décrivez cette image de produit en vous concentrant sur : type d'article, couleur, caractéristiques distinctives. Max 100 caractères.';
        
        case 'team':
            return 'Décrivez cette personne professionnellement sans mentionner l'apparence physique. Concentrez-vous sur : environnement, contexte professionnel. Max 100 caractères.';
        
        case 'blog':
            return 'Décrivez le sujet principal et le contexte de cette image. Incluez des détails pertinents pour les lecteurs de l'article. Max 125 caractères.';
        
        default:
            return 'Décrivez cette image de manière concise pour quelqu'un qui ne peut pas la voir. Max 125 caractères.';
    }
}

Traitement par lot avec suivi de progression

Pour les grandes bibliothèques, suivez la progression et gérez les échecs :

// Commande console pour le traitement par lot avec récupération
public function actionProcessBatch($limit = 100)
{
    $assets = Asset::find()
        ->kind('image')
        ->alt(':empty:')
        ->limit($limit)
        ->all();
    
    $processed = 0;
    $failed = [];
    
    foreach ($assets as $asset) {
        try {
            // Générer le texte alternatif
            $altText = $this->generateAltText($asset);
            
            // Enregistrer dans la ressource
            $asset->alt = $altText;
            Craft::$app->elements->saveElement($asset);
            
            $processed  ;
            $this->stdout("Traité : {$asset->filename}\n");
            
            // Limitation du débit
            usleep(500000); // Délai de 0,5 seconde
            
        } catch (\Exception $e) {
            $failed[] = $asset->id;
            $this->stdout("Échec : {$asset->filename} - {$e->getMessage()}\n");
        }
    }
    
    $this->stdout("\nTerminé : {$processed} traités, " . count($failed) . " échecs\n");
    
    if (!empty($failed)) {
        file_put_contents('failed-assets.txt', implode("\n", $failed));
        $this->stdout("Les ID des ressources échouées sont enregistrés dans failed-assets.txt\n");
    }
}

Génération de texte alternatif multilingue

Pour les sites avec plusieurs langues :

{# Gestion des gabarits pour le texte alternatif multilingue #}
{% set image = entry.heroImage.one() %}
{% if image %}
    {% switch craft.app.language %}
        {% case 'es' %}
            {% set altField = 'altEs' %}
        {% case 'fr' %}
            {% set altField = 'altFr' %}
        {% default %}
            {% set altField = 'alt' %}
    {% endswitch %}
    
    

{% endif %}

Erreurs courantes à éviter

1. Ne pas définir de limites de débit API

Plusieurs développeurs oublient de configurer la limitation du débit et épuisent rapidement leurs crédits API. Notre expérience montre que traiter plus de 100 images par minute déclenche souvent la limitation de l'API. Ajoutez des délais entre les requêtes :

// Ajoutez ceci à votre boucle de génération
usleep(500000); // Délai de 0,5 seconde entre les appels API

2. Ignorer les images spécifiques au contexte

Les images de produits nécessitent des descriptions différentes des images de blogue. N'utilisez pas la même invite générique pour tout. Créez des invites spécifiques pour différents dossiers de ressources ou types d'entrées.

3. Oublier de gérer les échecs d'API

Les API échouent. Les réseaux expirent. Implémentez toujours une logique de réessai :

$maxRetries = 3;
$attempt = 0;

while ($attempt < $maxRetries) {
    try {
        $result = $this->callApi($image);
        break; // Succès, sortir de la boucle
    } catch (\Exception $e) {
        $attempt  ;
        if ($attempt >= $maxRetries) {
            throw $e; // Relancer après le maximum d'essais
        }
        sleep(2 ** $attempt); // Recul exponentiel
    }
}

4. Ne pas réviser le texte généré

L'IA génère parfois des descriptions inexactes ou inappropriées. Révisez toujours le texte alternatif pour :

• L'exactitude (décrit-il ce qui est réellement dans l'image ?)
• La pertinence (aucun biais involontaire ou langage inapproprié)
• Le contexte (est-ce logique pour l'endroit où l'image est utilisée ?)

5. Écraser le texte alternatif existant

Faites attention de ne pas remplacer le texte alternatif écrit manuellement par du contenu généré par l'IA. Vérifiez avant d'écraser :

if (empty($asset->alt) || $asset->alt === $asset->title) {
    // Sécuritaire de générer un nouveau texte alternatif
    $asset->alt = $this->generateAltText($asset);
}

Étapes de test et de vérification

1. Vérifier la couverture du texte alternatif

Exécutez cette requête SQL pour vérifier votre progression :

SELECT 
    COUNT(*) as total_images,
    COUNT(CASE WHEN alt IS NOT NULL AND alt != '' THEN 1 END) as avec_alt,
    COUNT(CASE WHEN alt IS NULL OR alt = '' THEN 1 END) as sans_alt,
    ROUND(COUNT(CASE WHEN alt IS NOT NULL AND alt != '' THEN 1 END) * 100.0 / COUNT(*), 2) as pourcentage_couverture
FROM assets
WHERE kind = 'image';

2. Tester avec des lecteurs d'écran

Téléchargez NVDA (Windows) ou utilisez VoiceOver (Mac) pour tester votre texte alternatif :

1. Naviguez vers une page avec des images
2. Activez le lecteur d'écran
3. Naviguez à travers les images avec Tab
4. Écoutez comment le texte alternatif sonne
5. Vérifiez s'il fournit des informations utiles

3. Valider la sortie HTML

Vérifiez votre HTML rendu pour les attributs alt appropriés :

// Test dans la console du navigateur
const images = document.querySelectorAll('img');
const missingAlt = Array.from(images).filter(img => !img.hasAttribute('alt') || img.alt === '');
console.log(`Trouvé ${missingAlt.length} images sans texte alternatif`);
missingAlt.forEach(img => console.log(img.src));

4. Surveiller l'utilisation de l'API

Configurez la surveillance de vos coûts API :

// Enregistrer l'utilisation de l'API pour suivre les coûts
Craft::info(
    sprintf('Texte alternatif généré pour la ressource %d, coût API : %.4f $', $asset->id, $apiCost),
    'alt-text-generation'
);

5. Vérifications ponctuelles de qualité

Révisez aléatoirement 10 à 20 descriptions générées chaque semaine :

1. Choisissez des images aléatoires de différentes catégories
2. Comparez le texte alternatif à l'image réelle
3. Notez tout modèle d'erreurs ou d'améliorations nécessaires
4. Ajustez vos invites selon les résultats

Conclusion

Configurer la génération automatique de texte alternatif dans Craft CMS économise des heures de travail manuel tout en améliorant l'accessibilité et le référencement de votre site. La clé est de choisir la bonne extension pour vos besoins, de la configurer soigneusement et de maintenir la qualité grâce à des révisions régulières.

Rappelez-vous que l'automatisation est un outil pour vous aider à évoluer, pas un remplacement complet du jugement humain. Les meilleurs résultats proviennent de la combinaison de la génération par IA avec la révision manuelle pour les images critiques et des vérifications de qualité régulières.

Le travail avec des équipes nous a appris que les implémentations les plus réussies commencent petit, peut-être avec un seul dossier de ressources ou type d'entrée, puis s'étendent une fois que vous êtes à l'aise avec la qualité et le flux de travail.

Prêt à implémenter la génération automatique de texte alternatif mais besoin d'aide pour choisir la bonne approche pour votre configuration Craft CMS spécifique ? Nous pouvons examiner votre bibliothèque d'images, recommander la méthode d'automatisation la plus rentable et vous aider à établir des processus de contrôle de qualité qui garantissent que votre texte alternatif aide réellement vos utilisateurs. Contactez-nous pour discuter de vos besoins en automatisation de l'accessibilité.