Product-Landing-Page project

Hey guys
I made this tragic wacky project :"D and I need some feedback
https://codepen.io/aa159/full/LYLpaXL

Hey there @amr15952 ,

I went through your project, it seems excellent !
Here is some feedback on it:-

  1. Try to align the “Original Trombone” text properly. It looks out of alignment. Same for the guitar
  2. Try to spice up the Submit panes :smiley: . Some starting points for this are styling those buttons and adding a hover effect to the pane
  3. You could use a different more soothing font like Montserrat (This is optional and is based on your preference)

Hope this helped
Happy Coding :smiley: .

1 Like

In addition to what @abhijitbiswas07 has stated, I would like to append this - It would feel better overall if the texts in the main page are aligned to the centre. Creates a better flow for the reader.

1 Like

Your page looks good @amr15952. Some things to revisit;

  • Run your HTML code through the W3C validator.
    • There are HTML syntax/coding errors you should be aware of and address.
    • Since copy/paste from codepen you can ignore the first warning and first two errors.
  • Codepen provides validators for HTML, CSS and JS. Click on the chevron in the upper right of each section and then click on the respective ‘Analyze’ link.
    • The one for CSS is good. Use it and address the issue(s).
      (The one for HTML misses things which is why I recommend W3C)
      Although you don’t use it this time be wary of duplicating selectors…it can make maintenance a nightmare
  • Do not use the <br> element to force line breaks or spacing. That’s what CSS is for.
  • Check that the user has entered a valid email addr. Throw an HTML5 validation error if not.
    You learned to do this when coding the survey form
  • Make your page responsive. Remember, the R in RWD stands for Responsive
    • There’s a horizontal scrollbar on smaller screens

A suggestion, do not try and replicate the sample projects. They are just that, an example of one way to do the project. The instructions say to make yours “functionally similar” and “give it your own personal style”.

1 Like

Thank you so much bro :heart:

Thank you man, I appreciate it :heart:

I’ll do it, thank you so much for your feedback man :heart: