Tribute Page review - Project Feedback

Code Feedback
1

Hello everyone! :slightly_smiling_face:

I’m new here and have almost finished my first project. Could you please take a look? It’s very similar to the example that is given on the FCC website, and I tried to follow the guidelines as much as I could. I’m not sure if I should add more to this page. I tried to keep it simple and minimalistic.

https://codepen.io/davidmihalovits/pen/RmpxYG

Thank you and nice to meet all of you.

Looking forward to your replies.

David

2

Hi David, your tribute page is looking awesome! One small suggestion, maybe you should make your title font size responsive to the screen size. They are way too large on phone screens.

1 Like
3

Hi @davidm, it looks good for your first attempt though I will echo font size on small screens.
Also, there’s a lot of white space on all screen sizes.

Some things;

  • codepen provides you with validators for HTML, CSS and JS. Click on the arrow in the upper right of each section and then click on the respective ‘Analyze’ link. There are a couple of things in HTML you should revisit.
  • codepen expects you to put in the code that would go between the <body> </body> tags. If you need to add anything to the <head> click on the ‘Settings’ button…
1 Like
4

Looks pretty good, nice use of a single accent color.

  1. I would increase the body font size, to between 18 and 22. Also, when using rem one option is to set a base size on the html that makes calculations easier. I’d also get rid of the html/body grouped selector.
html {
  font-size: 62.5%; // 62.5% of 16px is 10px. Making 1rem = 10px.
}

body {
  font-family: Roboto;
  text-align: center;
  font-size: 1.8rem;
  line-height: 1.7;
  min-width: 260px;
  background: #FAFAFA;
  margin: 30px;
}
  1. Usually, people have too long paragraphs, you have the opposite. There is a balance between too long and too short. With short paragraphs the eye has to skip to a new line so often it can cause fatigue. I would increase the max-width on the ul.
1 Like
5

that was a really nice tribute page, but the link at the end is black and when you hover over it, it becomes salmon color.
I would usually keep the link as salmon color and the text black.
Nice Job!

1 Like
6

It looks really good, I like the color design!

1 Like
7

Thank you so much for the replies and encouragement, I really appreciate them. I acknowledge the suggestions and will apply them. Also, I will do the second project today, so see you soon guys! :slightly_smiling_face:

8

Looks very good, the only thing I would do is change the font size to make it a little bit smaller (specifically with the quote).

1 Like