Skip to content
Submitted over 1 year ago

QR_Code_Component Solution

rdivyansh1474•50
@rdivyansh1474
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...QR code component
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

Nothing was difficult in this project. Frontend Mentor is the best platform for practice.

Community feedback

  • Abdul Khaliq 🚀•72,580
    @0xabdulkhaliqPosted over 1 year ago

    Hello there 👋. Congratulations on successfully completing the challenge! 🎉

    • I have other recommendations regarding your code that I believe will be of great interest to you.

    HTML 🏷️:

    • This solution generates accessibility error reports, "All page content should be contained by landmarks" is due to non-semantic markup, which lack landmark for a webpage
    • So fix it by replacing the <div class="card"> element with the semantic element <main> in your index.html file to improve accessibility and organization of your page.
    • What is meant by landmark ?, They used to define major sections of your page instead of relying on generic elements like <div> or <span>
    • They convey the structure of your page. For example, the <main> element should include all content directly related to the page's main idea, so there should only be one per page

    .

    I hope you find this helpful 😄 Above all, the solution you submitted is great !

    Happy coding!

    Marked as helpful
    0
    rdivyansh1474•50
    @rdivyansh1474Posted over 1 year ago

    @0xAbdulKhalid Thanks for your feedback. Your feedback was helpful for me❤️

    0
  • Daniel 👨‍💻•980
    @Daniel-BilodidPosted over 1 year ago

    Hi, my congratulations you did a great job 🎉

    𝐒𝐨𝐦𝐞 𝐭𝐢𝐩𝐬 𝐟𝐨𝐫 𝐲𝐨𝐮𝐫 𝐜𝐨𝐝𝐞 🛠

    🔹 You need to put a landmark in your code

    simply wrap your code with <main class='card'> landmark instead of <div class='card'>

    📚 The <main> HTML element is intended for the main content (content) of the <body> of the document (page).

    I hope it was helpful, you are great, keep up the good work 👍

    Marked as helpful
    0
    rdivyansh1474•50
    @rdivyansh1474Posted over 1 year ago

    @Daniel-Bilodid Thanks for your feedback. Your feedback was helpful for me❤️

    0
    Daniel 👨‍💻•980
    @Daniel-BilodidPosted over 1 year ago

    @rdivyansh1474 glad to help you!

    Marked as helpful
    0

Please log in to post a comment

Log in with GitHub

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