@danielmrz-dev
Posted
Olá @j-pcgoncalves!
Seu projeto está ótimo!
Eu tenho uma sugestão sobre o seu código que pode te interessar:
📌 Você pode usar a tag <picture>
quando tiver diferentes versões da mesma imagem 🖼.
Usar a tag <picture>
ajudará a carregar a imagem correta para o dispositivo do usuário, economizando largura de banda e melhorando o desempenho. Exemplo:
<picture>
<source media="(max-width: 460px)" srcset="{caminho da imagem desktop aqui}">
<img src="{caminho da imagem mobile aqui}" alt="{texto alternativo aqui}">
</picture>
Espero que isso ajude!
Fora isso, excelente trabalho!
Marked as helpful
@j-pcgoncalves
Posted
Olá @danielmrz-dev!
Não conhecia essa tag de HTML e da utilidade dela, mas sem dúvida que a vou usar nos próximos projetos! É mais fácil do que esconder imagens com CSS para alternar entre imagem de desktop e mobile.
Muito obrigado pelo Feedback!
@danielmrz-dev
Posted
@j-pcgoncalves
Pois é, é uma tag bem útil! Elimina a necessidade de utilizar media queries pra fazer a troca das imagens, consequentemente, reduz código desnecessário 😊