My Tribute Page Ada Lovelace

Hello everyone. I am kind of new to web development. Please review my tribute page. Sample only with some help from my hubby with some JS stuff. Thank you.
https://jdsuplito.github.io/Tribute-Page/

2 Likes

any chance you could point me to the documentation to set up a github page the way you have it. I tried and got a 404 lol :-/

1 Like

Hi there, here is the documentation for setting up GitHub Pages


I hope this helps.

1 Like

OMG I’m a dunce. I skipped over the step to enable github pages on the masterbranch. Thx. Your page is lovely by the way.

1 Like

Hi @zephyria, welcome back. Couple of things,

  • keep the test script when forking the pen (<script src="https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js"></script>). FCC will want to ensure that all user stories are being met.
  • Make your page responsive. It has a horizontal scrollbar on smaller screens.
  • When hovering over her pic the thingy speeds up and for some reason the end quotes move to a new line creating an unnecessary space.
  • Is there text missing? I see “-- Ada Lovelace Life–” but then nothing about her life, just a quote by her.
1 Like

Thank you so much for the detailed feedback, i still have a lot to learn and kinda forgot about making it responsive and the FCC script. Thank you again for taking the time I really appreciate it.

Design wise this is a beautiful page. Well done!

My comments for improvement:

  • On a smaller screen the next and previous buttons for the images disappear.
  • While cool that you are able to do it, the speeding up of the circle on hover doesn’t serve a purpose and goes a bit too fast in my opinion.
  • Add some margin or padding, because your text overlaps, especially on smaller screens.
1 Like

The Design is nice but the UI is not up to the point.

  1. The website is not responsive.
  2. The image is overlapping the text behind and the link below it.
  3. Add some more content on the website.
  4. Use the validator provided by FreeCodeCamp.org

That’s all, Happy Coding…

1 Like

Hi there,

Besides the responsiveness of the site, I would say add more spacing between the site and the text.

div#img-caption {margin-top: 58px;}

You can give the main element a background-size: cover; so it is visible on mobile screens as well.

The mobile version can be adjusted by fixing the spacing between the elements oft he website.

:slight_smile:

1 Like

Thank you so much for the detailed feedback i really appreciate it. I’m already making some improvements but its not yet done, I’ll update my project later on. I’ll add all of your advise… Again thank you for your time…

Thanks for the feedback i really appreciate it and thank you for the advice. i will make some improvements later on. Again thank you for taking the time…

1 Like

Hi thank you for the feedback… I will try your advice… Thank you for taking the time i really appreciate it… :slight_smile: