Stan Lee Tribute Page Project Feedback

Code Feedback
1

Hi everyone! I’ve just completed the first project, the tribute page, and would love to get some feedback to see how my design looks and ideas for improvement. Thank you!

https://codepen.io/nekortek/pen/pBPaEP

1 Like
2

When you hit enter in description (inner text of p) will not actually go to next line (this character is ignored). There are other ways to achieve this effect, but probably the quickest option is to throw a <br/> in there. (assuming this is what you were going for)

For example, with the below modification:

22%20AM
22%20AM1014×617 246 KB

Not that need that many line-breaks, but just so is easily visible in photo :stuck_out_tongue:

I would say, also see if you can figure out how to get the navbar to move down as you scroll. There is not much point having a “top” if you can only click it by scrolling back to the top. -Edit- Scratch this last one. Forgot I’m still on safari :rofl:

1 Like
3

Looks good but;

  • The copied text contains many citations (those numbers in brackets), since you don’t have footnotes for the citations consider removing them. It will make your text look cleaner and easier to read.

  • I disagree with using <br> tags. If you want spaces you can do things with CSS. What I would suggest is that where you have breaks, close the paragraph tag and open a new one. For instance, in your “about” it looks like you want three paragraphs. Code it as such.

2 Likes
4

Good point. I prefer new p tag as well honestly. <br> makes things messy. It also doesn’t always work. For example, in react <p>{"text blah blah <br/> blah blah"}</p> would render as

text blah blah <br/> blah blah

as opposed to

text blah blah
blah blah
2 Likes
5

Looks good. You’ve done more than just the minimum here.

One thing I would say is that when you click, say, the about link… It jumps to that part of the page, but the header for it is under the navbar. Not sure how to solve that. The way I did it on one of my projects is to set:

margin-top:-100px;
padding-top: 100px;

(Or whatever numbers are relevant to you)

That way the sections which always come after the nav-bar don’t actually start at the top of the page.

6

@nekortek Excellent!
My opinion is that you should make the menu a column when in mobile view. It will look nicer.