RWD - Build a Product Landing Page submitted

At this stage I’m more interested in learning and understanding the concepts covered for Responsive Web Design Certification.

I welcome your feedback. Happy coding!

Hi there! :slight_smile: Really good job on your page, it looks very clean and professional, and it’s responsive for the most part which is definitely a good thing. I do have a couple of comments that you might like to revisit:

  • When you click on the links in the navigation bar, you’re taken a bit too low and you can’t see the heading in desktop view and half the text in mobile view (I’ll get to this, though), which can be pretty confusing for a user and not the best aesthetic experience. This happens because you’re taken to the section in a way that it begins at the very top of the screen, but since your navbar is there, it kind of covers the heading. I usually resolve this by using extra padding or margin on the section elements, but I’m not claiming that this is the best way to fix it, so if anyone has a better and more elegant solution, I would encourage them to share (I’m interested to know as well :smile: ).
  • Also on the topic of navbar: Even though it’s pretty commonplace to have a sticky navbar in desktop view, it can be very distracting on smaller screens. When your navbar links start going in a column instead of a row (at the 700px break point), the navigation covers like a third of the screen. And it’s sticky. So, I would suggest making it static on mobile devices or making some sort of hamburger menu which the user can minimize and expand at will.
  • A tiny error in your HTML code: You have a closing </html> tag at the end of your code with no corresponding opening tag. Just remove it, the CodePen HTML panel acts like a container for the body element anyway, so you don’t need any tags that are higher than that in the tree hierarchy.

Other than this, great work! I hope this helps and if you still have any questions, don’t hesitate to reach out :slight_smile:

1 Like