Olá Hallan! Vou responder suas perguntas na ordem inversa pois achonque fica mais fácil de você entender.
- O image replacement tira ou mantem as imagens no HTML?
Ele retira. O nosso código HTML é responsável por ter a estrutura e o o conteúdo de nossa pagina. Logo, todos que usarem o site terão acesso a esse conteúdo, então se colocarmos imagens como conteúdo, ou seja em nosso HTML, tanto ferramentas de busca como usuários terão acesso as imagens.
- Mas por que utilizar o image replacement? Como usar corretamente essa técnica?
Como eu disse anteriormente o HTML é responsável por ter o conteúdo e a estrutura da pagina. Logo, nada alem disso deve estar nele.
Então vamos pensar em relação aos links das redes sociais. As imagens colocadas nos links são conteúdo? Ou são apenas decorativas?
Perceba que as imagens nos links são apenas decorativas a informação e conteúdo de verdade do link é que são as redes sociais Twitter, GitHub e LinkedIn. Então por não serem conteudo, as imagens não deveriam estar no HTML, deveriam estar no CSS que cuida da parte do estilo e decoração de nossa página.
Então ai que vem a técnica image replacement (Substituição por Imagem). Essa técnica consiste em substituir um texto ou conteúdo de nossa página por uma imagem, que no caso é isso que desejamos no nosso link. Perceba que o correto seria o link vir com um texto com o nome da rede social pois esse é o real conteúdo. No entanto, desejamos desejamos deixa-lo mais estiloso com o uso de uma imagem e por isso usamos a técnica, para adicionar a imagem via CSS, pos repito ela é um estilo, não um conteúdo. Você pode me perguntar então "Qual a vantagem de usar o Image Replacement?"
Perceba que com a técnica seu site permanece com as duas coisas separadas corretamente, conteúdo e estilo. Antes uma ferramenta de busca apenas encontraria uma imagem no seu site. Agora ela encontra um conteúdo (o texto com o nome da rede social, afinal o texto apenas não é visto, mas ele se encontra no HTML que é o que ferramentas de busca levam em consideração) e a imagem sendo aplicada como estilo através do CSS.
Quanto a sua primeira pergunta, "O que quer dizer com: usar corretamente a técnica?"
Bem, o image replacement não deve ser usado sempre com todas as imagens de nosso site. Haverá situações em que realmente queremos utilizar uma imagem como conteúdo de nosso site e assim não devemos utilizar o image replacement mas sim a tag <img>. Por isso devemos sempre analisar.
Espero ter ajudado. Bons Estudos!
