earquake-Product landing page feedback

Code Feedback
1

Hi there, I’m new to the forum and I’ve been working on my product landing page. I would appreciate any feedback or thoughts you might have.
https: //codepen. io/earquake/pen/rbpeLB

Thank you!

2

Good work! Few suggestions.

  • Clicking on your logo goes to the middle of the page. More intuitive way is to top of the page.
  • Make subscribe section bigger.
  • Fix html syntax warnings. You can hit analyze HTML when you click on down arrow button on codepen.

Cheers :slight_smile:

3

I completely agree with the quote.

Speaking of which, the quote displays poorly at different screen sizes. In mobile view, for example, its color and size make it difficult to see.

One way to get around this is to restructure <div class="main-img">. Right now, the div houses an actual img element, but you can easily replicate this effect by setting the background property of main-img to the photo you used. This would give you a lot more freedom to play around with the positioning and sizing of your quote. You could make it an <h1> or smaller, and make the size responsive to screen size using media queries.

I think you should also adjust the padding for the “form” and “contact” divs, especially on the top and bottom, to give them room to “breathe”. The “contact” div, for example, has a white bar underneath it, because the <p> at the bottom has a margin. By giving the container some padding, you can get rid of that white bar.

4

Thanks for this! I’ll fix those things.

5

Yeah i had a lot of issues getting that quote where i wanted it. that helps a bunch!

Thanks for your input!