Alt text, or alternative text, plays a crucial role in Search Engine Optimization (SEO) as it helps search engines understand the content of images on a webpage. By providing concise, relevant descriptions of images, alt text improves the likelihood of a website ranking higher in search engine results. This is particularly important for image search optimization, as alt text can significantly influence how search engines index and display images in search results.
Automatically-generated alt texts being displayed on Jina AI's blog
Beyond enhancing SEO, using alt texts to improve accessibility (a11y) is vital for providing a better experience for visually impaired users. Alt text enables screen readers to describe images, allowing visually impaired individuals to fully comprehend a webpage's content. Additionally, incorporating alt text is essential for complying with web accessibility standards and regulations, such as the Americans with Disabilities Act (ADA), Web Content Accessibility Guidelines (WCAG), and European Union directives like the European Accessibility Act (EAA). Adhering to these standards not only reaches a broader audience but also shows a commitment to inclusivity and ensures equal access to digital information for all users.
tagManually adding alt texts doesn't scale
Traditionally, writing alt text for images has been a labor-intensive task, especially for websites with extensive content, such as hundreds of blog posts or thousands of e-commerce products. Manually creating descriptive and accurate alt text for each image can be time-consuming and resource-intensive. This challenge is amplified in dynamic websites where new content is frequently added, requiring ongoing effort to ensure all images are accompanied by appropriate alt text. The task demands not only a significant investment of time but also attention to detail to maintain consistency and relevance across all images, making it a daunting task for content creators and webmasters.
tagAPIs can help, but you still need to write the middleware
Utilizing APIs like SceneXplain’s to generate alt texts can significantly expedite the process of creating descriptive text for images, especially for websites with a large volume of visual content. Indeed, we’ve written several posts on the subject!
SceneXplain
SceneXplain
SceneXplain’s API uses advanced algorithms and machine learning techniques to analyze images and automatically generate relevant alt texts, drastically reducing the manual workload. This can be a game-changer for efficiently managing websites with numerous images, such as e-commerce platforms and large-scale blogs.
However, while the API offers a streamlined solution for alt text generation, integrating the API into an existing platform still requires time and effort. Writing middleware is necessary to bridge the gap between the API and your website's own API or content management system. This middleware facilitates communication between the two, ensuring that the generated alt texts are correctly associated with their respective images on your website. Although this initial setup requires technical expertise and resources, once in place, it can provide a more automated and scalable approach to maintaining web accessibility and SEO standards.
tagAlt Texter: the missing middle layer
Alt Texter serves as the missing link between SceneXplain and your content platform, streamlining the process of populating alt texts for images across your website. This tool is designed to operate directly from the command line, enabling you to efficiently go through all blog posts and automatically insert alt texts for content images and featured images. By running a single command, Alt Texter leverages the capabilities of SceneXplain to analyze images and generate appropriate alt texts, which are then seamlessly integrated into your website's content.
Currently, Alt Texter is specifically tailored for Ghost blogs, offering a solution for this popular blogging platform. However, its potential for expansion is significant. In the future, Alt Texter can be adapted to work with other widely-used platforms such as WordPress, WooCommerce, Shopify, or any other platform with an API.
This expansion would make the tool even more versatile and valuable, providing a wide range of website owners with an efficient, automated solution for enhancing web accessibility and SEO through accurate and descriptive alt texts.
tagSee the results
You can witness the effectiveness of "Alt Texter" in conjunction with SceneXplain on Jina AI's blog. Here's that video again for reference:
On this blog, every image is equipped with alt text generated by SceneXplain, and you can easily view this by simply hovering over any image. When you hover, a tooltip appears displaying the alt text along with a "Powered by SceneXplain" annotation. This feature not only demonstrates the accurate and contextually relevant alt texts provided by SceneXplain but also highlights the seamless integration of "Alt Texter" with the Ghost blogging platform. It serves as a practical example of how these technologies work together to enhance web accessibility and user experience, while also maintaining effective SEO.
tagSee it in action
Here's how it looks when it's running in Docker Desktop:
As you can see, it iterates over each blog post. If it finds images without alt text, it sends them to SceneXplain and then populates the post accordingly.
tagRun it yourself
To run the program you will need:
- Your Ghost Admin API key (not a Content API key)
- Your Ghost blog URL
- Your SceneXplain API key
This program is still very early in development, so be careful!
You can run the program one of three ways: In a Google Colab notebook, in Docker (via a graphical interface or command line), or directly on your machine.
tagGoogle Colab notebook
While Google Colab isn't the ideal way to run Alt Texter in production, the notebook does give you a quick and easy way to see the code and test it out.
To run the notebook:
- Load up the below link
- Enter your settings (in the "Fill in variables" section)
- Click the Runtime menu, then click Run all
tagDocker
Using Docker lets you run the program on your own machine in a sandbox. In Docker Desktop you can follow the steps in this deck:
alexcg15
If you prefer the command line, you can simply run:
docker run --name alt-texter \
-e GHOST_API_KEY=<ghost-admin-api-key> \
-e SCENEX_API_KEY=<scenex-api-key> \
-e GHOST_BLOG_URL="<ghost-blog-url>" \
jinaai/alt-texter:0.1
tagBare metal
Of course, you can run the code on "bare metal" as well. Check the README for more details.
tagGet started
To check the latest version of the code, you can visit the Alt Texter repo. Contributions are always welcome! If you need support for the program, please leave an issue, or if you need support with SceneXplain generally, you can start a conversation on our Discord in the support channel.
