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

Responsive landing page built with Flexbox, Grid, SASS and BEM

P

@claire-ca

Desktop design screenshot for the Meet landing page coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


Any advice on how I can improve are more than welcome!

Community feedback

Vanza Setia 27,795

@vanzasetia

Posted

Hi Claire! 👋

Good job on finishing this challenge! 👏

I have some feedback on this solution:

  • The header should only contain the logo. The header__content should be a section inside the main landmark. It's commonly called as hero section.
  • I would recommend using CSS background properties to handle those hero images.
  • For any decorative images, each img tag should have empty alt="" and aria-hidden="true" attributes to make all web assistive technologies such as screen reader ignore those images. In this case, all images inside the section-identifier and hero images are decorative only.
  • The alternative text for the logo should not contain any words that are related to image, such as logo, icon, picture, photo, etc. The company name itself is already enough. 🙂
  • The last section of the page should not be a footer element. It should be a section that lives inside the main landmark. footer should contain information like copyright, etc.

That's it! Hopefully, this is helpful and happy coding! 😉

1

P

@claire-ca

Posted

@vanzasetia Hi Vanza!

Thank you so much for your feedback 🎉, it's been very helpful.

Happy coding!

1
Vanza Setia 27,795

@vanzasetia

Posted

@claire-ca You're welcome! 👍

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