O problema é esperar todos usarem navegadores que estejam de acordo com essa nova versão do CSS

Esse eu não gostei, prefiro usar valor negativo do que colocar um span sem nada no código.

Aqui está a solução:
Inserting and replacing content with the ‘content’ property – CSS3

Outras formas:
http://www.mezzoblue.com/tests/revised-image-replacement/

Eu estava olhando o conteúdo sobre “text-indent” no site do W3C, e ele fala que não tem problema nenhum em usar valor negativo. Apenas cita que temos que ter cuidado quando usar.

http://www.w3.org/TR/REC-CSS2/text.html
http://www.w3.org/TR/CSS21/text.html

Por isso, também estou de aconcordo que podemos usar sem problema algum.

Há um artigo sobre isto neste link. Ele também trata sobre o uso da tag H1 para título do site, enquanto o mais recomendado é a tag H2 para esta finalidade, enquanto H1 fica reservado para o título da página em si, tornando-o mais amigável com os sistemas de busca.

Em termos de CSS, como não se trata de conteúdo, acho que podemos falar em semântica em termos de nomeação de classes e ID’s, mas o uso da identação negativa, na minha opinião, não prejudica em nada.

h1 {
text-indent:-9999px;
margin-left:9999px
}

rsrsrsrs…

Pensando em dispositivo que não renderiza CSS, com alguns móveis, o uso de image replacement é muito interessante.

Se tivesse disponível algo como:

h1 { content:hidden; }

seria algo maravilhoso.

Mas o fato é que não existe, e com certeza teve(W3C) ter seus motivos, ou não.

Outro fato que também todos já sabem é que esses navegadores são todos umas “%*#&@8~”. Por isso eu não tenho nada contra e também nada a favor.

Mas é isso.

Nós, designers voltados para a Web, sabemos muito bem que este tipo de mídia oferece várias limitaçőes (como qualquer outra) e, entre elas, está utilização de fontes diferentes do padrão adotado pelos sistemas operacionais….