Feedback about my product landing page

Code Feedback
1

I just completed my Product Landing Page certification project, and I would like some feedback about it. It took me some effort to create this website, especially with all the transform animations, and to make it responsive so it can be viewed on small devices such as smartphones.

links to the codepen:
Full page View: https://codepen.io/Agust-n-Perez/full/wvZJwdm
Page With source code: https://codepen.io/Agust-n-Perez/pen/wvZJwdm.

I would really appreciate any suggestions or comments you may have.

2

Hi @agustinperez444

Consider using css in the iframe element, instead of the frameborder attribute, which is deprecated.

I spotted a few typos:

  1. <p>It’s Simple just enter your email and press the suscribe button, We’ll do the rest!</p>
  2. <input type=“submit” id=“submit” value=“Suscribe”>
  3. <p>This is a project made for the <a href=“https://www.freecodecamp.org/learn/”>Free Code Camp</a>
    certificacion of <a href=“https://www.freecodecamp.org/learn/2022/responsive-web-design/”>Responsive Web
    Desing with CSS and HTML

Overall, this looks very professional.

Happy coding

1 Like
3

Thank you for the nice feedback. I gotta work on those typos. That’s because Spanish is my main language, so sometimes I would toss a Spanish word in the middle of a sentence like “certificación” instead of “certification” or “suscripción” (suscribe) instead of “subscription” (subscribe). Most of the time, I can detect these kinds of mistakes and correct them, but I missed those ones. About what you said regarding the “iframe” element, could you explain more about it? This was the first time I used it, and I don’t remember adding this attribute. Maybe it’s because of the IntelliSense plugin I’m using in VS Code that adds that? I noticed it also adds the “src” and “alt” attributes to all my img elements as well.

Anyways, thanks for the feedback! I’m glad you think this looks good.
happy coding to you too, pal!

4

Well done!
You have a consistent color scheme throughout the site and a decent layout!
One thing I would’ve done different for the “Race” card is when the mouse hovers over the card, the race car icon slides to the right as well as fades out completely. It’s sometimes still visible in smaller screen sizes. It would have also been good if you had more padding in also your feature cards.

Other then that, Teller has already pointed everything out. What matters is that you’re satisfied with your site! Well done again and good luck on your next project!

5

I like it very much. I only found one issue that needs addressing, you use multiple <h1> tags, there should be only one for the entire page.

6

Nicely done, @agustinperez444!
Feedback:

  • I typically recommend fresh color schemes for the UI as it is easier for folks to grok through and interact.
  • The “buttons” look oddly shaped, unsure if it was intentional, but from Product perspective it seemed off for a Call-To-Action combined with color theme you are using at the moment.
  • Components could come in handy here with the Javascript framework you are using.
7

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.