QR Component

Community feedback

• 

  haquanq ®️•1,585

  @haquanqPosted 4 months ago

  Hello @Ricardo-Tesla,

  Although people would say you can choose any tool you want. For this small challenge you should use HTML and CSS only (leave the framework for more complex challenge - at least intermediate level otherwise it is a waste).

  Code review time!!

  • Your page lack h1, each page must have one h1 (improve SEO and accessibility). What is the page content about? Put it in h1.
  • You page have no landmark, page must have one main landmark (wrap you most important content inside it, read more here).
  • You use div which give zero context on what is this chunk of content, just bland texts?. Use more semantic elements like section, article,... .
  • You are using too many redundant breakpoints in media query (look at my solution, zero breakpoint and still responsive)

  After all, you need to really understand HTML and CSS in-depth before trying libraries. Otherwise you would keep making the same mistake again and again.

  Keep it up, have a nice day!!

  Marked as helpful

  0

  ---

  

  Richard Ngabo•260

  @Ricardo-TeslaPosted 4 months ago

  Thank you for your correction @haquanq . Kindly check the updated solution for more reviews.

  0

  

  haquanq ®️•1,585

  @haquanqPosted 4 months ago

  @Ricardo-Tesla it's nice that you fixed it immediately, here is more you can add to your solution:

  • Add min-height: 100vh to container element (in your case it is main) because for some page with content smaller than the viewport it will expose the HTML document element.
  • Only use margin when you want an element to have space from it's sibling elements, use padding to create empty space from parent to child elements.

  Cheers 😁😁

  Marked as helpful

  0
• 

  Amjad Shadid•790

  @amjadsh97Posted 4 months ago

  nice job! continue!

  0