My (bare bones) Tribute Page

I figured I would post my tribute page and see if anyone has some feedback. I really liked the process of developing it, but I could not be less interested or capable in the design aspect. I am the least visually artistic person I know, so I realize there is a ton more I could do to improve the aesthetics. I kind of wish I had a designer who could just tell me how I should make it look so that I could go out and implement that design.

Anyway, here’s the CodePen.

A very decent tribute page. There’s nothing wrong with your design. There are only three minor changes I would like to recommend:

  • Maybe add padding-bottom:20px; to the .top-bg class so the red background continues below the image. IMO this looks a little better.
  • In the ul li selector, repeat the font-family you chose for the p element. It looks a little weird when the font changes from serif to sans-serif and back in the middle of the text. (For future projects, it is probably advisable to assign the main font to the body element and then define exceptions such as headings etc.)
  • Maybe use a lowercase o in the top-level domain “org” in the last line.

I’ll work with the padding and see how much better I can get it to look.

I intentionally left the font-family off the of the ul li selector because I thought it would differentiate the paragraph text from the bullet-points. I definitely see how the transition is a little odd.

Thank you for the words of encouragement and info on Material. I will definitely check it out.

Two more little things I found:

  • “og new grape varieties” should probably be “of”.
  • In the sentence “This old English measurement equals just 8 modern wine barrels indicating just how desperate the colony–originally founded by a trade company—was to start successfully producing wine.” you’ll probably want to replace the two hyphens with a dash.