Submitted 4 months ago

Meet Landing Page

Peter Bachman• 200

@PeterBachman100

Preview site(opens in new window)View code(opens in new window)

This is a solution for...

Meet landing page

HTML
CSS

1newbie

View challenge

Design comparison

SolutionDesign

Solution retrospective

What are you most proud of, and what would you do differently next time?

Happiest with the last section. Next time I would do more planning and outline work to understand the system and spacing.

What challenges did you encounter, and how did you overcome them?

The spacing with the last section and marker was difficult at first because I had put the marker inside of the div with the image background and then adjusted the position up.

Instead, I create a larger surrounding section with the marker inside and adjusted down, with negative top-margin adjusted the same amount. This helped me keep consistent spacing between the major page sections.

What specific areas of your project would you like help with?

Always open to feedback and ideas!

Community feedback

Nate Valline• 350

@nvalline

Posted 4 months ago

Hi Peter,

Great job on the challenge! I just have a couple small aesthetic suggestions. The paragraph text in the intro section and section 2 gets pretty wide before the site hits the 1200px breakpoint. I would set a max-width on them that is equal to the widest width in the design. That way it retains a similar look and feel for the user.

The other tip is to remember to use img alts. If the image is purely decorative with no real purpose, you should use empty alts, alt="", otherwise include proper alt text for the image. This helps with accessibility and SEO.

I hope this is helpful.

Please log in to post a comment

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