A responsive(?) Product Landing Page

A responsive(?) Product Landing Page
0.0 0

#1

Hello and here I am again with another responsive(?) project: this time it’s my 3rd FCC project, the Product Landing Page.

First off, a disclaimer: The video I used is HowToBasic’s “How to make a potato salad”. Here is the link.

So, yea. It’s a made up potato salad restaurant named “Papa Tate’s”. It’s a silly webpage inspired by the well-known “Potato Salad” KickStarter project. I implemented a parallax type of design since I got inspired by the many parallax pages I saw while browsing for an inspiration. It’s pretty cool so I researched and studied how to do so and the result… I don’t know looks decent I guess hahaha. As for the responsiveness, i tried playing around with @media and somehow got the hang of it, but of course, still needs some polishing. My codings and design are still pretty messy/unrefined but eventually I’ll try to simplify everything as I venture along the web dev route.

Anyway, here’s my project.

Please do tell me what you think and thank you for viewing my silly little post.


#2

By far your site looks good as i reviewed it. Some of the things that needs to be improved are.

  1. The height of the header is a little bit too long make it 60px.

  2. Don’t put background color on the information like you had it on the “Welcome” text.

  3. Put the “Contact Us” text right before the email field or above the description.

  4. Make the email text field a little bit wide so that normal size email can fit into it.

  5. Use meaningful name for the submit button like “Send” instead of “Confirm”. When hover over the “Confirm” button it should show the pointer icon.

  6. Provide a link to your linkedin or some other profile in the footer section when hover over your name.

  7. Remove the border from the Quality, Pricing , Delivery section when


#3

Thank you for your feedback @DawoodShahat! I did some changes based on your suggestions. However, the thing with the profile link on my name, I think I’ll leave it as it is for now hahaha. I really want to build my skill and portfolio first before I share my profile and stuff :sweat_smile: Nevertheless, I appreciate your suggestions and it have made the page look better. Thank you again and hoping to hear from you again with some other upcoming projects :smiley:


#4

I love it! It made me laugh out loud.

But for styling, I would suggest a smaller container on < p > for larger screen sizes. The comments stretch out and is centered, so it doesn’t quite fit as well as on smaller screens.


#5

I love it! It looks as good as the real commercial sites!


#6

Thank you! I’m glad it entertained you hahaha. I’ll make my other projects based on my humor and revamp my 2 first projects accordingly as well. And for the container of < p >, I made the global container smaller by 10% instead of specifically just for it. I uh… got lazy so… It still looks okay I guess hahaha.


#7

Thank you so much! It really means a lot to me hearing/reading those words. :grin:


#8

very nice work man. I’m just about to get my feet wet with parallax scrolling :+1:


#9

Thanks man! It’s a really cool effect, you should go ahead and try it out :smile: Goodluck and happy coding! Looking forward to see your work.


#10

impressive! you just started coding 5 days ago without any relevant knowledge?
it is really amazing you`ve done so much just during such a short time. how could you do that?
______________________________________________________
I am being stupid… just realized the account of the forum is different from FCC…


#11

Hahahah yes, I’ve been familiarized through the exercises from the FCC tests as well as watching and reading tutorials on YouTube / w3schools. Never actually thought I’d enjoy learning HTML and CSS. As far as programming experience, I did undergo OOP back in my college days, specifically Java and C#.

However, I haven’t made good use of it and honestly, I’ve reached a stump where I really don’t know where to go. Then after doing some research on what to do, I’ve stumbled upon Brad Traversy on YouTube. He has a lot of inspirational and educational contents so I suggest you check him out if you haven’t yet. Here’s his YouTube channel.

Long story short, I am really enjoying this route and for the first time, it’s something that I truly want to excel in and quite possibly become a well-known full stack web developer in the future. Still very far to what I’m trying to achieve but hopefully, eventually, I’ll get there. :grin:

Anyway, sorry for this drama HAHAHAHA and thank you so much for your compliment *@u4989190 ! I really appreciate it and it gives me the drive to pursue even more. I’m glad I signed up here, being around good people like you guys.


#12

Hi there, i came back to let you know that there are major issues with the page on ipad chrome.