Product landing page. Any constructive feedback?

Hey guys,

Here (https://codepen.io/ngerempakanis/pen/rNWoJaq) is my product landing page.

It does look rather “rough” (as expected, i guess…) but i am mostly satisfied , especially given the fact that a lot of Googling had to be done.

I was also wondering if there is a way to change my “submit” button’s text. I know it can be done by using the button tag, but that didn’t satisfy the project.

Thank you for your time!

Hi there,

Your page looks good, but I would suggest that you make it more responsive by stacking the paragraphs vertically in small screens. Also, making the navigation links disappear at small screen sizes is not user-friendly. You can style the links to look good in small screens.

Yes, you can change the text of the submit button.

2 Likes

Thanks for the input!

I do want to refine it further. Tbh this was a bit let’s-check-all-the-boxes effort, as it has taken much more time than i expected!

How about now?
Although i couldn’t manage to move the dropdown menu to the right as i wanted…

Nice!

I think making a dropdown menu is a unique solution. After learning some Javascript, you can learn to make a hamburger menu. For now, you can style the dropdown menu, and I think messing around with the margin will push it to the right.

Editing, the drop down menu doesn’t really work as a navigation menu because the options don’t link to the different sections of the page. I’m not sure if they can be made to do that. If that’s even possible, it’s probably not good practice.

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

  • Run your HTML code through the W3C validator.
    • There are HTML coding errors you should be aware of and address.
    • Since copy/paste from codepen you can ignore the first warning and first two errors.
  • Check that the user has entered a valid email addr (and other fields that you want). 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
  • This is a suggestion. You don’t have to incorporate it but maybe change “Select” to “Navigate” or something similar.