SurveyFORM by Ulad

Code Feedback
1

hello guys…i just finished my second project…and id sincerely love your feedback on how i can improve…cause i personally felt, i could have done better…here is the link though:
https://codepen.io/Code-by-Ulad/pen/MWjwoQJ

thank you

1 Like
2

Hi @annakene17!

Congrats on finishing your second project.

Here are my thoughts.

  • I personally think your form looks better on mobile than on a laptop. I think that is due to the fact that the input fields take up the full width of the screen. Maybe you could mess around with the width a little bit.

  • You have a few errors in your html and css that need your attention. Run your code through the html validator https://validator.w3.org/#validate_by_input and codepen css analyzer

  • (optional) I personally don’t think you need the bullet points for your radio buttons and checkbox sections.

  • For the title of the page, I would personally use <strong> tags instead of <b> tags because strong tags carry more importance.

  • For the submit button, I think it is should be centered and use the css cursor pointer.
    {cursor: pointer;}

  • Your labels should be wrapped around the inputs like it was taught in this lesson. https://www.freecodecamp.org/learn/responsive-web-design/basic-html-and-html5/create-a-set-of-radio-buttons

<label> 
   <input>
</label>

Hope that helps!

1 Like
3

Thank you @jwilkins.oboe .You have been of tremendous help…I’ll work on this…

I felt the same way about the mobile and laptop thing. Please how do I go about with the width thing?

4

Right now the width is 100% of the viewport so you could experiment with making it a little bit less and seeing how it looks.

1 Like
5

Thank you…let me try that

6

I don’t think this is necessary as long as they are linked with the for attribute - but there is a lot of discussion on this in the web, so :woman_shrugging:

2 Likes
7

I’ll just go through those lessons again and see what they say and make corrections where necessary

8

Please @jwilkins.oboe how do I make use of the HTML validator …I’m sorry but I’m still.new to this and Where is the case analyzer on codepen

9

You can click the button with v on the top right of HTML screen on codepen and then click “Analyze HTML” on the dropdown. To use validator.w3.org, copy and paste your HTML in the text area and then click “Check”. There are other options of uploading a file or using a link.

1 Like
10

Let me do this.Thanks

11

Hello…I have corrected my code on all you adviced…thank you…I hope to improve on my coming projects…

1 Like