Survey Form FEEDBACK - Z Apocalypse

Hi all!

Finally, finished having fun with my survey form and would appreciate some feedback.

https://codepen.io/uzoukwu/full/yLVEQdQ

Cheers!

Thereā€™s not much to critique, it looks really good and the HTML is clean (proper labels, legends, ā€¦). So I can only nitpick:

  • I wouldnā€™t set almost everything to uppercase, only the labels maybe. But thatā€™s totally a question of personal taste
  • Iā€™d give the input fields some padding, right now theyā€™re not even 30px high and on a smartphone, depending on the size of your fingers, you might need a few attempts until you hit the field
  • The textareaā€™s placeholder isnā€™t visible, because thereā€™s already some spaces in it that the user first has to delete. You can avoid that by removing the whitespace between the opening and closing <textarea> tags

Well as I said, nitpicking. Really good job :love_you_gesture:

1 Like

Thanks for the hint about the textarea and padding, updated my code.

Your form looks good @uzoukwu. Some things to revisit;

  • Run your HTML code through the W3C validator.
    • There are HTML coding errors you should be aware of and address.
    • Since copy/paste from codepen you can ignore the first warning and first two errors.
  • Do not use the <br> element to force line breaks or spacing. Thatā€™s what CSS is for.
  • Userā€™s should be able to click on the label to toggle a selection, not just the radio button / checkbox
    • Thereā€™s an attribute missing for one of your checkboxes which prevents the user from being able to toggle the selection using the label.

Side note: You donā€™t need to include the style tags in the ā€˜Stuff for <head>ā€™ box.

1 Like

Hi @Roma,
Thank you for your feedback, I have looked into all your remarks.

Nice job @uzoukwu.

I didnā€™t notice it the first time but thereā€™s a typo in your radio buttons too. Youā€™ll notice that clicking the label for ā€œbikeā€ toggles the ā€œtruckā€. Easy to fix.

1 Like

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.