QR code component

Community feedback

• 

  Navendu•270

  @AshxaryaPosted almost 2 years ago

  Hi! 😊

  I have some feedback to help you out.

  Make sure you look at the accessibility report you're provided with below your solution.

  HTML 📄: As you can see in your accessibility report, you are recommended to use a level-one heading as in h1 instead of a h2 for the first text. H tags improve user experience in the sense that they're part of a web page's hierarchical structure. Think of them less as a way to size font and more of a way to show the order of headings, since the size can be manipulated in CSS regardless.

  Use the <main> tag to wrap all the main content of the page instead of the <div> tag. With this semantic element you can improve the accessibility of your page.

  Use the <footer> tag to wrap the footer of the page instead of the <div class="attribution">. The <footer> element contains information about the author of the page, the copyright, and other legal information.

  CSS 🎨: You may want to also use rem instead of pixels for font-sizes! You can learn more about this topic here, similarly, you can search for why you might want to use em values instead of rem for padding, margins, etc in some cases as well.

  Have a great day/night ^^

  Marked as helpful

  2
• 

  Hassia Issah•50,650

  @HassiaiPosted almost 2 years ago

  Replace <div class="card__container"> with the main tag and <h2> with <h1> to fix the accessibility issue. click here for more on web-accessibility and semantic html

  There is no need to give .card_container a height value, increase the width and padding value of .card_container. width: 320px/20rem ; padding:1rem and increase the padding value for .text-content. .text-content{ padding: 1rem}

  Hope am helpful.

  Well done for completing this challenge. HAPPY CODING

  Marked as helpful

  1
• 

  P

  SMHN•200

  @smhnfreelancerPosted almost 2 years ago

  Hi 💗 Congragulations on submitting your solution. You can use <main> tag for card__container's div, instead of <div> tag, you can change <h2> tag to <h1> to fix the validation issues. Hope this comment helps. Regards.

  1