Substituição de imagens - Ajuda com o Google

Texto em páginas web são sem dúvida o melhor método de indexação de páginas nos sites de busca. Ainda existem páginas que insistem em lotar seu layout com imagens e mais ainda, colocar texto em forma de imagens. Duas situações podem ocorrer tomando essa atitude:

1- Os sites de busca não lêem imagens. Seu site talvez nem seja indexado.
2- Seu site ficará inacessível a portadores de deficiência visual. Leitores de telas também tem dificuldades de ler imagens.



Mas você que colocar imagens para deixar seu site lindão?
Tudo bem! Existem formas de fazer isso usando o CSS. Mas sempre sugiro, não exagere nas imagens, conteúdo é o que interessa.
Às vezes por motivo de uma marca de empresa você precisará trocar o texto por uma imagem de texto pelo fato de que, as fontes na internet são limitadas.
Desenvolvedores de CSS usam alguns recursos para isso sem que o texto seja retirado da página. Em vez de colocar a imagem diretamente na página, eles usam uma técnica chamada substituição de imagens.



Alguns destes métodos não são usados atualmente pela falhas dos leitores de telas e a maioria não funciona quando a CSS é desativada. Muitos pararam de usar esta técnica e começaram a usar texto simples.
A técnica que irei mostra deve ser usada com cautela e nunca para dados importantes como, por exemplo: menus que levam a informações importantes.
Esta técnica descarta divs desnecessários:

<h2>
Titulo do site
</h2>

Em vez de usar um display:none para ocultar o texto, aplica-se um recuo negativo de texto muito grande ao título.

h2 {
text-indent: -5000px;
background: url(imagem_do_Logo.gif) no-repeat;
width: 150px;
height: 35px;

Simples. Esta técnica resolve o problema com leitores de tela e buscadores, porém não funciona quando as imagens estiverem desativadas e a CSS ativada. Isso é um caso extremo e só se aplicará com conexões muito lentas e para quem acessar o site de celulares como modem.
Aproveite a técnica e usem texto em vez de imagens.

Subscreva o CSS-Desvandado completo!
Subscreva CSS - Desvendado por Email