Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Blog Preview Card usando flex e grid

@JoaoPaul-S

Desktop design screenshot for the Blog preview card coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


Sabe aquele sentimento de que você esqueceu tudo que aprendeu? Essa foi minha experiência modificando a imagem desse projeto, ela esta com algum complexo que se colocar qualquer padding o border-radius para de funcionar, sem falar que ela fica pequena demais, nunca tive esse problema antes, talvez fosse pq todos os outros projetos tivessem imagens quadradas de proporções iguais, dito isso, agradeceria se alguém pudesse me dizer oq tem errado, se eu estou certo e você também teve esse problema ou só esqueci de algo simples mas crucial mesmo.

Community feedback

Daniel 🛸 44,230

@danielmrz-dev

Posted

Olá @JoaoPaul-S!

Sua solução ficou excelente!

Tenho apenas uma sugestão:

  • Por questões semânticas, e por ser o título principal da tela e não apenas um link, você pode substituir o <a> por <h1>. Ou pelo menos encapsule o texto da tag <a> com <h1>. Ao contrário do que a maioria das pessoas pensa, a diferença entre os HTML headings não é só sobre o tamanho e peso do texto.

📌 As tags <h1> a <h6> são usadas para definir títulos em HTML.

📌 <h1> define o título mais importante.

📌 <h6> define o título menos importante.

📌 Use apenas um <h1> por página - isso deve representar o título principal de toda a página. Além disso, não pule os níveis de título - comece com <h1>, depois use <h2> e assim por diante.

Essa mudança tem pouco ou nenhum efeito visual, mas torna seu código HTML mais semântico, melhorando a otimização de SEO e também a acessibilidade do seu projeto.

Espero que ajude!

Fora isso, você fez um ótimo trabalho!

0

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord