QR Code challenge by DominikaPap

Community feedback

• 

  Abdul•8,540

  @SamadeenPosted over 2 years ago

  Hey!! Cheers 🥂 on completing this challenge.. . Here are my suggestions 1.You should use <main class="main"> instead of <section class="main">. 2. You should also use the footer tag instead of the <section class="footer"> 3. Its best you add a text to the alt attribute in the img tag

  . Regardless you did amazing.. Happy coding!!!

  Marked as helpful

  0
• 

  Brian Johnson•210

  @BrianJ-27Posted over 2 years ago

  Hey There @dominikapap Great job overall laying out this project. You have this card square in the middle and that is awesome!

  I have a few things to share with you regarding your codebase. I'll just number them for you :)

  1. for your <section class="main"> tag, change the <section> tag to a <main> tag

  2. for your <section class="footer"> tag change the <section> tag to a <footer> tag **Formatting your code this way should remove all of your accessibility & HTML issues with the code

  Regarding best practices, I see you have 2 css stylesheets in the root directory of your project. It is usually best to create a "css folder" then place those 2 stylesheets within that folder. When you do that, you next need to go back to your index.html file and modify your filepath to the stylesheets.

  That's all I see for now at quick glance but great job overall. Happy Coding

  Marked as helpful

  0
• 

  Rémi Martineau•355

  @MartineauRemiPosted over 2 years ago

  Hey Dominika ! Nice work on this solution, congratulations :) Here are some tips :

  • You should read about semantic html: https://www.w3schools.com/html/html5_semantic_elements.asp

  In your case, you could replace <section class="main"> with <main class="main">. Same thing with the <section> wrapping your attribution, at the bottom of your html file. Why not use a <footer> tag instead ? :)

  • if you want to set an empty alt property to an image, I suggest you to add a property called 'aria-hidden' set to true. More on aria-hidden: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-hidden

  For this particular example though, I would put something in the alt property, since the image is not purely decorative, and a description could be helpful for screenreaders users.

  Hope this can help you ! Keep up the good work, and happy coding :)

  Marked as helpful

  0