Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Huddle landing page with a single introductory section

Vjekoslav• 485

@Vj3ko


Design comparison


SolutionDesign

Solution retrospective


hi, just finished this project. i did it but i feel that i am doing something wrong, like there are so simpler solutions, and i complicate things. maybe if someone can take a look at the code and give me some guidance. i would appreciate it

Community feedback

P
Grace• 27,950

@grace-snow

Posted

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

@Vj3ko

Posted

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

0
Arsh Karpoor• 940

@ArshKarpoor

Posted

Wow!

Very Nice

2
seyide hundeyin• 440

@SeyideHundeyin

Posted

Hi Vjekoslav,

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

It's also responsive!!

Have a nice day!

0

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord