QR code using HTML and CSS

Community feedback

• 

  Md Abid Hussain•400

  @md-abid-hussainPosted over 1 year ago

  Congratulations on completing this challenge

  However there are few suggestion that I want to offer:

  1. Using semantic HTML : Semantic HTML element can provide meaning to the structure of your web page and it can help assistive technology to navigate through your page. Tags like div and span has no meaning. Instead of div you can use main, header, footer and many more.
  2. By default body take full available width of the device and it automatically change as the size of the screen changes. By specifying width you take away this feature and due to this vertical bar appear in screen whose width is lower than specified width. You should remove the width from the body style and then your solution will be perfect.

  Now responding to your question

  What is the best practice for media queries? First you need to understand the meaning of responsiveness. Media query is just a small part of it. I would like to suggest the tutorial which help me understanding the responsive design:

  1. Conquering Responsive Layouts - By Kevin Powell : It is by far one of the best tutorial to understand responsive design and how it get affect by applying different styles to your page.
  2. Dave Gray - CSS tutorial

  Understanding responsive design and media query can be challenging. Keep working hard and you will get through it. Best of luck

  0
• 

  khushboo khatwani•1,070

  @khushi0909Posted over 1 year ago

  1)image should always have alt="some description".some description about image should always be there for accessibility reasons

  https://www.davidmacd.com/blog/alternate-text-for-css-background-images.html

  2)you should learn about semantics HTML and using it for ex footer ,main etc

  3)Read about h1 tag its the most important and every website should have at least one https://www.semrush.com/blog/h1-tag/

  4)body should never have fixed width as width: 1440px;,you should di it as max-width:100vh or min -width etc

  5)responsiveness is implemented ,that is good .

  All the best :-)

  0