I remade my Company/Product Landing Page

CodePen - Product Landing Page - 2 - for the full page
https://codepen.io/bogdan-leica/pen/NWXJMgZ - for the code

Also, this is the old one:

Product landing page

I’d like some feedback and maybe advice if you find something that’s not working properly or regarding the design


your <meta> should be in the <head> not in the <body>

the paragraphs have fixed size that flow into video and nav-bar in mobile.

there is a inconsistent gap between the last .product-grid and the others divs in mobile

btw this is my personal opinion, but i hate opacity in nav-bar showing what it’s behind if it switched to blur what is behind it. it would be nice :sweat:

you did well for desktop version

I checked and all the meta is inside the <head>, could be a bit more specific please?
Also can you tell me on what resolutions you’re having the issue on mobile? I checked both with chrome dev tools and on my phone and the paragraphs don’t seem to overlap the video or the nav bar

Thanks for letting me know about the gap, trying to fix it now

Hello @BTheory I just looked your project, you did a good job . I have some my personal opinions :smile:
1, I think your background set another color is better, because a whole page just two color makes me feel monotonous.
2, if have footer then maybe looks more standard.
3, the last one I have the same opinion as @Sboony about the nav-bar blur, looks not so good.

ok , that’s just my personal opinion. have a nice day. happy coding. :ok_hand:

1 Like

thank you for the feedback!!

1 Like

I tried to press this link https://cdpn.io/pen/debug/NWXJMgZ?authentication_hash=nqkwvoeQZOPA but got 403 error.

your codepen doesn’t have the issues i mentioned.

other than .whoAreWe vanishing. everything is working as intended

you used grid to place the cards, so put the video in about section and place the paragraphs and video next to each other

1 Like

You can maintain the aspect ratio of the video without the black box around it.

This pen has two simple examples

The aspect-ratio property is fairly well supported now but one of the examples is using an alternative as well if needed.

1 Like

Tried adding it, but it doesn’t change anything

You have to remove all the sizing you have now and add the CSS to the iframe.

Edit: deleted https://codepen.io/lasjorg/pen/OJzqrwG?editors=1100

You can fork the example and let me know when you have it (I will delete it when you are done).

1 Like

Hey there, I’m done with modifying! Thanks for taking your time to explain and help :smiley:

No problem, happy to help. I will delete my fork if you are done with it.

1 Like