Image alt text generator

This content field extension saves you time by using the power of AI to automatically generate alt text (text descriptions) for images. Alt text is used by screen reading software to describe the image to visually impaired users. It's also used by search engines when your website is crawled and helps to improve your search ranking. Including alt text with all images improves the user experience for all users because if an image fails to load, then the image description is displayed in place of the image rather than just a blank space.

Labs preview

The Image alt text generated is classified as an Amplience labs preview for you to evaluate and provide feedback. It's provided as is and is unsupported. Each time you use generate alt text you'll use one Amplience credit. Your organization is provided with a bundle of free credits to make it easy to get started with our AI services.

Using the extension

To use the extension you need to create a content type schema that contains an image and a string property to contain the image alt text. The alt text property is configured to use the extension and includes a reference to the image property for which the alt text will be generated.

An example of content created using the extension is shown below. An image is added to the content item and the "Generate" button is enabled.

When the button is clicked, an image description is generated by the AI alt text service and added to the alt text field. In this example it identifies that the image shows a man and a woman running under a bridge.

If you change the image, just click the button again to generate new alt text.

Schema examples

To make it easier to use the Image alt text generator extension in your own schemas we've included some schema examples to help get you started.

There are two schema examples included: one that uses a registered extension and one that includes the extension URL directly in the schema. In most cases you will want to register the extension so that you do not have to specify the installation parameters each time you use it in a schema.

Note that the extension must be linked to a property, imageAltText in the examples, that contains a JSON pointer or relative JSON pointer reference to the image object for which an image description will be generated.

Schema example using a registered extension

In order to use this schema you will need to register the extension using the following details:

• Category: Content field extension
• Name: ai-image-caption (if you use a different name you will need to change the name in the example schema)
• URL: https://ai-image-caption.extensions.content.amplience.net/
• Initial height: 500

Permissions

In the permissions section set the "Read access" and "Modify access" API permissions.

Installation parameters

In the installation parameters you can specify that alt text should be generated when an image is added to the content rather than by clicking the AI alt text button.

{
  "autoCaption": true
}

You can find more details about the extension configuration on GitHub.

Example schema

An example schema using a registered version of the extension is shown below. The imageAltText string property contains a reference to the image property for which alt text is generated.

{
  "$schema": "http://json-schema.org/draft-07/schema#",
  "$id": "https://schema-examples.com/ai-alt-text-generator",
  "title": "AI alt text generator",
  "description": "Example showing how to use the alt text generator extension ",
  "$comment": "Docs: https://amplience.com/developers/docs/ai-services/image-alt-text",
  "allOf": [
    {
      "$ref": "http://bigcontent.io/cms/schema/v1/core#/definitions/content"
    }
  ],
  "type": "object",
  "properties": {
    "image": {
      "title": "Image",
      "description": "",
      "type": "object",
      "anyOf": [
        {
          "$ref": "http://bigcontent.io/cms/schema/v1/core#/definitions/image-link"
        }
      ]
    },
    "imageAltText": {
      "type": "string",
      "minLength": 0,
      "maxLength": 150,
      "title": "Image alt text",
      "ui:extension": {
        "name": "ai-image-caption",
        "params": {
          "image": "/image"
        }
      }
    }
  }
}

Schema using the extension URL

This schema example shows how to include the extension in the schema using its URL. The imageAltText string property contains a reference to the image property for which alt text is generated.

{
  "$schema": "http://json-schema.org/draft-07/schema#",
  "$id": "https://schema-examples.com/ai-alt-text-generator-url",
  "title": "AI alt text generator",
  "description": "Example showing how to use the alt text generator extension ",
  "$comment": "Docs: https://amplience.com/developers/docs/ai-services/image-alt-text",
  "allOf": [
    {
      "$ref": "http://bigcontent.io/cms/schema/v1/core#/definitions/content"
    }
  ],
  "type": "object",
  "properties": {
    "image": {
      "title": "Image",
      "description": "",
      "type": "object",
      "anyOf": [
        {
          "$ref": "http://bigcontent.io/cms/schema/v1/core#/definitions/image-link"
        }
      ]
    },
    "imageAltText": {
      "type": "string",
      "minLength": 0,
      "maxLength": 150,
      "title": "Image alt text",
      "ui:extension": {
        "url": "https://ai-image-caption.extensions.content.amplience.net/",
        "params": {
          "image": "/image"
        }
      }
    }
  }
}

Related pages

Extensions overview

Registering extensions

Schema examples

GitHub repository