Product landing page- Feedback and suggestions please!

Code Feedback
1

Hi
I completed my Product landing page project.
https://codepen.io/salim-merazga/full/VNdBKa

Suggestions please and how to choose to correct color scheme

Thanks in advance

2

Awesome and responsive.
However, it’s not just your color scheme that needs urgent attention.

  • Your nav hides on small display screen (maybe it’s me, we’ll see what others say.)
  • I think your We're supplier #1 for Huawei Mobiles! font-size should be set to the viewport size.
  • Your Main Features section, you can add little padding at the top of each card feature-card
  • The font-size of icons on each feature-card could be reduces a little (except if that’s what you were going for)

Overall, you did a nice job with all the work you put into it. It’s still easy to read.

3

Thank you much for the notes:

  • Your nav hides on small display screen (maybe it’s me, we’ll see what others say.)
    -I intended to do it until I learn javascript to creat menu for small devices
  • I think your We're supplier #1 for Huawei Mobiles! font-size should be set to the viewport size.
    -Do you mean that I should use em unit or vw unit
  • Your Main Features section, you can add little padding at the top of each card feature-card
    -I just add it.
  • The font-size of icons on each feature-card could be reduces a little (except if that’s what you were going for)
    -you’re right I made it 4em and it look better

Please take a look again and thanks for your time

1 Like
4

Love the new look :+1:

  • I feel you should try using padding: 1em 5em; for the #nav-bar so can have enough room to increase the height and width of your logo.

  • Or better still try using padding: .2em 5em; for the #nav-bar and width: 200px; height: auto; for #header-img can help give the logo and #nav-bar good looks.

  • The font-size of #follow is large.

  • Noticed some inline styling which isn’t recommended. Try using external styling

All suggestion…

5

Thank you so much :slightly_smiling_face: