Survey Form Review :)

Code Feedback
1

Hello!

I would appreciate some feedback on my survey form project, pretty please.

Thank you!

Survey Form

1 Like
2

Your page looks okay @Nreynolds1202 but when compared to the sample project a lot of the HTML looks to be the same although the content is different. It’s difficult to see what is yours versus the sample.
I would say to make the project from scratch, with your own code, style and content. Don’t take code from the sample project.
The projects are not just another challenge. Each one is meant to be a significant step in your progress. Every project you do will require research, planning, trial and error, and strengthening your skills beyond what you gained from the incremental challenges.
The hardest part of coding is looking at a problem and coming up with a plan to solve that problem. Starting out by looking at someone else’s code completely bypasses that step.

3

Thanks Roma. It’s true I did find this project more challenging and relied more on the sample this time. If you don’t mind, I’ll submit the updated on this thread.

4

That will be fine @Nreynolds1202.

Have fun with it and feel free to ask questions if something comes up that you don’t understand.

5

I do have a question. I think I’m struggling to see the room for creativity in the HTML. It’s obvious how to make the CSS my own and that was easier. But any suggestions how I could do so in the HTML? That’s where I’m a little stuck. Should I be more creative with the classes and id’s and make those more my own?

6

You’re right in saying there’s not much room for creativity in the HTML portion.
Search for something like html form elements and you will see the basic elements that make up the form but you will also see some semantic elements that you can use too. So rather than having a div element to group the radio buttons, checkboxes, even the personal information, one could use the fieldset element instead.
That will lead you into some styling choices. Maybe you will only want the border around the radio buttons and checkboxes and not around the personal information. That will lead to giving different class attributes to the fieldset elements.

Hope that helps.

7

Hello @Roma! Whenever you’re able could you look at the project again. Same link.

Also when I tab through the page it skips the radio button labeled “Virtually.” Even if I add tabindex=“0”, it doesn’t become tab-able.

8

It looks good @Nreynolds1202. I thought you were going to start from scratch.

It’s not skipped. It’s in a radio button group and you only get to choose one so it hovers over the first only. If you tab to the checkboxes and then tab backwards you’ll see that “virtually” is given as a choice and it will look like "in person gets skipped.
Use the arrow keys to make a selection when tabbing through a radio button group.

9

Sorry @Roma . Take three… thanks for your patience. Same link

Good to know that regarding the radio buttons.

10

Looks good @Nreynolds1202. Be careful when changing things though. Don’t just blindly change things to make it different.

Something to revisit;

  • The test script, with all tests passing, should be included when you submit your projects.
    Your page passes 9/17 user stories. 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 specific questions on what you don’t understand.
  • Run your HTML code through the W3C validator.
    There are HTML syntax/coding errors you should be aware of and address.
    Since copy/paste from codepen you can ignore the first warning and first two errors.
  • Codepen provides validators for HTML, CSS and JS. Click on the chevron in the upxper right of each section and then click on the respective ‘Analyze’ link.
    The one for CSS is good. Use it and address the issue. (little typo)
    (The one for HTML misses things which is why I recommend W3C)
11

Thank you so much! This is all super helpful. All suggested changes were made!

12

Good job cleaning things up!

13

I loved both versions of this… The before and the after… The styling was really good…
But most importantly, the content was really relevant and Timely…

A Beautifully Executed Project.

1 Like
14

Thank you so much! Technical Doc page coming soon…

1 Like
15

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