Tribute page feedback on India's mars mission

Code Feedback
1

Hello good people of free code camp,

I finished my first project Tribute page. Can you please give me your feedback to improve my page.

2

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

  • Run your HTML code through the W3C validator.
    • Since copy/paste from codepen you can ignore the first warning and first two errors.
    • Some errors you can clean up.
  • Don’t use <br> to force spacing. Use margin and/or padding in CSS
  • Review the lesson about giving meaningful text to links.
  • In CSS you misspelled the property font-size twice. (You have font0size)
2 Likes
3

Thank you so much. I will keep this mind and make the changes.

4

Not bad. Here are some suggestions.

  1. Remove the default margin on the body.

  2. Remove the margin and the positioning on the tribute-info h1 and instead give the title container some top/bottom padding.

  3. Add object-fit: cover to the image to maintain its aspect ratio.

  4. Limit the length of the text to make it more legible by wrapping all the main text content inside a container and giving the container a max-width and centering it using margin auto. Give it some padding on all sides.

  5. I’d also consider giving the two main text sections some more vertical space. For this simple page, you can get away with just give the h2 element some more top margin.

Quick example pen with the changes, let me know when you are done with it and I will delete it.
https://codepen.io/lasjorg/pen/gOagaNq

2 Likes
5

@lasjorg Thanks a lot for the changes that you have suggested. I really loved the use of container class for the text. The webpage looks a lot more elegant now. I have made the changes, thank you so much for your time.