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 Using Flexbox

Tiffani 30

@tiffanicodes

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


I'm sure grid would be helpful for this challenge, what specific sections would benefit from using grid instead of flexbox?

Community feedback

P
Fluffy Kas 7,735

@FluffyKas

Posted

Heyo,

I don't see anything that would really benefit from a grid. The video-chat section could've been done with it but I see you managed just as well with flexbox! It looks like a great solution by the way, really neatly done (even the alt texts are very nice). What I would suggest to improve it a bit:

  1. Everything that isn't a header or a footer in this challenge could go inside a <main> as sections in themselves aren't landmarks.

  2. Check your solution between 770 and 1100 px. The header's media query could be adjusted a bit!

  3. I'd put perhaps an aria-hidden="true" on some of the decorative elements that you achieved by styling divs, like the numbered buttons and lines.

Marked as helpful

0

Tiffani 30

@tiffanicodes

Posted

@FluffyKas thank you so much for this feedback! These notes are incredibly helpful and I'll be sure to implement them. Really appreciate you taking the time to checkout my work!

0

@JulianJ44

Posted

Hi @tiffanicodes, there are four accessibility issues that are important that you attend to as this is very important when it comes to usability. However, in terms of what you are able to do so far, it's coming along well.

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