My tribute page ready for feedback

Project Feedback
#1
1 Like
#2

After completing my survey form and figuring out how to make typography responsive I may go back into this project and do so. Itā€™s also the first thing Iā€™ve ever coded. Super newbie here.

#3

Nice UI.

I would make it responsive, on mobile views, some texts are spilling to the right.

1 Like
#4

Hello Hat!

I really like the look of your page. In fact, Iā€™m going back into my project and fixing it using some of your layout ideas before I post mine for review.

This is one of the first things I check for when reviewing other peopleā€™s projects as well. This article provides a good overview of what ā€œmobile-firstā€ means, why Google has changed their page rankings to account for it, and where web traffic is going in the future. (Hint: Itā€™s already more than 50% mobile traffic!)

As a new programmer you certainly donā€™t need to learn and begin using everything in this article, but it could help give you some perspective on future projects. Nothing in this project says it should display 100% perfectly on mobile so this is just a friendly FYI that I hope you find helpful. :slight_smile:

One other small detail I noticed here. Your main body and your footer share the same color property for the link <a></a> tag declaration.

/* footer */
a {
  color:#e6ffff;
}

This causes your link in the main body of your text to blend into your background-color property. I wonā€™t spoil how to achieve this, and you likely already know how. freeCodeCamp has taught me to value Read, Search, Ask methodology when learning myself and helping others.

Donā€™t hesitate to reach out if you want more info!

1 Like
#5

Thanks everyone! I will go back in and make everything more mobile friendly before itā€™s all said and done. I did so on my survey form so Iā€™m pretty sure I know how to do this now.

#6

Nice work, you did well.

1 Like
#7

Looks nice.

  1. Personally, I find the ā€˜Cinzel Decorativeā€™ font hard to read. It works great for the headers but not for the body text. I would see if you can find a more legible typeface for the body (I think Raleway might work with it).

  2. I would give the liā€™s some space with margin-bottom.

ul > li {
  margin-bottom: 18px;
}

  1. I would make the footer a little bigger, give a font-size of like 22px to it.

  2. As already said. The link color on the body text background has very low contrast, I would give it a different color (works fine in the footer). Also, ā€œClick hereā€ is not considered good link text.

1 Like
#8