Follow

CSS userscript to highlight missing alt text 

Nice scrap of CSS to apply to instances using Stylus (a Chrome extension) or similar: toot images with missing alt text appear with a dashed yellow border as below.

```
div.media-gallery img,
.zoomable-image img {
outline: 5px dashed yellow;
outline-offset: -5px;
}
div.media-gallery img[alt],
.zoomable-image img[alt] {
outline: none;
}
```

Credit to @accessiblestef via toot.cafe/@accessiblestef/1093

CSS userscript to highlight missing alt text 

Turning this on makes it very unavoidable how many images are being posted with no alt text. Shame job.

CSS userscript to highlight missing alt text 

@attentive (or Firefox extension if you like your privacy, in my case)

CSS userscript to highlight missing alt text 

@accessiblestef Indeed fair point, I should use it, but I'm a creature of habit …

Sign in to participate in the conversation
Assemblag.es

assemblag.es is a Mastodon instance for people interested in thinking creatively and critically about technology, in the broadest sense. The only requirement is that you keep to the code of conduct! Note: we've paused new signups for a few days while we deal with the #twittermigration influx - please do request an invite, but be aware that for now functions more like a 'waiting list' than a knock on the door, until our numbers stabilise again :-)