Debugging Missing alt Attributes

An image without a proper alt value is usually the worst idea – but of course, it is possible. We can easily debug the missing attribute or the missing value with the following lines:

Using this code in a live site is not the smartest way, but you can make an own debug toolkit with a bookmarklet – like a11y.css – or load these in a WordPress preview mode which is for only the editors.

This debugging concept is more than impressive, and there are libraries build on the top of this thinking like a11y.css which is worth to check for more CSS like visual debugging!