Check and insert alt attribute for images which miss it

Question

I want to write a Java tool to assess HTML pages of an existing site and if any image has no alt attribute, the tool will insert alt="" to that image. One approach is using an HTML parser (like HtmlCleaner) to generate the DOM then adding the alt attribute to the images in the DOM before writing back the HTML.

However, this approach won't keep the original HTML intact and probably cause some unpredictable side effects, esp. when the existing amount of HTML pages is huge and there is no guarantee about their being well-formed.

Is there any safer way to accomplish this (i.e. should keep the original HTML intact and only add the alt attribute)?

Answer 1

Short of writing some horrible mess of regexp or other string manipulation code, I don't believe that there is another way of doing this.

I do question why you want to do this? The only reason I can imagine is to pass some sort of automatic validation, but the reason for requiring alt tags is a matter of usability. Adding empty alt tags does not help that in any way. You are just hiding the problem.

Instead I'd suggest writing a bit of Javascript that throws a red border around any image missing an alt tag and making the front end designers add meaningful alt tags to every image thus flagged.

Answer 2

It's kind of pointless to add empty alt tags to your layout. I second Kris in that it's defeating the purpose of having the alt tags in the first place and I agree with David Dorward's comment.

But, if there is some ulterior motive here, you could do it after the fact in the browser with javascript (or, preferably, jQuery). The client's browser certainly won't be able to change the original HTML and is smart enough to parse through it even if it's not perfectly well-formed.

Using jQuery, place this script in the head section of your page:

<script language="javscript">
$(function() {
    $('img:not([alt])').attr('alt','');
});
</script>

And make sure you include the jQuery library.

Answer 3

I've used the Jericho HTML Parser library in the past with success for parsing HTML. It's supposed to work well with poorly formed HTML. This would alter the original HTML though.

Answer 4

Hi Owen,

Can you provide an example using jericho for the same. I am not finding element.setAttribute or something of the same in the API. It will be very helpful if you can post an example code.