SceneXplain: Alt Text and Better SEO for Your Ghost Blog With One Command

Supercharge your Ghost blog's SEO and accessibility by automatically generating alt texts. All it takes is one command. WordPress/WooCommerce support coming soon!

Futuristic transparent cube with a central chip and copper accents on a dark background, symbolizing cutting-edge technology.
đź’ˇ
Want to skip straight to generating alt texts for your Ghost blog? Check out our notebook or Docker instructions for more

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.

0:00
/0:09

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.

Manually 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.

APIs 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!

Making Accessibility Accessible: Create Alt Text with SceneXplain’s API
SceneXplain is your accessibility ally, making it easy to generate image alt texts to aid visually-impaired users and improve SEO
SceneXplain’s JSON Schema Store: Automate Your Alt-Text, and More!
Take the hassle out of extracting data from images with SceneXplain’s new JSON Schema Store. Discover and share reusable JSON schemas. Create, contribute, and access schemas easily through GUI or API

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.

Alt 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.

đź’ˇ
WordPress and WooCommerce support is currently experimental. The functions are there, but more testing needs to be done. Let us know if you’re interested!

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.

See 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:

0:00
/0:09

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.

See it in action

Here's how it looks when it's running in Docker Desktop:

0:00
/0:29

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.

Run it yourself

To run the program you will need:

⚠️
Always back up your data before running any program (like this!) that may modify it.

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.

Google 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
Google Colaboratory

Docker

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:

Alt Texter Tutorial
Alt Texter Tutorial - Download as a PDF or view online for free

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

Bare metal

Of course, you can run the code on "bare metal" as well. Check the README for more details.

Get 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.