Showit Accessibility: Images + alt text

This guide provides essential steps for embedding accessibile images on Showit. Viewing this guide will empower creators to make their websites more accessible and user-friendly to all users, while also improving SEO. We'll be using Chrome, a free Chrome extension, called Silktide, and Showit.

Christina Carrasquilla
23 steps
3 minutes

Showit

Silktide

Navigate to your website (here's my[demo page](https://brandgirlsdemo.com/book))

Click on the Silktide Extension

Choose Alt text

Evaluate the alt text for each image. It should reveal ALL the text in the image (if any) and describe the image in it's context. If it does, great! If not, continue.

Open a new tab, log into Showit

Click on the element to be updated (in this case, the image). Note that in the Image Panel there is a space to give the image a title and an alt text description; however, it is NOT coded correctly for an image that is content).

Click "Media Library"

Click the link icon on the top right of your image. This will copy its URL to your clipboard.

Click "Add Element"

Click "Embed Code"

Double-click here.

Type "<img src="PASTE YOUR URL HERE" alt="TYPE ALL TEXT FROM IMAGE AND A DESCRIPTION HERE" width="ENTER WIDTH OF YOUR IMAGE">

Click "Save"

Click "Custom Code element and drag its frame to match the original image

Change the image's "Scale" until the scroll bars disappear.

Repeat until all images are complete.

Click "Publish"

Click "Close"

Switch to tab with your website and refresh

Click on the Silktide Extension

Choose alt text

You did it!

Showit Accessibility: Images + alt text

Christina Carrasquilla
23 steps
3 minutes

Showit

Silktide

Navigate to your website (here's my[demo page](https://brandgirlsdemo.com/book))

Click on the Silktide Extension

Choose Alt text

Evaluate the alt text for each image. It should reveal ALL the text in the image (if any) and describe the image in it's context. If it does, great! If not, continue.

Open a new tab, log into Showit

Click "Media Library"

Click the link icon on the top right of your image. This will copy its URL to your clipboard.

Click "Add Element"

Click "Embed Code"

Double-click here.

Type "<img src="PASTE YOUR URL HERE" alt="TYPE ALL TEXT FROM IMAGE AND A DESCRIPTION HERE" width="ENTER WIDTH OF YOUR IMAGE">

Click "Save"

Click "Custom Code element and drag its frame to match the original image

Change the image's "Scale" until the scroll bars disappear.

Repeat until all images are complete.

Click "Publish"

Click "Close"

Switch to tab with your website and refresh

Click on the Silktide Extension

Choose alt text

You did it!