Amongst all the Twitter upheaval spawned by he who shall remain nameless and its effect as rapid increase in Mastodon as a federated platform that should withstand those kinds of despots, a rather telling difference to me is in what we, the sighted people, never see– alternative text descriptions for images.
I wanted to write about a few tiny details/questions that are bubbling in the blog draft space between my ears, yet I see myself likely sliding into long winded setup and back storying.
Also, in the spirit of IANAL, I Am Not An Accessibility Expert. But over the last few years I have doubled down on my efforts to not only better my practices, but peek under the hood and way down in the secret hidden preferences of social media platforms to witness how, in many cases, making images accessible is a token gesture at best, and not made important.
I have questions/rants too about how alternative text for images is made more difficult to use because it’s likely thought of as something people with vision do not need to see or even access. Made hidden, it stays hidden.
Instagram Trumpets Support / Muffles at Same Time
Typical of how a corporate entity manages things, I pried into Instagram’s PR announcement (see Watters, 2016) and found that the features to provide descriptions of all the pretty photos of perfect lives is so buried in preference panels, I can imagine that maybe 0.001% of its user base use it.
Even in 2018 they unfurled the glory of AI automated descriptions for what they call “posts”. Here is one I posted recently, and yes, I uploaded and did not write my own.
Oh yes, after I have done all my edits, filters, clever caption writing, I forgot to hit the grey tiny link at the bottom for “Advanced Settings” where I scroll below the fold under “Accessibility” heading for another link for “Write Alt Text.” Does this strike you as an important feature?
Let’s say you do have vision, how can you tell or check the alt text for this image? On the web interface there is not even a hover that shows it. I have to pull out by browser inspector, toggle open 2 div tags to even see the img tag:
This is what artificial intelligence says works as an alternative image for our Polaris Ranger parked in front of a red barn, focused on a yellow plow in front, on a landscape covered in snow.
Photo by Alan Levine on November 07, 2022. May be an image of snow.
alt text description for https://www.instagram.com/p/Ckqbq8AuMuj/
If you can make a case that this text fully works as a description for this image, well see also, seafront tropical climate property available in Northern Alberta.
Gulp. Flickr Does It, But Not Much Better
Anyone reading this blog, all 7 of you, know how much I adore flickr. I have to say, at least they do provide alt text. But… see my silly photo of a goofy llama face
To get around this, I need to use descriptive text as my title (take heed of all y’all who upload images leaving them titled like IMG_8789.JPG).
I guess some might privately wave me off thinking, why would visually impaired people be using flickr and instagram? Cough. See this flickr group. And I remember meeting at the old Northern Voices conference the amazing Cathy Browne, an incredibly talented visually impaired photographer.
Do not assume photo sites are for the sighted.
Twitter’s Limp Gestures
Well, there is much to deride Twitter on now in it’s last Musky days. About the same time in 2018 that Instagram came out with it’s so-called accessibility feature, Twitter did the same, with a press release. Likewise, activating the feature to add alt text to images was buried in a preferences pane (if this is important, why would the default be to keep this feature off?).
I ranted a bit, but also did a test myself to understand how it feels to have a tweet read to you in a computer voice. This experience alone makes me shiver in awe about what it must take to navigate the web without vision.
I wonder too if any company like InstaTwitterGram would ever share a press release disclosing the percentage of images that have been described with alt text. They do have that data. Hmmm.
Direct Shaming Works
I regularly did some informal analysis of my public streams, to find how many out of 100 tweets with images included alt text.
Given that sighted people never see what they have not done (alt text is hidden away in HTML) and that the tools for even doing the act are equally tucked away, what works to remind people to bother doing this?
A little bit of shaming. Well not shaming, but reminding. In 2021 I shared a discovery of the fantastic @AltTextReminder account. After following, you will get a gentle reminder via direct message every time you tweet an image without alt text.
I can tell you it is extremely effective.
In my post sharing this, I also described how I added alt text descriptions as options for featured images in my SPLOT WordPress themes, even making it so a site owner can make them required. But also, I make sure the alt text is displayed on the post’s metadata footer.
If me, a not very skilled programmer can do this in my projects, why cannot a large corporate entity with 100s of engineers, pull off the same feat?
Now in 2022 Twitter added a setting where it will remind you to add alt text to an image of it’s not there. Would you care to guess how many clicks in it takes to find this? And maybe what position the default is in?
Also, it only works on the web interface (not sure about mobile) and not in Tweetdeck.
Let’s see if twitter reports how many of it’s 395 million 297 million 5 Musk family members who are left actually use it. At least 1 since that’s my screen above.
Yes! I Got WordPress to Include Alt Text in Social Shared Featured Images
On a number of WordPress sites I use the feature of the Jetpack plugin to automatically post my posts to twitter. I noticed though, then when done, even if my featured image included alt text, it did not travel with the tweet.
As it turns out, it’s not a Twitter issue, and came up any where a tool would create an embedded version of a link (like Slack and I can only guess Facebook) by using the opengraph tags added to your web pages. Without going too deep, if you actually made the effort to view the source code of this post you would see a bunch of tags, gunk like:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
<!-- Jetpack Open Graph Tags --> <meta property="og:type" content="article" /> <meta property="og:title" content="Godzilla Eats All the Images Missing ALT Tags" /> <meta property="og:url" content="https://cogdogblog.com/2021/09/godzilla-missing-alt/" /> <meta property="og:description" content="Well it’s more like a day dream that Gojira would rise up with a roar and — this started as a bit of a rant and play at the way Twitter quote / unquote addresses accessibility for tweet…" /> <meta property="article:published_time" content="2021-09-09T03:24:00+00:00" /> <meta property="article:modified_time" content="2022-11-14T00:09:49+00:00" /> <meta property="og:site_name" content="CogDogBlog" /> <meta property="og:image" content="https://cogdogblog.com/wp-content/uploads/2021/09/23513467494_e8b0f5a5a9_k.jpg" /> <meta property="og:image:width" content="2048" /> <meta property="og:image:height" content="1365" /> <meta property="og:locale" content="en_US" /> <meta name="twitter:creator" content="@cogdog" /> <meta name="twitter:text:title" content="Godzilla Eats All the Images Missing ALT Tags" /> <meta name="twitter:image" content="https://cogdogblog.com/wp-content/uploads/2021/09/23513467494_e8b0f5a5a9_k.jpg?w=640" /> <meta name="twitter:card" content="summary_large_image" /> |
This is what many sites, not just twitter uses to create those nicely formatted “card” views of a post. I noticed that from my WordPress site, while the URL and sizes of my featured image were listed, there was nothing for the alt text. This was not good since there is an open graph structured property for an image’s alternative text.
I actually submitted an issue to the JetPack developers via Github, and while first dismissed as a “nice feature, maybe you should add it), eventually someone did make the change. This might be one of my proudest moments, and this is how software should operate/improve.
Yay me!
I just could never find the repos for Twitter or Instagram to send them issues 😉
It’s All Different in the Fediverse
Instead of looking to Mastodon as an alternative tool to Do What You Did in Twitter Before Elon, it’s better to see how it’s design differs. And also, at least up to the Great Exodus of November 2022, you can see in posts how much more people there care about the practice and intent of making images accessible.
Right away, on uploading an image, it stares you in the face, that it has no Image description. Clicking that notice takes you right to the editor (no need to turn on this feature, it is the default. Heck, it might not be one you can disable). Look what you get:
The circle allows me to set the center point for where an image is cropped for a thumbnail– remember how twitter just did this algorithmically and was shown to bias white faces over non white ones?
I have had mixed luck with the automatic text detection in Mastodon, this would be something you use if you are uploading an image of text.
Everything about the way Mastodon (this is the web interface) suggests that image accessibility is not just a throw away feature for a press release.
I like also that the alt text is a multiline field, too many places you can see it’s an afterthought feature when it’s a single line form field — I am scowling at you, WordPress!. How can we really compose good alt text in this puny space:
UPDATE: This was a PEBCAK issue! An update to WordPress 6.1 enabled a larger and more flexible editing area for alt-text.
Caption Bots FTW
I did find early an equivalent account in Mastodon that will remind me my a direct message if I posted an image without captions. If you are in the Fediverse space, follow @PleaseCaptionBot
This came in handy recently. As blogged earlier I started using the Autopost to Mastodon WordPress plugin to send/toot my new blog posts out under my account name. And @PleaseCaptionBot duly notified me. Also, another subtle difference in what one can do in Mastodon and not Twitter.
I went back to my post and sighed, because my featured image did not have alt text! I am guilty of forgetting. Here’s the image, which in WordPress, I edited to include alt text, and I even reposted to Mastodon.
I could see that the alt text is in my open graph tags:
Thus this is a feature the WordPress author might be able to fix, I have already left a suggestion/request.
Why Can’t We All See Alt Text?
Is anyone still with me? I am not done yet!
Likely counter intuitive and already hinted at, hiding alt text from us with vision seems on the surface, reasonable (why do we need alt text,we can see the image).
But my responses and experiences are that making it visible helps us be aware of our practice, good or bad. We could really all learn better alt text habits if we could see how other people do it.
In addition, I had situations where I posted an image in Twitter and as well Slack, and I have no simple way to copy my alt text hidden and stuffed away in twitter and use it elsewhere. On some sites you might see it on a hover, but it is not copyable.
My usual method involved digging into the browser inspector and rooting around the source HTML
I looked for browser extensions that addressed this, but gave up after trying two that were either unwieldy to use or just did not work. Any suggestions?
Mastodon is not consistent either. The web version and official app do not make alt text visible, butI do like how the MetaText app displays it and makes it available forcopy/paste.
Of all places, let’s look to the imgflip meme generator for good practice? By sheer accident I noticed that a published meme includes in the bottom corner the media description, the text for the image. If I reuse these meme elsewhere, I can at least easily grab the meme text.
Since you cannot even see my alt text, here is what I wrote:
From the Batman slapping Robin meme, with Robin saying IT’S TOO COMPLEX TO DISPLAY ALT TEXT IN MY SITE; and Batman replying IMGFLIP DOES IT, WHY CAN’T YOU?. An arrow points to the bottom of the screen where the meme text is displayed under Media Description, making it easier for me to write this alt text
https://imgflip.com/i/70q78s
What About the Practice?
I have rambled on and on about the tech and problems, but what about the practice and how we get better or just even consistent in the writing of alt text? Yes, you can find gobs of resources, but are there hard and fast rules? I learned from Kate Bowles in Mastodon of communities that use alt text as well for almost extra dialogue.
And does it have to be purely image replacement? Why not add something extra for those working through a web interface with a screen reader? My approach is maybe sometimes sarcastic, but we are not bots or machines, I believe we should be human (even flawed, yes my typos) in this practice.
It ought to be creative, not a chore. A post that stuck with me was Alt-Text & Ambiguity: A Poetic Approach to Image Description by Alex Haagaard and Liz Jackson (Akimbo blog):
Image descriptions are one kind of access support that can make works of art more accessible to people who are blind, have low vision, or have other difficulties perceiving or processing visual information. Creating an effective artistic image description means finding a balance between providing enough information for a reader to understand the work of art and leaving enough ambiguity to allow the reader space for reflection and interpretation. This is the reason we favour a poetic approach to artistic image description.
Much like looking at a work of art, ambiguity is often an important part of reading a poem. Words and phrases have multiple meanings that shift according to the context of the reader, and which are influenced by the structure of the work itself. These shifting meanings can evoke sensory and emotional impressions, as well as philosophical, historical, and political ideas.
https://akimbo.ca/akimblog/alt-text-ambiguity-a-poetic-approach-to-image-description-by-alex-haagaard-and-liz-jackson/
Writing alt text as pure equivalents/replacements for images should be a minimum. Once we make it a regular practice, we can also make it do much more, e.g. to be poetic? storylike? human?
A huge step, to me, is to break away from thinking alt text need not be visible to the sighted. In actuality, we do need it to make visible the practice and art of it. Think how much more people would take it up if they saw how it is done.
Let’s Alt our current Alt Text practices.
Featured Image: As my new practice, when adding my featured image in WordPress (cussing at the tiny one line input field), I will copy my alt text so I can paste here:
Close up view of the pad of a prickly pear cactus with its array of small points, like my points in this post. In the background, blurred are rocks and snow, Yes snow, this happened in Northern Arizona. Also, I am remembering to copy/paste this alt text since it wont go with my toot.
