Advanced image replacement

CSS-Tricks has posted a very interesting article about image replacement technique using CSS. You will find 9 different ways to turn a page element into an image but keeping the text in the element without seeing it.

You may be familiar with the common technique:

html:

<h1 id="topLogo">
My blog is fantastic
</h1>

CSS:

#topLogo
{
height:80px;
width:150px;
background:#fff url(images/logo.png);
text-indent:-9999px
}
But other alternative exists and are pretty cool, definitely worth a look. See the article at CSS-Tricks