My fcc Tribute Page Project Feedback

Hello Everyone!

I would appreciate feedbacks on my project.

I want to get better, please help me.

https://codepen.io/Hopefyx/pen/yLJLpeg

4 Likes

Hey @Hopefy!
Your page looks good!

  • Your page is no responsive.
  • You add text at the bottom like "Made by Hopefy "

That’s my feedback

Thanks and Happy Coding!

Thank you Codely!

I can easily fix the second part.
Can you please explain the not responsive part?
What do I do to fix it?

I hope you have learned how to use Media Queries in a website.

If not,
I suggest you to start learning this section

3 Likes

I think you’re off to a good start! I believe there is a lot of room for improvement on the aesthetics side of things. Mess around with implementing fonts from Google Fonts, and messing around with the sizing of different elements and text. The most important thing for a webpage like this in my opinion is going to be readability, so I would definitely have a focus on making the text somewhat larger and have better contrast with the background. Good job, keep up the good work!

1 Like

This is beautiful, I really love your choice of colours. You are doing well, just put more effort in making your page a little bit more responsive, using @media queries

2 Likes

Your page looks good @Hopefy. All tests pass and it is responsive. Some things to revisit;

  • 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.
  • Run your HTML code through the W3C validator.
    • There are HTML coding errors you should be aware of and address.
  • Do not use style tags in the CSS section of codepen. It will cause problems.
    • style tags are only used in the head element when doing internal styling.
  • Accessibility is about being accessible to all users. Review the lesson about giving meaningful text to links.
2 Likes

I changed a couple of things, feedbacks please!

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

  • Never use view port units for font sizes. The user should always be in control of the text size on the page (that is, they should be able to manually increase the text size). Using view port units prevents them from doing this. Your job as a developer is to make sure your page is responsive to text size increases. If you don’t know how to manually increase the text size, using Firefox, go to the ‘View->Zoom’ menu and activate ‘Zoom Text Only’. Then while holding down the Ctrl key scroll your middle mouse button to increase the text size. If font-sizes are defined with vw units the only way a user can increase the text size is to widen the browser window. What if the user has really bad eyesight and can’t make the browser window wide enough?
  • Accessibility is about being accessible to all users. Review the lesson about giving meaningful text to links. For a more thorough explanation read Web Accessibility in Mind.
    • “wikipedia page and tribute page” are not accessible
    • I encourage you to read the provided links to understand why.