Landing page. Need your feedback!

Code Feedback
1

Very interested in your opinion about my 3rd project.
The project itself https://dimayo.github.io/fcc_landing_page/
And code https://github.com/Dimayo/fcc_landing_page

6 Likes
2

It’s great! I like it a lot.

3

Thank you @tadejdanev! When I get such reviews, I understand that the effort was worth it.

4

Great design, especially for a page about food. Very clean and fresh looking. Easy to read and pleasing to the eye.

Please take a minute to look at my technical documentation page and let me know what you think. https://codepen.io/joe-buchanan/full/dwvboa

5

Thanks for the detailed feedback @jrbuchanan :grinning: I will definitely leave my opinion on the project in your topic.

6

WOWOWOW. This is so good! Can you teach me CSS X)? Be my mentor please!

1 Like
7

It is a pleasure to read such words @Tech !
I am ready to answer any of your questions. But I do not know how I can be your mentor. I study only a little more than a month :slightly_smiling_face:

8

:stuck_out_tongue: Do you mind if I ask for help on discord? You are better then me in a month so I’ll be happy to get help from you you! Here’s my discord so we can stay in contact easily if you don’t mind!

iTech#5446

9

This is simply beautiful imho, not an expert design – it looks very good to me.

I certainly wasn’t able to create such website when I was only 1 month into studying.

I think this is really very impressing – the design skills is absolutely something the industry values

10

Very gorgeous! If I could make the smallest of nit-picky comments the only thing I’d consider changing is how when the screen size is small and you hover over the “fit” or “balance” sections it pushes the containers below down just a little during the animation, I think it would look better if only the container you’re animating moved on hover is all. You’ve done such a good job I had to find something small to critique. Keep it up.

11

Really cool and pleasing to eyes. But in my mobile ,the e-mail box is not responsive. Just correct that one. Have a nice day !!

12

Woah, very nice! Just needs some tuning on the responsive part.

13

Thanks for your feedback @borispov. I just tried to copy the design elements of the 2 websites I liked. Therefore, I believe that my design skills are overvalued.

In connection with your statement, the question arises what should be the design skills of a front-end developer, because in most cases he works in a team with a designer.

14

Very grateful for your comment @pschorey. I changed the bottom margins. This should solve the problem.

15

Thanks @Gopikrishna :grinning:
I think I solved this question. But if you have time, check on your mobile.

Thank you @Kyu. Tuning done.:sweat_smile:

16

First off, great job. Here are some things I saw.

  • you should add drop shadows to your images that way it gives an easy 3d look.

  • I think that you should add an email contact in your footer. Here is a post I made on how to do it with your own host or use FormSpree.

  • I think that you should darken your background color so that your white boxes stand out better. For general coloring and for accessibility issues you need to have at least a 4:5 ratio of color difference. Use this to help.

Great job and keep it up!

1 Like
17

Hi @geekysmurf! Grateful for the advice.

  • I added shadows to the images. Is it better?

  • Thanks for the idea, I will use it in my next projects.

  • I agree that my white boxes don’t look better. I added shadows as a temporary fix. In the future, I plan to completely change them.

18

It looks better! I would add a box shadow to your header image and your How it works section.

Other than that it looks great.

20

Really great project @Dimayo

It looks professional! :+1:

21

Great work Diamayo, you have kept it as it is as possible. and it’s good.
So you design work is good let’s talk about coding part. Below are my obersvations.

  1. Do not use or avoid using inline styles, make separate classed for styles.
  2. Improve readability of your html markup when multiple nested elements are required, like in footer there are li > a > span > svg so keep them in separate line, it improves readability.
  3. Try to put comments before HTML blocks, to give information about block to your fellow developer.

I know it’s personal project, but follow best practice like you are working in a team, so you code/markup should be easy to read to everyone in the team. It will help you in corporate world when you will work for real time projects.

Happy coding, peace

1 Like