So, I got an email from a fellow coder a few weeks ago insisting that empty divs (ie: a div that is empty in the markup, or used as a container) that has a set width (or height) and a background image defined is bad. In fact he recommended that instead the use of the image inside the HTML with a blank alt tag is the way to go, for it to be more semantic, SEO and search index friendly…
So what’s the truth? By reading various articles and blogs I always gathered it would be better to have an empty div than another image in the HTML. If the image has a blank alt tag it’s no more helpful to SEO than an background image in the CSS, right? What makes an image in the HTML (mind you no alt tag) any more semantic than an extra div?
If an image is part of the content, then it should be displayed using an img tag – if it’s for decoration, then it may be a background to an existing block-element. It is generally bad practice to use an empty element in any situation for mere decoration purposes.
This is true, but my questions really is – which way is more semantic. Obviously for some really crazy decorative designs there’s not way around using some extra elements. The question really is – which way is better?