<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet href="https://shkspr.mobi/blog/wp-content/themes/edent-wordpress-theme/rss-style.xsl" type="text/xsl"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	    xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	     xmlns:dc="http://purl.org/dc/elements/1.1/"
	   xmlns:atom="http://www.w3.org/2005/Atom"
	     xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	  xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>
<channel>
	<title>AltText &#8211; Terence Eden’s Blog</title>
	<atom:link href="https://shkspr.mobi/blog/tag/alttext/feed/" rel="self" type="application/rss+xml" />
	<link>https://shkspr.mobi/blog</link>
	<description>Regular nonsense about tech and its effects 🙃</description>
	<lastBuildDate>Wed, 26 Nov 2025 23:36:35 +0000</lastBuildDate>
	<language>en-GB</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>https://wordpress.org/?v=6.9.4</generator>

<image>
	<url>https://shkspr.mobi/blog/wp-content/uploads/2023/07/cropped-avatar-32x32.jpeg</url>
	<title>AltText &#8211; Terence Eden’s Blog</title>
	<link>https://shkspr.mobi/blog</link>
	<width>32</width>
	<height>32</height>
</image> 
	<item>
		<title><![CDATA[The Idiot Sandwich - On Embedding Alt Text]]></title>
		<link>https://shkspr.mobi/blog/2025/11/the-idiot-sandwich-on-embedding-alt-text/</link>
					<comments>https://shkspr.mobi/blog/2025/11/the-idiot-sandwich-on-embedding-alt-text/#comments</comments>
				<dc:creator><![CDATA[@edent]]></dc:creator>
		<pubDate>Thu, 27 Nov 2025 12:34:27 +0000</pubDate>
				<category><![CDATA[/etc/]]></category>
		<category><![CDATA[a11y]]></category>
		<category><![CDATA[accessibility]]></category>
		<category><![CDATA[AltText]]></category>
		<category><![CDATA[HTML]]></category>
		<guid isPermaLink="false">https://shkspr.mobi/blog/?p=63790</guid>

					<description><![CDATA[Alt text is great. It allows people who can&#039;t see an image to understand what that image represents.  For example, the code might say: &#60;img src=&#34;whatever.gif&#34; alt=&#34;Two cute kittens are playing on a blanket&#34;&#62;  If you are blind, you get an idea of what&#039;s being conveyed by that image. If you&#039;re on a train and the WiFi craps out just before the image loads, you&#039;ll also benefit!  If the image is of…]]></description>
										<content:encoded><![CDATA[<p>Alt text is <em>great</em>. It allows people who can't see an image to understand what that image represents.</p>

<p>For example, the code might say: <code>&lt;img src="whatever.gif" alt="Two cute kittens are playing on a blanket"&gt;</code></p>

<p>If you are blind, you get an idea of what's being conveyed by that image. If you're on a train and the WiFi craps out just before the image loads, you'll <em>also</em> benefit!  If the image is of text in a language you don't read, your device can translate it for you.</p>

<p>The alt text can be as long or as short as is necessary. It might just be "kid giving a thumbs up" or it could be incredibly detailed. Here's how the BBC's Newsbeat typically adds alt text for younger viewers:</p>

<img src="https://shkspr.mobi/blog/wp-content/uploads/2025/10/bbc-alt-lossy.webp" alt="Screenshot showing broken images. The alt text on them reads &quot;October 02, 2023, Kolkata City, India,: An Indian hairdresser finishes the haircut showing a Cricket World Cup design make at a hair salon near Kolkata on 2 October 2023 in Kolkata&quot;. Another says &quot;Doja Cat attends the 2023 Video Music Awards. The singer has short bleached blonde hair and dark brown eyes. Her makeup includes thinly drawn on eye brows, purple eyeshadow, false spidery lashes and gems dotted around her eyes. She wears a spider shaped ear cuff and long dangly silver earrings.&quot; A third says &quot;Olivia Rodrigo in the Live Lounge. Olivia is a 20-year-old woman with long brown hair worn loose over her shoulders. She wears a white silk slip-style dress with a lace trim and has red lipstick on. She holds a microphone stand with both hands and closes her eyes as she sings.&quot; " width="540" height="551" class="aligncenter size-full wp-image-63798">

<p>Is that too much? Maybe. It depends on your audience. For partially sighted kids who crave the same pop information as their sighted peers, I think it is great.</p>

<p>So alt text is a good thing. But people are lazy and don't always write it. Perhaps the answer is to <a href="https://shkspr.mobi/blog/2023/07/should-you-embed-alt-text-inside-image-metadata/">embed alt text inside image metadata</a>?</p>

<p>It's a lovely idea - and technically feasible - but it fails to account for user needs.</p>

<p>And that brings me to the point of this post. Who is your alt text for? What information are you trying to share?</p>

<p>Here's a good example. I looked at a bunch of popular memes which had alt-text pre-populated in them. Here's what they said:</p>

<div class="activitypub-embed u-in-reply-to h-cite"> <div class="activitypub-embed-header p-author h-card"> <img class="u-photo" src="https://files.mastodon.social/accounts/avatars/000/007/112/original/388649acb2026701.webp" alt=""> <div class="activitypub-embed-header-text"> <h2 class="p-name" id="terence-eden"><a href="https://shkspr.mobi/blog/2025/11/the-idiot-sandwich-on-embedding-alt-text/#terence-eden">Terence Eden</a></h2> <a href="https://mastodon.social/users/Edent" class="ap-account u-url">@Edent@mastodon.social</a> </div> </div> <div class="activitypub-embed-content"> <div class="ap-subtitle p-summary e-content"><p>Whenever people talk about embedding alt text into images, I remember that lots of gif search services already try to do that.</p><p>Here's BlueSky's gif service. I searched for some popular memes. Each had alt-text baked in.</p><p>Take a look and tell me if you think that the embedded text conveys the sentiment of the image? If you couldn't see the animation, would you understand what was going on from that alt?</p></div> <div class="ap-preview layout-4"> <img class="u-photo u-featured" src="https://files.mastodon.social/media_attachments/files/115/165/042/975/730/482/original/1e7cc65db6887d11.png" alt="The idiot sandwich meme. The default alt text is &quot;a man is holding a piece of bread over a woman 's face and asking what are you ?&quot;"> <img class="u-photo u-featured" src="https://files.mastodon.social/media_attachments/files/115/165/042/976/199/735/original/dd22dab9aa5a0fb1.png" alt="Clip from The Hobbit with the subtitle &quot;What about second breakfast?&quot;. The default alt text is &quot;two men are standing next to each other talking about second breakfast&quot;."> <img class="u-photo u-featured" src="https://files.mastodon.social/media_attachments/files/115/165/042/985/649/025/original/91e0e747e8e4da5a.png" alt="The meme of Homer Simpson walking backwards into a hedge. The default alt text is &quot;A cartoon of homer simpson standing in a grassy area.&quot;"> <img class="u-photo u-featured" src="https://files.mastodon.social/media_attachments/files/115/165/042/993/873/973/original/f97c27accad5c0f9.png" alt="The Chuckle Brothers looking at each other. The default alt text is &quot;a man in a striped shirt is kissing another man in a white suit&quot;."> </div> </div> <div class="activitypub-embed-meta"> <a href="https://mastodon.social/users/Edent/statuses/115165068315048568" class="ap-stat ap-date dt-published u-in-reply-to">2025-09-07, 21:11</a> <span class="ap-stat"> <strong>12</strong> boosts </span> <span class="ap-stat"> <strong>22</strong> favorites </span> </div> </div>

<style>/** * ActivityPub embed styles. */ .activitypub-embed { background: #fff; border: 1px solid #e6e6e6; border-radius: 12px; padding: 0; max-width: 100%; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; } .activitypub-reply-block .activitypub-embed { margin: 1em 0; } .activitypub-embed-header { padding: 15px; display: flex; align-items: center; gap: 10px; } .activitypub-embed-header img { width: 48px; height: 48px; border-radius: 50%; } .activitypub-embed-header-text { flex-grow: 1; } .activitypub-embed-header-text h2 { color: #000; font-size: 15px; font-weight: 600; margin: 0; padding: 0; } .activitypub-embed-header-text .ap-account { color: #687684; font-size: 14px; text-decoration: none; } .activitypub-embed-content { padding: 0 15px 15px; } .activitypub-embed-content .ap-title { font-size: 23px; font-weight: 600; margin: 0 0 10px; padding: 0; color: #000; } .activitypub-embed-content .ap-subtitle { font-size: 15px; color: #000; margin: 0 0 15px; } .activitypub-embed-content .ap-preview { border: 1px solid #e6e6e6; border-radius: 8px; overflow: hidden; } .activitypub-embed-content .ap-preview img { width: 100%; height: auto; display: block; } .activitypub-embed-content .ap-preview { border-radius: 8px; box-sizing: border-box; display: grid; gap: 2px; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr; margin: 1em 0 0; min-height: 64px; overflow: hidden; position: relative; width: 100%; } .activitypub-embed-content .ap-preview.layout-1 { grid-template-columns: 1fr; grid-template-rows: 1fr; } .activitypub-embed-content .ap-preview.layout-2 { aspect-ratio: auto; grid-template-rows: 1fr; height: auto; } .activitypub-embed-content .ap-preview.layout-3 > img:first-child { grid-row: span 2; } .activitypub-embed-content .ap-preview img { border: 0; box-sizing: border-box; display: inline-block; height: 100%; object-fit: cover; overflow: hidden; position: relative; width: 100%; } .activitypub-embed-content .ap-preview video, .activitypub-embed-content .ap-preview audio { max-width: 100%; display: block; grid-column: 1 / span 2; } .activitypub-embed-content .ap-preview audio { width: 100%; } .activitypub-embed-content .ap-preview-text { padding: 15px; } .activitypub-embed-meta { padding: 15px; border-top: 1px solid #e6e6e6; color: #687684; font-size: 13px; display: flex; gap: 15px; } .activitypub-embed-meta .ap-stat { display: flex; align-items: center; gap: 5px; } @media only screen and (max-width: 399px) { .activitypub-embed-meta span.ap-stat { display: none !important; } } .activitypub-embed-meta a.ap-stat { color: inherit; text-decoration: none; } .activitypub-embed-meta strong { font-weight: 600; color: #000; } .activitypub-embed-meta .ap-stat-label { color: #687684; } </style>

<p>OK, so sometimes the captioner makes a mistake and thinks <a href="https://tenor.com/en-GB/view/chuckle-vision-chuckle-brothers-paul-chuckle-paul-elliot-barry-elliot-gif-16410194">the Chuckle Brothers are kissing</a> (WTF?!) perhaps we can excuse that as being an obscure image. But the "<a href="https://tenor.com/en-GB/view/gordon-ramsay-idiot-sandwich-angry-mad-what-are-you-gif-4169547">idiot sandwich</a>" one is inexcusable.  It's a popular meme with a specific meaning.</p>

<p>Which leaves me with a few questions for you:</p>

<ul>
<li>If you saw that the image you were sharing had crap alt text - would you bother editing it?</li>
<li>Is bad alt text worse than no alt text?</li>
<li>Can the same image have multiple meanings?</li>
<li>Have you spent any time browsing the web with images turned off? Did you enjoy it?</li>
</ul>

<p><a href="https://www.rnib.org.uk/living-with-sight-loss/assistive-aids-and-technology/tv-audio-and-gaming/guide-to-accessible-social-media/">You can find out more about Alt Text on the RNIB site</a>.</p>
<img src="https://shkspr.mobi/blog/wp-content/themes/edent-wordpress-theme/info/okgo.php?ID=63790&HTTP_REFERER=RSS" alt="" width="1" height="1" loading="eager">]]></content:encoded>
					
					<wfw:commentRss>https://shkspr.mobi/blog/2025/11/the-idiot-sandwich-on-embedding-alt-text/feed/</wfw:commentRss>
			<slash:comments>6</slash:comments>
		
		
			</item>
		<item>
		<title><![CDATA[Find WordPress featured images with no alt text]]></title>
		<link>https://shkspr.mobi/blog/2023/10/find-wordpress-featured-images-with-no-alt-text/</link>
					<comments>https://shkspr.mobi/blog/2023/10/find-wordpress-featured-images-with-no-alt-text/#comments</comments>
				<dc:creator><![CDATA[@edent]]></dc:creator>
		<pubDate>Fri, 20 Oct 2023 11:34:24 +0000</pubDate>
				<category><![CDATA[/etc/]]></category>
		<category><![CDATA[accessibility]]></category>
		<category><![CDATA[AltText]]></category>
		<category><![CDATA[HowTo]]></category>
		<category><![CDATA[php]]></category>
		<category><![CDATA[WordPress]]></category>
		<guid isPermaLink="false">https://shkspr.mobi/blog/?p=48359</guid>

					<description><![CDATA[WordPress allows you to set a featured image - called a &#34;thumbnail&#34; in the API. This gives a single image which can be used on a listing page, or shown when a post is shared on social media.  The WordPress Media Library lets you set the alt text of an image. But, crucially, this alt text can be different when the image is used as a featured image.  Here&#039;s how to find all your featured images…]]></description>
										<content:encoded><![CDATA[<p>WordPress allows you to set a featured image - called a "thumbnail" in the API. This gives a single image which can be used on a listing page, or shown when a post is shared on social media.</p>

<p>The WordPress Media Library lets you set the alt text of an image. But, crucially, this alt text can be different when the image is used as a featured image.</p>

<p>Here's how to find all your featured images which don't have alt text.</p>

<h2 id="one-liner"><a href="https://shkspr.mobi/blog/2023/10/find-wordpress-featured-images-with-no-alt-text/#one-liner">One Liner</a></h2>

<p>Paste this into <code>wp shell</code> to get a list.</p>

<pre><code class="language-php">foreach (get_posts( array( 'post_type' =&gt; 'post', 'post_status' =&gt; array('publish'), 'posts_per_page' =&gt; -1,) ) as $post) { if( simplexml_load_string( get_the_post_thumbnail($post) )["alt"] == "") { echo $post-&gt;post_date . " " . get_site_url(). "/wp-admin/post.php?post=" . $post-&gt;ID . "&amp;action=edit " . $post-&gt;post_title . "\n"; } }
</code></pre>

<h2 id="an-explanation"><a href="https://shkspr.mobi/blog/2023/10/find-wordpress-featured-images-with-no-alt-text/#an-explanation">An explanation</a></h2>

<p>To get the image element of the featured image, use <code>get_the_post_thumbnail(1234);</code> That will spit back:</p>

<pre><code class="language-html">&lt;img width="800" height="400" 
     src="https://example.com/test.png"
     class="attachment-post-thumbnail size-post-thumbnail wp-post-image"
     alt="This is some alt text."
     decoding="async" loading="lazy" /&gt;"
</code></pre>

<p>If there's no alt, you'll see <code>alt=""</code>.</p>

<p>Getting an attribute out of a scrap of HTML is simple. We're going to be naughty and pretend this is XML. Shhh! Don't tell the W3C!</p>

<pre><code class="language-php">$xml = simplexml_load_string( get_the_post_thumbnail(1234) );
</code></pre>

<p>The alt text can be retrieved with:</p>

<pre><code class="language-php">$alt = $xmlEl["alt"];
</code></pre>

<p>So anything where <code>$xmlEl["alt"] == ""</code> is an image without alt text.</p>

<p>Finally, the code generates a link to the edit page of the post.</p>
<img src="https://shkspr.mobi/blog/wp-content/themes/edent-wordpress-theme/info/okgo.php?ID=48359&HTTP_REFERER=RSS" alt="" width="1" height="1" loading="eager">]]></content:encoded>
					
					<wfw:commentRss>https://shkspr.mobi/blog/2023/10/find-wordpress-featured-images-with-no-alt-text/feed/</wfw:commentRss>
			<slash:comments>1</slash:comments>
		
		
			</item>
		<item>
		<title><![CDATA[Should you embed alt text inside image metadata?]]></title>
		<link>https://shkspr.mobi/blog/2023/07/should-you-embed-alt-text-inside-image-metadata/</link>
					<comments>https://shkspr.mobi/blog/2023/07/should-you-embed-alt-text-inside-image-metadata/#comments</comments>
				<dc:creator><![CDATA[@edent]]></dc:creator>
		<pubDate>Fri, 28 Jul 2023 11:34:13 +0000</pubDate>
				<category><![CDATA[/etc/]]></category>
		<category><![CDATA[a11y]]></category>
		<category><![CDATA[accessibility]]></category>
		<category><![CDATA[AltText]]></category>
		<category><![CDATA[exif]]></category>
		<guid isPermaLink="false">https://shkspr.mobi/blog/?p=46340</guid>

					<description><![CDATA[Not everyone can see the images you post online. They may have vision problems, they may have a slow connection, or they might be using a text-only browser. How can we let them know what the image shows? The answer is alt text. In HTML we can add a snippet of text to aid accessibility.  For example &#60;img src=&#34;monalisa.jpg&#34; alt=&#34;A painting of the Mona Lisa.&#34;&#62;  Most social networks will let users…]]></description>
										<content:encoded><![CDATA[<p>Not everyone can see the images you post online. They may have vision problems, they may have a slow connection, or they might be using a text-only browser. How can we let them know what the image shows? The answer is <a href="https://developer.mozilla.org/en-US/docs/Web/API/HTMLImageElement/alt">alt text</a>. In HTML we can add a snippet of text to aid accessibility.</p>

<p>For example <code>&lt;img src="monalisa.jpg" alt="A painting of the Mona Lisa."&gt;</code></p>

<p>Most social networks will let users add alt text to help describe their images. Brilliant!</p>

<p>But... People don't always add alt text when they upload an image. They may not realise it is helpful, or they don't know how to write a good description, or they may not have time to write something suitable.  This leads to a frequently asked question: "Should I embed the alt text <em>inside</em> the image file? That way, whenever people share the image the alt text will automatically be attached!"</p>

<p>Here's my attempt to answer that.</p>

<h2 id="short-answer"><a href="https://shkspr.mobi/blog/2023/07/should-you-embed-alt-text-inside-image-metadata/#short-answer">Short answer</a></h2>

<p>No.</p>

<h2 id="long-answer"><a href="https://shkspr.mobi/blog/2023/07/should-you-embed-alt-text-inside-image-metadata/#long-answer">Long answer</a></h2>

<p>Nooooooooooooo!</p>

<h2 id="reasoned-answer"><a href="https://shkspr.mobi/blog/2023/07/should-you-embed-alt-text-inside-image-metadata/#reasoned-answer">Reasoned Answer</a></h2>

<p>It is complicated.</p>

<p>On a technical level, yes. Most modern image formats allow you to add image <em>metadata</em> - known as EXIF. This EXIF commonly contains GPS location, timestamps, make and model of camera, etc. Here's an example from one of my photos:</p>

<img src="https://shkspr.mobi/blog/wp-content/uploads/2023/07/exifinfo-fs8.png" alt="Screenshot showing technical details of the metadata on a photo. It contains a copyright notice." width="1024" height="560" class="aligncenter size-full wp-image-46358">

<p>There are a <a href="https://exiftool.org/TagNames/EXIF.html">pre-defined list of acceptable EXIF tags</a> one of which is "ImageDescription", which is <a href="https://exiv2.org/Exif2-2.PDF">defined as</a>:</p>

<blockquote><p>A character string giving the title of the image. It may be a comment such as "1988 company picnic" or the like. Two-byte character codes cannot be used. When a 2-byte code is necessary, the Exif Private tag UserComment is to be used.</p></blockquote>

<p>So, there you have it. Yes you <em>can</em> embed text inside an image. With the right software you can read it. So, technically, you can stuff alt text in there and have a website automatically add it to the <code>alt</code> attribute.</p>

<p>But this is only <em>half</em> the story. What an image represents is highly context dependent.</p>

<p>In her article about <a href="https://tink.uk/thoughts-on-screen-readers-and-image-recognition/">using AI to automatically provide image captions</a>, Léonie Watson makes that point that alt text needs to be:</p>

<blockquote><p>provided by a content author who knows exactly what's in the image, why its being used and the context its being used in.</p></blockquote>

<p>Take this very real photo of a famous actress who I just got an AI to dream up.</p>

<img src="https://shkspr.mobi/blog/wp-content/uploads/2023/07/Woman-celebrity-red-dress-smiling-evil-eyes-holding-a-knife-red-carpet-arm-tattoo.jpg" alt="An AI generate image based on the text &quot;Woman, celebrity, red dress, smiling, evil eyes, holding a knife, red carpet, arm tattoo.&quot;" width="512" height="512" class="aligncenter size-full wp-image-46359">

<p>What's a suitable alt text for this image?</p>

<ul>
<li>Famous actress Claire Flumptron standing on the red carpet.</li>
<li>Claire Flumptron shows off her brand new arm tattoo which has strange mystic runes covering her forearm.</li>
<li>Designer Giovanni Tuccini's new red dress has a small strap over the shoulder.</li>
<li>AI image where the hand is strangely deformed and the neck looks twisted beyond human endurance.</li>
<li>Smiling woman with cropped blonde hair and heavy eye makeup.</li>
<li>Last known photo of the Mayor (right). His blurry face is smiling.</li>
<li>...</li>
</ul>

<p>There's no "right" answer. It depends on <em>what</em> the image is being used to illustrate.</p>

<p>A picture may be worth a thousand words. But those thousand words depend on context.</p>

<hr>

<p><ins datetime="2025-10-07T09:03:26+00:00">Update</ins> Here's another good example of embedded alt text failing badly.</p>

<div class="activitypub-embed u-in-reply-to h-cite"> <div class="activitypub-embed-header p-author h-card"> <img class="u-photo" src="https://files.mastodon.social/accounts/avatars/000/007/112/original/37df032a5951b96c.jpg" alt=""> <div class="activitypub-embed-header-text"> <h2 class="p-name" id="terence-eden"><a href="https://shkspr.mobi/blog/2023/07/should-you-embed-alt-text-inside-image-metadata/#terence-eden">Terence Eden</a></h2> <a href="https://mastodon.social/users/Edent" class="ap-account u-url">@Edent@mastodon.social</a> </div> </div> <div class="activitypub-embed-content"> <div class="ap-subtitle p-summary e-content"><p>Whenever people talk about embedding alt text into images, I remember that lots of gif search services already try to do that.</p><p>Here's BlueSky's gif service. I searched for some popular memes. Each had alt-text baked in.</p><p>Take a look and tell me if you think that the embedded text conveys the sentiment of the image? If you couldn't see the animation, would you understand what was going on from that alt?</p></div> <div class="ap-preview layout-4"> <img class="u-photo u-featured" src="https://files.mastodon.social/media_attachments/files/115/165/042/975/730/482/original/1e7cc65db6887d11.png" alt="The idiot sandwich meme. The default alt text is &quot;a man is holding a piece of bread over a woman 's face and asking what are you ?&quot;"> <img class="u-photo u-featured" src="https://files.mastodon.social/media_attachments/files/115/165/042/976/199/735/original/dd22dab9aa5a0fb1.png" alt="Clip from The Hobbit with the subtitle &quot;What about second breakfast?&quot;. The default alt text is &quot;two men are standing next to each other talking about second breakfast&quot;."> <img class="u-photo u-featured" src="https://files.mastodon.social/media_attachments/files/115/165/042/985/649/025/original/91e0e747e8e4da5a.png" alt="The meme of Homer Simpson walking backwards into a hedge. The default alt text is &quot;A cartoon of homer simpson standing in a grassy area.&quot;"> <img class="u-photo u-featured" src="https://files.mastodon.social/media_attachments/files/115/165/042/993/873/973/original/f97c27accad5c0f9.png" alt="The Chuckle Brothers looking at each other. The default alt text is &quot;a man in a striped shirt is kissing another man in a white suit&quot;."> </div> </div> <div class="activitypub-embed-meta"> <a href="https://mastodon.social/users/Edent/statuses/115165068315048568" class="ap-stat ap-date dt-published u-in-reply-to">2025-09-07, 21:11</a> <span class="ap-stat"> <strong>12</strong> boosts </span> <span class="ap-stat"> <strong>22</strong> favorites </span> </div> </div>

<style>/** * ActivityPub embed styles. */ .activitypub-embed { background: #fff; border: 1px solid #e6e6e6; border-radius: 12px; padding: 0; max-width: 100%; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; } .activitypub-reply-block .activitypub-embed { margin: 1em 0; } .activitypub-embed-header { padding: 15px; display: flex; align-items: center; gap: 10px; } .activitypub-embed-header img { width: 48px; height: 48px; border-radius: 50%; } .activitypub-embed-header-text { flex-grow: 1; } .activitypub-embed-header-text h2 { color: #000; font-size: 15px; font-weight: 600; margin: 0; padding: 0; } .activitypub-embed-header-text .ap-account { color: #687684; font-size: 14px; text-decoration: none; } .activitypub-embed-content { padding: 0 15px 15px; } .activitypub-embed-content .ap-title { font-size: 23px; font-weight: 600; margin: 0 0 10px; padding: 0; color: #000; } .activitypub-embed-content .ap-subtitle { font-size: 15px; color: #000; margin: 0 0 15px; } .activitypub-embed-content .ap-preview { border: 1px solid #e6e6e6; border-radius: 8px; overflow: hidden; } .activitypub-embed-content .ap-preview img { width: 100%; height: auto; display: block; } .activitypub-embed-content .ap-preview { border-radius: 8px; box-sizing: border-box; display: grid; gap: 2px; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr; margin: 1em 0 0; min-height: 64px; overflow: hidden; position: relative; width: 100%; } .activitypub-embed-content .ap-preview.layout-1 { grid-template-columns: 1fr; grid-template-rows: 1fr; } .activitypub-embed-content .ap-preview.layout-2 { aspect-ratio: auto; grid-template-rows: 1fr; height: auto; } .activitypub-embed-content .ap-preview.layout-3 > img:first-child { grid-row: span 2; } .activitypub-embed-content .ap-preview img { border: 0; box-sizing: border-box; display: inline-block; height: 100%; object-fit: cover; overflow: hidden; position: relative; width: 100%; } .activitypub-embed-content .ap-preview video, .activitypub-embed-content .ap-preview audio { max-width: 100%; display: block; grid-column: 1 / span 2; } .activitypub-embed-content .ap-preview audio { width: 100%; } .activitypub-embed-content .ap-preview-text { padding: 15px; } .activitypub-embed-meta { padding: 15px; border-top: 1px solid #e6e6e6; color: #687684; font-size: 13px; display: flex; gap: 15px; } .activitypub-embed-meta .ap-stat { display: flex; align-items: center; gap: 5px; } @media only screen and (max-width: 399px) { .activitypub-embed-meta span.ap-stat { display: none !important; } } .activitypub-embed-meta a.ap-stat { color: inherit; text-decoration: none; } .activitypub-embed-meta strong { font-weight: 600; color: #000; } .activitypub-embed-meta .ap-stat-label { color: #687684; } </style>

<hr>

<p>For more information on writing good alt text, see <a href="https://accessibility.huit.harvard.edu/describe-content-images">Harvard's Digital Accessibility​ blog</a> and <a href="https://design102.blog.gov.uk/2022/01/14/whats-the-alternative-how-to-write-good-alt-text/">Design102's guide</a>.</p>
<img src="https://shkspr.mobi/blog/wp-content/themes/edent-wordpress-theme/info/okgo.php?ID=46340&HTTP_REFERER=RSS" alt="" width="1" height="1" loading="eager">]]></content:encoded>
					
					<wfw:commentRss>https://shkspr.mobi/blog/2023/07/should-you-embed-alt-text-inside-image-metadata/feed/</wfw:commentRss>
			<slash:comments>11</slash:comments>
		
		
			</item>
	</channel>
</rss>
