Product Landing Page Feedback (Rad Dragon Dojo)

Code Feedback
#1

Hello Fellow Campers,

It took a while, but I finally finished my Product Landing Page project. Appreciate any feedback or suggestions you might have on it.

Thanks!

( Only 1 more project to go!! :grin: )

1 Like
#2

Good job! I love Taekwondo BTW. Here are few things I would change.

  1. Your images are broken. Try using sources to host your images. I would google this.
  2. Change the color of social icons when mouse hovers on them.

Good luck :slight_smile:

#3

Thanks @shimphillip! Good suggestion about the social iconsā€¦ Iā€™ll do that.

I shared the images from my Dropbox account, which I had read about elsewhere on the forum. It works fine when I tested it from incognito mode on my phone and PC. Not sure why it would work like that but not for you. Iā€™ll have to look into it more and possibly host them from my web server instead.

#4

Okay, Iā€™ve moved the images to my web server. Hopefully that fixes that.

#5

Wow! Looks really great. Way better than mine even though iā€™m not done. Can I ask how long youā€™ve been doing this?

#6

Thanks a lot @Rhine227. Iā€™ve been dabbling in web development here and there for many years, probably since 2001, though not much professionally. I started on Free Code Camp about a year ago to try to get up to speed. Itā€™s been slow going, but Iā€™ve really been enjoying it.

#7

@monksy
All of this is just opinion.
I suggest increasing the font for ā€œTake Your Workout to the Next Levelā€ to make it more prominent.
Add space inbetween the items in the benefits section. The background photo looks a little fuzzy on a 24 inch wide screen monitor and the dark shades are not that dark. Make the email field and the button the same width. Other than that well done.

#8

Okay, I changed the color of the social icons on hover, increased the contrast and quality of the background image, increased the font size of the ā€œTake Your Workout to the Next Levelā€ heading, and increased the spacing between the items in the benefits section.

Thanks a lot, @brandon_wallace and @shimphillip, for the great suggestions.

#9

Not only do I think you did a good job on the landing page exercise, but I really like the name of the fake company. You should buy the domain to sell to someone who wants to take that name.

#10

ā€¦ I noticed your ul tag isnā€™t closed. Code still seems to work, though.

#11

Thanks @Audracity! Good catch on the missing ul tag. I just fixed that. I admittedly spent way too long coming up with the name and the logo, but Iā€™m glad you liked it :sweat_smile:

#12

Good work, looks really sharp. I think that a collapsible navigation for mobile would be a nice final touch.

#13

Thanks a lot @ChrisCline1138. Yeah I agree a collapsible menu would be nice. I havenā€™t done that without Bootstrap yet; Iā€™ll have to look into it.

#14

here is two:


My personal favorite:

#15

Thanks again @ChrisCline1138! These look great. Iā€™ve started on the Technical Documentation project, which I think could also really use a collapsible menu, so Iā€™ll probably implement it on both.

#16

@monksy, regarding a collapsible menu. Since weā€™ve learned a little flexbox in these lessons you could use that to make your collapsible menu.

Wes Bos has some free courses. One called ā€˜What the Flexboxā€™ is very informative and has quick tutorials that only take a few minutes to go through and one even has a collapsible menu that you may like.

1 Like
#17

Iā€™ve heard of Wesā€™ courses before and that theyā€™re really good. Iā€™ll definitely have to try that. Thanks for the recommendation @Roma.

1 Like
#18

thanks for that link

1 Like
#19