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.
- Web Accessibility in Mind gives a more thorough explanation
- “learn more” and “here” are not accessible
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!