Derek Jeter Tribute Page feedback request

What’s going on everybody? I just finished this a few minutes ago and was just hoping to get an idea of how I did. Maybe tips on things I could have done different. Still just trying to figure all of this out.

Thanks

Regardless of what I think of the Yankees, this is a nice looking page :slight_smile: A few suggestions:

  • There is a constant horizontal scroll bar. Granted, it doesn’t scroll much, but it shouldn’t be there at all.
  • The text underneath the image is hard to read with the pinstripes in the background. Same with the text at the bottom. You could perhaps make the pinstripes much lighter and thinner?
  • Put a max width on the content so the line length doesn’t get too long. Long lines of text are hard to read for some people.
  • The <h2> really isn’t a heading. It’s either part of the <h1> (you could use a <span> to style it differently) or just a <p>. This change would make the heading above the list an <h2>.
  • You can only use a <figcaption> in a <figure> so just change the <div>.
  • The alt text on the image is pretty good but you might try describing what he is doing in the image a little more. “Celebrating” could mean a lot of things. Perhaps “jumping up in the air with his arms outstretched above his head”.
  • This one is real picky, but instead of using <strong> for the dates in the list, use <time> and the style it bold with CSS.

Hahaha thanks for supressing your disdain for the Yanks, and a much bigger thanks for the tips. I’ll work on the changes now.

Your page looks good @c_0h. In addition to what was already said some additional things to revisit;

  • Keep the test script when forking the pen (<script src="https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js"></script>)
    The test script, with all tests passing, should be included when you submit your projects.
  • Run your HTML code through the W3C validator.
    • There are HTML syntax/coding errors you should be aware of and address.
      Since copy/paste from codepen you can ignore the first warning and first two errors.