qr code component

Community feedback

• 

  Ahmed Bayoumi•6,740

  @Bayoumi-devPosted over 2 years ago

  Hey Surajit, Congratulations on completing this challenge... It looks good!

  My suggestions:

  • Document should have one main landmark, Contain the component with <main>.

  <main>
     <div class="card">
        //...
     </div >
  </main>
  

  • Page should contain a level-one heading, Change h3 to h1, You should always have one h1 per page of the document... in this challenge, you will use h1 just to avoid the accessibility issue that appears in the challenge report... but don't use h1 on small components <h1> should represent the main heading for the whole page, and for the best practice use only one <h1> per page.

  • Use Font-Family: Outfit as recommended in this challenge to get it looking as close to the design as possible.

  style-guide.md

  Hope this is useful to you... Keep coding👍

  Marked as helpful

  1

  ---

  

  Surajit Shaw•10

  @SURAJITSHAWPosted over 2 years ago

  @Bayoumi-dev Thanks for the suggestions man. You guys are so supportive. I'm about to implement your suggestions to fix the accessibility issues. Thanks again for your time to look at this and give genuine suggestions ✌️✌️

  0
• 

  Abdul•8,540

  @SamadeenPosted over 2 years ago

  Hey!! Cheers 🥂 on completing this challenge.. .

  Lets firstly work on your accessibility issues.

  • Document should have on main landmark basically means your html should be structured more semantically and the correct format should be your <header>......</header> followed by your <main>......</main> and lastly your <footer>....</footer> hence you should use <main class="card"> instead of <div class="card">.
  • Page should contain a level-one heading basically means your html should have a h1 it aid navigation hence <h3>Improve your front-end skills by building projects</h3> should be <h1>Improve your front-end skills by building projects</h1> and you should also go down orderly when you are using the headings h1 down to h2 down to h3 and so on.

  This should fix most of your accessibility issues.

  . Regardless you did amazing... hope you find this helpful... Happy coding!!!

  Marked as helpful

  1

  ---

  

  Surajit Shaw•10

  @SURAJITSHAWPosted over 2 years ago

  @Samadeen thanks man, I couldn't figure out what to do to fix the accessibility issues. You're the savior 🙌😊

  0