Uma vez apontados os contras dos dois modos de image-replacement, qual é a melhor prática? Colocar o text-indent e não se preocupar tanto com o número que o navegador vai ter que calcular, ou usar o font-size e torcer para dar certo?
Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!
Uma vez apontados os contras dos dois modos de image-replacement, qual é a melhor prática? Colocar o text-indent e não se preocupar tanto com o número que o navegador vai ter que calcular, ou usar o font-size e torcer para dar certo?
Olá Pedro! Utilizar font-size: 0 não é recomendado pois muitos browsers não suportam essa prática, tem que ter um font-size mínimo, especialmente no mobile e o usuário também pode mudar o font-size do browser.
Outra opção seria utilizar o display: none , mas também não é recomendado porque é ruim para SEO e para acessibilidade, justamente os dois pontos para os quais a gente gostaria de ter o texto alternativo.
Hoje a melhor prática mesmo é o text-indent. Quando aprendi essa técnica fiquei com a sensação de estar fazendo uma "gambiarra", mas não é. Gambiarra é quando existe o jeito certo de fazer e você faz de outro jeito porque é mais cômodo. Como o melhor jeito de fazer o image-replacement é mesmo através do text-indent, isso não é visto como "gambiarra" e sim como técnica!
Abraços e sucesso nos estudos!