Yet Another Tribute Feedback

This seems to be a popular feedback project around here. My page started to creep out of scope for the project. Even though it’s not done how I would prefer quite yet, I’m going to post it and move to the next project. I appreciate any feedback!

Shade’s Tribute Page CodePen
Revised Project: Shade’s Revised Tribute Page

Looks pretty good! I would

give some line heights to your paragraphs for better readability.
work on spacings. Here is an article of what I am talking about that was helpful for me.

Cheers :+1:

I like your color choice and how it fits to his cap lol. Good job.

Few days late but I’d rather see the link be ‘more about Malcolm McCormick’ than ‘Wikipedia page’.
For someone sight impaired one makes more sense than the other.

Thank you for the feedback everyone! I returned to my real job recently and have not been as active, but I did read each response and have started making changes to this project.

My main modifications so far have been focused on the structure and best practices of my code. I have learned enough Git and started my GitHub repository so that I can modify any projects through my Windows or Linux install. This was pretty tough, but exciting!

I have also spent the past couple of days researching naming conventions for HTML/CSS and I have settled on BEM methodology for the time being. It was quite interesting going through and refactoring this project even considering how small it is. I found several areas where I was applying formatting to the wrong element, or overwriting formatting across multiple inheritances. This refactor completely fixed my layout for responsiveness at any size, and I believe it has improved readability in general.

I plan on creating a grid with images for the “Album” section of the site, so it looks a little ignored at the moment.

This is a really terrific article @shimphillip! I believe I have restructured my code behind the scenes to where I want it, and my next step is to dive further into this article and apply some design elements to my site. I adjusted my line height for the paragraphs, but I know there is more to do!

I am glad you noticed this @Kyu, it was a conscious decision to try and create a color flow through the site. I’m not 100% certain that it works, but it’s something! :slight_smile:

You are completely correct on this @Roma and I love that you brought it up. I specifically avoided a “click here” link to improve accessibility, but you’re correct that “Wikipedia Page” is just as generic. I have applied your suggestion and it was a healthy reminder for future projects.

So, this is the last of my current planned updates. I have edited the original post with a revised link so that anyone coming across this thread can see a before/after of the work. I will also post the link here: Revised Tribute Page.

I want to say again that I truly appreciate the feedback I received. I am hoping to receive more after this revision so that I can implement further fixes, but if I do not I am satisfied enough to move on to the next project. I learned so much by going back through and researching the suggestions given to me.

Here are a few of the revisions that helped the most:

  • Refactoring my HTML and my CSS code from the ground-up using BEM naming, CSS variables, a nested grid, and comments.
  • Learning about site accessibility and readability to improve color selection, font size & family, and proper page flow
  • Using my CSS layout to create “cells” around all of my content in order to make it responsive. While the mobile size of my site could be restructured to be a single column, and have some font sizes changed, the site responds beautifully on any medium-large display sizes.

Hopefully my comments help to explain some design choices, but if anything is not clear I would be more than happy to explain choices I have made here.

1 Like