My first webpage - Tribute Page Project

Code Feedback
1

Hey everyone!! I just wanted to tell you that I just finish my Tribute Page-Project. It will be a pleasure for me If you watch it and make a comment that you can tell wheter you like or not.
Tribute Page Link

3 Likes
2

Wow nice! I really like your time line section !

1 Like
3

You page looks good @Dorfieeee. Some things to revisit;

  • The test script should be included, with all tests passing, when you submit your projects.
    • Your page passes 9/10 user stories. Click the red button to see which test(s) are failing and text to help you correct the issue.
  • Codepen provides the boilerplate for you. It only expects the code youā€™d put within the body element in HTML. (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.
  • Run your HTML code through the W3C validator.
    • Since copy/paste from codepen you can ignore the first warning and first two errors.
    • There are HTML coding errors you should address. (You can ignore the warnings about adding section headers if you choose. They are there to help with styling semantic pages better)
  • 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.
    • The one for HTML misses things which is why I recommend W3C
    • The one for CSS is good. Use it, you have a duplicate declaration.
  • Review the lesson about giving meaningful text to links.
3 Likes
4

Thanks a lot for your feedback.
All is fixed I believe :]
It passed the test, I did not realize that <figcaption> must be within the box as well, even though it never exceeded its parent, flex-box fixed it easily.

5

Not quite. If you run your html code through the W3C validator again youā€™ll see those are not the correct HTML entities for the angle brackets. Code them correctly (donā€™t just type in the angle brackets to replace the malformed entities).

Hereā€™s why;

Take this stuff and put it where it belongs in codepen. I mentioned in the first post where it belongs.

<title>Jan Hus</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
<meta name="description" content="Jan Hus' tribute page">
<base href="index.html">
<link rel="stylesheet" href="css/xtimeline.css">
<link rel="stylesheet" href="css/xstyle.css">
<script src="js/script.js"></script>
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>

Notice that the test script is not to be moved.

1 Like
6

Hi, thank you once again.

By the way, is it okay to use <section> without <h> elements?
W3 says :

As a general rule, include a heading (h1-h6) as a child of each section and article element.

I think using <div> is just not right thereā€¦

7

First thing, take the test script out of the head. I said the test script was NOT to be moved. (notice when itā€™s in the head element you donā€™t see it any longer? Thatā€™s because itā€™s JS and belongs right before the closing body tag. So leave it in the HTML section in codepen.)

Yes itā€™s okay, thatā€™s why W3C validator just gives a warning. But it makes a page more semantic when you add the header within the section. You can play with that now or later as your skills grow.

8

@Roma, What is more correct:

<section>
   <article></article>
</section>

or

<article>
   <section></section>
</article>

If I do not want use <h#> in my code because I just want put content into context containers, I have to avoid use <section>?

1 Like
9

Take a look at this, itā€™ll answer your question(s). (I just did a quick Google search).

https://www.pluralsight.com/guides/semantic-html

10

I Think You Should Use Good Fonts and Colors.

11

Wow, your page is great. I have nothing for feedback other than say that it looks very nice, elegant and the overall aesthetic matches the theme. Good job :slightly_smiling_face:

ā€¦and perhaps I would just suggest to review the font choices.

12

yeah I know, colors and fonts are something I can definitely work on. Iā€™d like to learn the technical side before I start going deep into a design which I would probably leave to others anyway :rofl:

1 Like
13

Are you saying that because my scripts write content?

image
image909Ɨ743 62.8 KB

Or is it a general rule here?