Help on my survey form please

Hi there,

I was wondering if I can have some feedback on my survey form. I put it through the w3 validator and there are lots of error messages but I don’t really know how best to change them? Everything seems to looks mostly ok on the page. Is there anything else that you would suggest to improve things? All the tests have passed.

Here it is:
https://codepen.io/Hannahro15/pen/GRjbqOP

Thanks,
Hannah

Well, looking at the first two errors:

Error : Element head is missing a required instance of child element title .

Error : Stray end tag head

And looking at the relevant code:

<head>
    <link rel="stylesheet" href="nandossurvey.css">
    <script src="https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js"></script>
    <h1 id="title">Nando's Survey</h1>
</head>

The first error is telling you that your head section is missing a title element. (Giving your page title a title id isn’t the same thing. This is a string that will not appear on the screen but will show up in the browser tab. (Which may not work on codepen.) Refer to the docs.

The second error is because you have put a page element in your head - it doesn’t go there but in the body.

The message

Error : Bad value Full name for attribute for on element label : An ID must not contain whitespace.

should be pretty self-explanatory.

Fixing those makes those errors go away. You should just work through the errors and do some googling (a developer’s most valuable tool) and check back if you can’t figure one of them out.

1 Like

I’m going to piggyback a little on @kevinSmith’s advice.

  • 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.
    • When set up that way, whenyou do run your HTML code through the W3C validator you can ignore the first warning and first two errors.

Work through the errors as advised. Ask a question if you get stumped.

For further review;

  • Run the FCC test suite again. There is one test that’s now failing. When a test fails, click the red button to see which test(s) are failing and text to help you correct the issue.
    • Be sure and read more than just the first line of the failing message. The ability to read and comprehend error messages is a skill you’ll need to acquire as a developer. Ask questions on what you don’t understand.
  • Do not use the <br> element to force line breaks or spacing. That’s what CSS is for.

Hi,

Thanks for your feedback. I will do my best to fix these and if I get stuck I will then repost my queries or my slightly altered version of the form on here.

Thanks,
Hannah

1 Like