QR-code-component

Community feedback

• 

  Abdul Khaliq 🚀•72,580

  @0xabdulkhaliqPosted 8 months ago

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

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

  ---

  HEADINGS ARE NOT PROPERLY USED ⚠️:

  • This solution consists incorrect usage of <h3> so it can cause severe accessibility errors due to incorrect usage of level-three headings <h3>

  ---

  • Every site must want only one h1 element identifying and describing the main content of the page.

  ---

  • An h1 heading provides an important navigation point for users of assistive technologies, allowing them to easily find the main content of the page.

  ---

  • In this solution there's <h3> element which is this <h3>Improve your...</h3>, you can preferably use <h1> instead of <h3>. Remember <h1> provides an important navigation point for users of assistive technologies so we want to use it wisely

  ---

  • So we want to add a level-one heading to improve accessibility

  ---

  • Example: <h1>Improve your front-end skills by building projects</h1>

  ---

  • If you have any questions or need further clarification, and feel free to reach out to me.

  ---

  • If you have any questions or need further clarification, you can always check out my submission and/or feel free to reach out to me.

  ---

  .

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

  Happy coding!

  Marked as helpful

  1
• 

  Bishal Singh Deo🎮•1,440

  @Bishalsnghd07Posted 8 months ago

  Hi, @Nyynca👋

  Congrats for completing this challenge🎉

  I would recommend one suggestion to you:

  Your background color should be always in parent container and your parent container is body. I would recommend to shift your background color from main landmark (which is child container) to parent body to display the full width of background color in your layout and it will look perfect.

  And there is some misunderstanding with media queries, by correcting that. Your layout will be look responsive in mobile too

  By doing this changes, you will be get much closer to your responsive layout.

  Hope this, tips will help you ahead in your projects too!

  Once, again welcome to frontend mentor, wishing you a very joyful journey ahead and happy coding❤️

  Marked as helpful

  1
• 

  Olaniyi Ezekiel•7,580

  @Ezekiel225Posted 8 months ago

  Hello there 👋 @Nyynca.

  Good job on completing the challenge !

  Your project looks really good!

  I have a suggestion about your code that might interest you.

  There is an very useful browser extension called Perfect Pixel that allow you compare with the design image and thus see the exact dimensions. I recommend it to you.

  Consider changing the background-color of the body element to hsl(212, 45%, 89%).

  body {
    background-color: hsl(212, 45%, 89%);
  }
  

  I hope this suggestion is useful for future projects.

  Keep up the excellent work and continue to challenge yourself with new projects. Your progress is impressive, and each project is a step forward in your front-end development journey! 🚀🌟.

  Other than that, great job!

  Happy coding.

  Marked as helpful

  1
• 

  Rino raj•260

  @rinoraj6Posted 8 months ago

  hi, Mobile: 375px Desktop: 1440px" these are the widths of the given sample files. the solutions should look like these at the given width. if you open the images with any image editing software (I use mspaint) you can see that the width of the image is 375px for mobile and 1440px for desktop. try to match exactly as much as you can.

  Marked as helpful

  1