Tribute Page (my first project)

Code Feedback
1

Hey all!

Would like to share my first project (short and sweet). I’m a newbie to the world of coding and design (and loving it so far, even though I’m not making the prettiest of pages yet). Any feedback at all is much appreciated (design, best practices, clean/organized code, anything). It has passed all the tests but there is definitely room for improvement.
Excited to be a part of this community and to keep learning!

Thanks :slight_smile:

1 Like
2

Hey b-spades!

Nice first project. As long as you are having fun and learning a bit with every page, it doesn’t have to be “perfect” from day one.

From a design perspective, a few quick tips:

  • The image would benefit from being a bit smaller, so that you can see it, as well as the subsequent content on the same page.

  • The image should have similar top & bottom padding. It looks a bit odd that it touches the top of the image div.

  • It can be difficult in codepen, but I would recommend practicing maintaining the appropriate tag hierarchy to ensure that future projects are easier to read through.

<div>
  <p>
  <p>
etc...
3

Thanks so much for the feedback! I will definitely go back and keep playing with it.

Cheers,
B

4

Hi and welcome :wave:

Nice work and passes all tests :+1:
Only suggestion I have is to check out what the page looks like on smaller screens like phones (maybe less padding for the list items)- check out the developers tools in your browser and see what it looks like on an iPhone 6 screen.

Happy coding and look forward to checking out your next project :slightly_smiling_face:

2 Likes
5

Thanks so much for the feedback. I will definitely give that a try :slight_smile:

Happy Coding!

6

Hi @b-spades, your page looks good. Something to revisit;

  • codepen provides validators for HTML, CSS and JS. Click on the down arrow in the upper right of each section and then click on the respective ‘Analyze’ link.
    • a couple of things to clean up in the HTML section
    • something to look into in the CSS section