Web Portfolio Project-Feedback on projects

Hi everyone!
I started learning to code in November last year. I’ve completed my Responsive Web Design course now.
I’d really like to get some feedback or advice on how to improve my code

Portfolio Project

  1. Clicking About, Project, or Contact scrolls to the top of the page, not to the correct sections of the page
  2. Clicking View Resume does nothing
  3. I noticed that hovering over a project image makes it jump in front of the navigation bar covering the 3 links on the right side
  4. On smaller screens, the nav bar covers your intro statement

Overall not bad! Keep it up

Hi, thanks for the feedback!

I fixed the links on the navbar so it goes to the correct sections of the page and the hover for the projects doesn’t cover the navbar now.
The Resume button is empty for now, I haven’t added anything to it.
I’ll work on the nav for smaller screens✌️

1 Like

Welcome to the forums @jemjam. Your page looks good. Some things to revisit;

  • Codepen provides the boilerplate for you. It only expects the code you’d put within the body element in the HTML editor. (No need to include the body tags). For anything you want to add to the <head> element click on the ‘Settings’ button, then HTML and add it into the ‘Stuff for <head>’ box.
  • Run your HTML code through the W3C validator.
    There are HTML syntax/coding errors you should be aware of and address.
    Since copy/paste from codepen you can ignore the first warning and first two errors.
  • Codepen provides validators for HTML, CSS and JS. Click on the chevron in the upxper right of each section and then click on the respective ‘Analyze’ link.
    The one for CSS is good. Use it and address the issue(s).
    (The one for HTML misses things which is why I recommend W3C)
  • Your projects all link to the same tribute page project. Not a good UX.
  • White text on yellow in the nav and white text on lighter yellow in the footer is very hard to see. Not enough contrast. This is not accessible and a bad UX. Use a contrast checker
  • Why have a button that does nothing?

Hi, thank you for the feedback and suggestions!

  • I should’ve checked all the links before posting here, my bad. I’ve corrected them now so they go to the right projects

  • I changed the color scheme for the page so there’s more contrast now.

*Changed the button so it goes to my codepen.

Please let me know if you have any more suggestions :smile:

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