Mobile-first and responsive page using Flexbox

Community feedback

• 

  Vanza Setia•27,775

  @vanzasetiaPosted over 2 years ago

  Hello, Guilherme! 👋

  Good effort on this challenge! 👍

  Some recommendations from me:

  • I would recommend removing the header element. header element should contain things like the logo, navigation links, and, call to action button. In this case, the illustration should live inside the main element as part of the card content.
  • Also, in addition to the previous feedback, the illustration and the music icon should not have alternative text. This is important because the screen reader users might get confused with those images that have nothing to do with the page content.
  • Don't limit the height of the html and/or the body elements because by limiting the height of the page, the users will not allow the users to scroll the page if the page content needs more height. You could see the issue if you view the site on mobile landscape view. So, use min-height instead.
  • Also, like @Old1337 has mentioned earlier that the site should have a background image so, if you add it then the site will look more similar to the design.

  That's it! I hope this information is useful! 😁

  Marked as helpful

  1

  ---

  

  P

  Guilherme Silveira•40

  @GuiSilveiraPosted over 2 years ago

  @vanzasetia Thx a lot by that feedback! I will use your tips on my next projects!

  0

  

  Vanza Setia•27,775

  @vanzasetiaPosted over 2 years ago

  @GuiSilveira No problem! Glad to help! 😄

  0
• Account deleted

  looks good,

  all you need is to add the background image and will be perfect

  1

  ---

  

  P

  Guilherme Silveira•40

  @GuiSilveiraPosted over 2 years ago

  @Old1337 I'm gonna fix it now! Thx, man!

  0