Feedback- Survey form Project!

Tell us what’s happening:
Describe your issue in detail here.
Hi ! I’ve just completed my survey form project! Would love to know your feedback on it!
Also, how do you stylise the ‘options’ in a dropdown box?

Thanks for your time!

Your code so far

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:89.0) Gecko/20100101 Firefox/89.0

Challenge: Build a Survey Form

Link to the challenge:

Hi! i just checked out your project, it looks preety cool!
I have a few suggestions some of which are just good practices while others are my personal opinion.

The first thing that i would highly recommend you to do is change the form’s background property to something else as right now it is really hard to read the placeholder text inside of the input elements which is a major accessibility problem for sighted as well as disabled users.

here’s an article which explains the issue in detail.

o would also recommend you to use a transition property on the submit button to add a bit of visual flare.

and i just researched your question on option element and here’s an article that might help.

Hope this helped! :slight_smile:

1 Like

Thank you for your feedback! Learnt a lot from the contrast ratio article as well. Will work on the project to apply it

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

  • When asking for feedback please use the #project-feedback subform to get more eyes on. (i’ve taken the liberty of moving this for you)
  • 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>’
  • Change the cursor to a pointer when hovering over the submit button
  • Do not use the <br> element to force line breaks or spacing. That’s what CSS is for.
  • Make your page responsive. Remember, the R in RWD stands for Responsive
    • There’s a horizontal scrollbar on smaller screens
  • As mentioned, the form is hard to read. Possibly change the opacity to make reading it easier.

Thank you! Really appreciate your feedback

Great job on the look/feel of your survey. I think it’s really cute from a design standpoint!

I agree with the suggestions about the background - maybe have the background lighter in opacity and make the main survey background block darker (like how you have the title) since the white text creates more contrast on the darker background.

Also for your form you could make “What’s your favorite quirky topping” checkbox items and the “How often do you order…” a radio button and you’d only have one option, which could make more sense given the questions you’re asking :slight_smile:

1 Like

Thank you for the feedback! Will keep these in mind while editing

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