Tribute page, my first project!

Hi, everybody!
Here is my first project, I´ll be glad to have any feedback that can help me improve, thanks!

Tribute page: https://codepen.io/Macaco01/pen/xxwxwmr

1 Like

Cool man!
Things to improve -

  • Give some padding to the content on your site, to make it more readable.
  • Increase the font size.
  • Can change the font use fonts.google.com

Overall great.
I’ve build the same project a few days ago take a look - click here

Welcome to the forums @Macaco01. Your page looks good. There are a few things you should 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 project.
  • When using codepen it only expects the code you’d put within the <body> </body> tags in HTML. (No need to include the body tags). For anything you want to add to <head> click on the ‘Settings’ button, then HTML and add it into the ‘Stuff for <head>’ box.
  • Run your HTML code through the W3C validator. Just copy your HTML and paste it into the ‘Validate by Direct Input’ tab.
    • Since copy/paste from codepen you can ignore the first warning and first two errors.
    • There are errors you should clean up
  • Review the lesson about giving meaningful text to links.

i´ve done some changes based on what you´ve told me , you can go and check them out, Thanks!

Hi Zippytyro great advice! Quick question how do you use some of these fonts from google? I tried inputting into my Tribute page under the CSS option as font-family: Comic Neue . Would other step would i have to take to link it to that font?

Thank you,

Here are the steps -
Go to fonts.google.com then choose one font and it will get selected automatically.

look in the corner the font is selected, go to embed option -
then copy the link tag code paste it under your <head> section in your HTML.

You see the CSS there copy the font-family code after it and paste it wherever you want that font-family.

PS: you can select as many fonts you want from the Google fonts site. Add them at once, all the fonts will be added then copy the whole code.

I still see coding errors when running your code through the W3C validator @Macaco01. Maybe you didn’t save or maybe you created a new pen?
You can do the editing in the same pen, save it and then you don’t have to resubmit your project.
If you made changes and saved them in a new pen you’ll have to resubmit using that new URL.
Hope that makes sense.

Oh super simple! Thanks Zippy!

Hope that worked for you. btw my name is Shashwat. we can connect on instagram @zippytyro.

1 Like