Skip to content
Submitted over 1 year ago

Frontend Mentor - QR code component solution using HTML and CSS

Hadi Farbakhsh•40
@HadiFarbakhsh
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

Hi, This is my first solution to the challenge, I'd be happy to have your comments on the code and let me know if you have a better solution. Thankful

Community feedback

  • C H A R A N 🎯•2,670
    @0xabdulPosted over 1 year ago

    Hello Developer well congratulations on successfully completing the QR code component

    • A Some suggestions for improve your code
    • In Html 📃 :
    • LANDMARK 🚀
    • The main landmark should be a top-level landmark. When a page contains nested document and/or application roles (e.g. typically through the use of iframe and frame elements), each document or application role may have one main landmark. If a page includes more than one main landmark, each should have a unique label.
    • To Clear the Accessibility reports use the Semantic elements Or non - Semantic elements
    • Note This Elements are don't sikp
    • semantic elements : <aside> , <artical> , <main>, <header> ,<section><footer>, <form> ect..
    • non- semantic elements : <div> , <span> ect ...
    • for easy way to clear the Accessibility reports using non semantic elements Ex :
    <body>
<div class="container" role="main">
/html code goes here : 📃
</div>
</body>
    • Or
    • using semantic elements
    • Ex :
    <header>
should be put heading or logo📸
</header>
<nav>
//Links here
</nav>
<main>
Main of the contents 📃
</main>
<footer>
©copy right  here📍
</footer>
    • Happy Coding Developer
    0
    Hadi Farbakhsh•40
    @HadiFarbakhshPosted over 1 year ago

    @0xAbdul I will definitely consider it Thank you

    0
    C H A R A N 🎯•2,670
    @0xabdulPosted over 1 year ago

    @HadiFarbakhsh 😊 thanks

    0
  • Munsif Ali•200
    @Munsif-AliPosted over 1 year ago

    although your design is looking good i would give you one suggestion that is your repository structure is not looking good i mean create a separate folder for images and place all the images in that folder and create a folder for CSS and place the CSS files in that folder

    0
    Hadi Farbakhsh•40
    @HadiFarbakhshPosted over 1 year ago

    @Munsif-Ali Thank you for your suggestion

    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