Tribute Page Review Requested

Code Feedback
1

Hi there. I’d appreciate any kind of input on my tribute page. Thank you :)[https://codepen.io/KasiaCzar/full/poNONVJ]

2

I like the simplicity of your page. But it is not passing all the tests , so make sure the page passes all the test provided before submission.

Other than that, the page looks great!

3

Hi, thank you. That’s strange, I get 10/10 when I ran the test.

4

No problem!

And I dont know may be the problem would be from my browser. If your project passes all the tests, go ahead and submit it.

5

It is. Remember that a post must be 20 chars, or more.

6

Your page looks good @kasiaczar. Some things to revisit;

On a side note I don’t think most people are seeing your page the way you intend. You may have “Monotype Corsiva” loaded on your machine, I do not. It may be better to link (or import) a Google font so your page will display the same no matter what OS the user is running.

7

Hi Roma, thank you very much for your corrections. Is that better?https://codepen.io/KasiaCzar/pen/poNONVJ
I fixed the links and I imported google font. Totally different from the previous font but the text became easier to read.

8

The new font is awesome!
BTW how did you make the image responsive, vw n vh?
And another suggestion(objective, you may or may not add it to the page)
Add some more padding bottom to the page.

9

Your page looks good @kasiaczar. Nice job with the link and the font.

Side note, your font-family contains a font-name and a default font. All well and good. But after that there is another font-name and default font. The second font-name and default will never be seen. If “Comic Neue” fails to load the code will fall back to the default font and will never look any further.
Just know that after any one of the five default fonts, there’s no need to add any additional font names.

Hope that makes sense.

A couple of minor things you don’t have to change now but be aware of in the future;

  • Codepen provides the boilerplate for you. It only expects the code you’d put within the body element in the HTML editor. (No need to include the body tags). For anything you want to add to the <head> element click on the ‘Settings’ button, then HTML and add it into the ‘Stuff for <head>’ box.
    • For instance links to fonts go in the box labeled ‘Stuff for <head>’
  • When using semantic elements you wouldn’t have the footer within the main element. I realize the first user story calls for an element with an id="main". That could have been accomplished with a div rather than a main element.
    It’s a nit. Getting used to semantic elements can be a little tricky sometimes.
10

Roma, thank you so much for your valuable input. I fixed the font names. I moved the font links to stuff for <head>, as you said. I also changed <footer> to <h4>.
https://codepen.io/KasiaCzar/pen/poNONVJ
Thank you for taking your time to help me :slight_smile:

11

Hey :slight_smile:
It does loo better with more padding on the bottom, thanks :slight_smile: