Chat App

Community feedback

• 

  Vanza Setia•27,775

  @vanzasetiaPosted almost 3 years ago

  Hi, Ehab Joe! 👋

  Congratulations on completing this challenge! 🎉

  It's good to know that you were enjoying building this project. I have some feedback on this solution:

  • Accessibility
    • Only use role attribute when you have to make div or span as semantic HTML. Otherwise, you don't need it.
    • For the phone illustration, I would recommend not using landmarks (header, main, footer), since it's just an illustration (decorative). Also, there's no need to use input element and button element.
    • Don't use br elements for presentational purposes. Read what MDN documentation says about it.
    • Use rem or sometimes em unit instead of px. Using px will not allow the users to control the size of the page based on their needs.
  • Styling
    • I would recommend using pseudo-elements for the shape. That way you'll have more clean HTML.
    • Just reference the element that you want to style with the class name. There's no need to increase the specificity by attaching the element.

  /* Not recommended */
  div.container-dog-owner {
    ...styles
  }
  
  /* Recommended */
  .container-dog-owner {
    ...styles
  }
  

  • Best Practice (Recommended)
    • Remove the commented code. If another developer (it can be you in the future) wants to improve this solution, he/she might get confused about whether or not the commented code should be used or deleted.

  That's it! Happy coding! 😁

  Marked as helpful

  2

  ---

  

  Ehab Joe•110

  @huhu0000Posted almost 3 years ago

  @vanzasetia Thank you for this complete feedback and I will try to improve this solution again.

  1