Feedback: Create a Tribute Page Challenge

Code Feedback
1

Hello, I am new here and I just got past the first challenge after finishing the responsive web design lesson.
Can someone review my code? I got a bit off-track on the formatting (using milestone years on the content) cause I wanted to practice grid as soon as possible.

I think I typed too much code in creating a simple website like this. Maybe It could have been a shorter one if know how to properly code.
(Sorry for the bad design. I was never good at designing in the first place and am planning to focus on back-end)

here is the link again if you missed it

Feedback, possible improvements and reviews are highly appreciated.
Thank you

2

Your code is formatted correctly and the page looks awesome! It looked like you worked hard on your first project. Keep it up!

3

Thanks a lot! I was eager to test out what I learned from the lessons.

4

Your page looks good @BonnieMaki. Some things to revisit;

  • Keep the test script when forking the pen (<script src="https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js"></script>).
    • The test script should be included, with all tests passing, when you submit your projects.
    • Your page passes 9/10 user stories. Click the red button to see which test(s) are failing and text to help you correct the issue.
  • Codepen provides the boilerplate for you. It only expects the code you’d put within the body element in HTML. (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.
    • The link to the font goes in the box labeled ‘Stuff for <head>’
    • Mentioning because you have elements out of order. For instance, everything the browser renders belongs in the body element. The footer element belongs within the body element. And as you can see from the previous comment, the link to a font belongs in the head element.
  • Run your HTML code through the W3C validator.
    • There are HTML coding errors you should address.
  • Don’t use <br> to force line breaks or spacing. That’s what CSS is for.
  • Review the lesson about giving meaningful text to links.
2 Likes
5

Wow, Thank you for the deep insight. I will revisit these issues. I still don’t know how to put a static background without the html/body tag though. Ill search for it.

Hmm, i cant find a way to put a linebreak between divs(or tags). the only other option i found was putting id/class to my br so they can become larger or just use blank

.

And Ill run my codes in W3C . Didnt know there is a convenient way to check code.

Thanks a lot for these. Ill work on them on the soon.

6

Done with this. Thank you for correcting it. Ill apply what I learned to the next lesson.

7

Nice job cleaning things up. And it’s still a good looking page.