Blog preview card using css

Community feedback

• 

  turanarican•200

  @turanarican2022Posted 10 months ago

  I suggest you to wrap author info in <address> (as MDN also recommends it) instead of <footer>. Semantically author info is tied to the content but not appropriate to present in a <footer>

  Though using <article> is a good decision IMO.

  Font weights are overall to high.

  0

  ---

  

  philipe•20

  @philipecortezPosted 10 months ago

  Hello @turanarican2022!

  I imagined that address should be used just when we need to describe a letter address for example, but after you said it, I checked MDN and you're right I could have used it to represent a contact info like email and/or phone number, but MDN also says that it's common to use address inside the footer

  Anyways I'll update the code to use the <address> tag

  0
• 

  Daniel 🛸•44,250

  @danielmrz-devPosted 10 months ago

  Olá @philipecortez!

  Sua solução ficou excelente!

  Tenho duas sugestões:

  • Primeira: Use apenas main para agrupar o conteúdo principal em vez de main e article. A tag article faria mais sentido se o cartão fizesse parte de um site maior (certamente faria no mundo real), mas aqui o card é tudo que temos na tela.

  • Segunda: Também por questões semânticas, e por ser esse o título principal da tela, você pode substituir o <h3> por <h1>. Ao contrário do que a maioria das pessoas pensa, não se trata apenas do tamanho e peso do texto.

  As tags <h1> a <h6> são usadas para definir títulos 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/assunto 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.

  Essas mudanças tem pouco ou nenhum efeito visual no projeto, mas tornam 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

  ---

  

  philipe•20

  @philipecortezPosted 10 months ago

  Olá @danielmrz-dev, na verdade usei o <article> e o <h3> justamente por imaginar que o cartão faria parte de um site completo, mas entendo perfeitamente o seu ponto e estou de acordo.

  Obrigado pelas dicas!

  1