Product Landing Page - UNICEF

Code Feedback
1

Hi all,

I have made a product page for UNICEF, I couldn’t think of a creative item to sell so I choose a charity organisation instead.

Any feedback would be much appreciated :handshake:

Kind regards,

Samatar

1 Like
2

Nice! The only tiny thing I found was that the unicef header image was a bit squashed-looking.
Edit: You don’t need to change it I think it looks nice.

3

Hey there,

great job so far! :clap:

My ideas:

  • on my wide screen, I’m having a hard time reading the texts in About Us and How We Help, because the lines are very long and the texts are rather small.

  • you can increase the overall readability of your page by adding some more spacing, e.g. between the section headings and the sections above

  • you have a lot of empty lines in your code; you can increase the readability of your code by 1. clicking on the small arrow on the right side of the code box and 2. clicking Format HTML/CSS, this will also remove most of the empty lines

Keep us posted and keep up the good work!

4

Hi Samatar,

the website looks nice, well done! I’m working on my landing page right now and I hope it will look as smooth as yours :wink:

I have 3 small suggestions. They are nothing huge but I thinks it’s worth mentioning.

  1. I guess because of the images, the how we help section seems not to be centered. Title vs content are a little off.
  2. The donation tabs are going from the highest to the lowest. I would expect the opposite :smiley: Cool animation on the buttons btw
  3. In media view, maybe consider aligning the nav-bar horizontally? I’m not sure whether that’s the right thing to do, but I feel like right now the header takes quite a bit of space.

I know I’m a bit picky, sorry for that :stuck_out_tongue:

Cheers!

5

Your page looks good @Samatar. Something to revisit;

  • Run your HTML code through the W3C validator.
    • Since copy/paste from codepen you can ignore the first warning and first two errors.
    • There are two HTML coding errors you should be aware of.
6

Hi all,

@GhostRoboXt thanks for your feedback! I tried to make it responsive, hence why it looks squashed on smaller screens

@miku86 Thanks for the feedback once again :+1:t5: I have made the changes you have recommended and I can see the difference already, much appreciated

@kubus0212 I used a table in this area and I have tried to go a with a centralised shape throughout, definitely something to consider next time.

I have change the order, makes more sense going from lowest to highest, thanks for spotting that.

With regards, to point 3. Navbar was the hardest part of this project. Current variant I have on there works the best for me at the moment. I will probably change it when I learn some JS.

@Roma Thanks for sending the validator link, I have pasted it on there and corrected the errors.

Once again, thank you all for taking the time out and giving me back constructive feedback.

Samatar

1 Like
7

I am working on the nav bar right now and it’s killing me. I agree, it is probably the hardest part of the task.
Good luck with next projects @Samatar!

1 Like