Mobile First - QR Code Component

Community feedback

• 

  バレンタイン 😈•64,170

  @VCaramesPosted about 2 years ago

  Hey , adding to what was said above/below:

  • The Alt Tag description for the QR image needs to be improved upon. Its needs to tell screen reader users what it is and where it will take them to when they scan it.

  • There is **no need **for a media query in this challenge.

  • Add a max-width: 320px to your .container.

  • Your margins need to be reduce and the font sizes need some work as well.

  Happy Coding!

  Marked as helpful

  0
• 

  Lucas 👾•104,340

  @correlucasPosted about 2 years ago

  👾Oi Felipe, tudo bem? Parabéns pelo desafio! Seja bem vindo a comunidade do Frontend Mentor

  Acabei de ver sua solução e tenho umas dicas pra melhorar seu código/design:

  1.Use <main> ao invés de usar uma <div> para conter todo conteúdo do componente. Desse jeito você melhora a semântica e indica qual é o bloco mais importante de conteúdo da página. Lembre-se que div é só um bloco de conteúdo sem significado e que cada página precisa do <main> para mostrar qual o bloco mais importante.

  2.Adicione uma margem em torno de margin: 20px para evitar que o card toque nas bordas da tela enquanto diminui.

  3.Para melhorar o workflow e ganhar tempo você pode codar toda sua solução usando px e no final selecionar todo código CSS E converter automaticamente pra rem tudo que for px com esse plugin do VSCODE https://marketplace.visualstudio.com/items?itemName=sainoba.px-to-rem ou usar esse sitehttps://pixelsconverter.com/px-to-rem

  👋 Espero que essas dicas te ajudem e que você continue no foco!

  Marked as helpful

  0

  ---

  

  Felipe•90

  @dopezinhoPosted about 2 years ago

  @correlucas Muito obrigado pelas dicas Lucas (:

  0