Huddle landing page with a single introductory section

Community feedback

• 

  T

  Grace•31,090

  @grace-snowPosted almost 4 years ago

  Hi, I think this looks great!

  Some very small points for improvement in the HTML:

  • Never put alt="logo". Alt text needs to be a meaningful description of an image. In this case, that's Huddle (e.g. how would assistive tech users know what this product is called?)
  • the header element should be above main, not inside it
  • those social icons should be inside labelled anchor tags. They would be links, and need focus and hover states on those links like any other (they are also hitting the bottom of the screen on mobile, so maybe give them some margin-bottom)
  • you have an extra div you don't need IMO. Container__title is unnecessary as you could put the padding on the div above.

  In the css you are making it more complicated than it needs to be. Don't worry about changing font sizes so much. And try to think about reusable classes for things like buttons - that shouldn't need a nested selector specific to this component but a .btn class that could be used again.

  In future challenges I'd recommend you focus on

  • mobile-first
  • keeping css specificity as low and flat as possible by using single class selectors in your css (better to have more than one class on a html element if needed than have nested or oveely specific css)
  • small accessibility details like alt text visible focus states, hovers etc

  Best of luck

  2

  ---

  

  Vjekoslav•485

  @Vj3koPosted almost 4 years ago

  @grace-snow ty so much for ur time reviewing this, i really appreciate it

  0
• 

  Arsh Karpoor•940

  @ArshKarpoorPosted almost 4 years ago

  Wow!

  Very Nice

  2
• 

  seyide hundeyin•440

  @SeyideHundeyinPosted almost 4 years ago

  Hi Vjekoslav,

  This looks very nice and matches perfectly with the design file.

  It's also responsive!!

  Have a nice day!

  0