Skip to content
Submitted over 3 years ago

QR Code Component using HTML and CSS

foundation
Nicolás Herrera•70
@herreranicolas
A solution to the QR code component challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

Hi everyone!

I tried to apply all the corrections, thanks to your feedback.

Let me know if there is anything I can do better.

Thanks in advance!

Code

Please log in to post a comment

Log in

Community feedback

  • P
    Jordan Phillips•425
    @JordanPhillips-hub

    Looks good.. one other thing you could do on this is to switch the h2 to a h1 and change the font size to font-size: 1.375rem; this will get rid of the rest of your accessibility issues. Generally, it is a best practice to ensure that the beginning of a page's main content starts with a h1 element, and also to ensure that the page contains only one h1 element.

    Marked as helpful
  • Naveen Gumaste•10,420
    @NaveenGumaste

    Hay ! Good Job you made it look nearly perfect to the preview

    These below mentioned tricks will help you remove any Accessibility Issues

    -> Add Main tag after body like it should be your container

    -> For 1st heading or h1 tag, use header tag and then inside the header put your h1 or h2 etc

    -> But use header tag only once in main heading element.

    Keep up the good work!

    Marked as helpful
  • Kacper Kwinta•1,405
    @kacperkwinta

    Looks really good, almost pixel perfect (:

    Some tips:

    • Page should contain a level-one heading

    Also this is not responsive

    Marked as helpful
  • Anosha Ahmed•9,300
    @anoshaahmed

    hey good job on this challenge! you should have at least one <h1> in your webpage

    here is a list i made of accessibility issues & best practices

    hope this helps :))

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