Blog Survey Form Feedback

Code Feedback
1

I’ve finally completed my survey form, please go ahead and critique my code, I ran my Html through the code validator although I wish there was something similar for CSS but Nothing shoed up with extensions so I think there’s no major errors.

My CSS design was severely lacking, and I recognize that, I need to hone my CSS skills more than Html for sure so If you have tips on that please reach out.

Also, this Survey is pertaining to my blog BenTechCode.blogspot.com and I would like to deploy this survey if anyone has any tips for that please reach out to me through this thread.

Ok enough chit-chat, here’s the project:

Thanks in advance, Cy499_Studios

2

W3C does have a separate CSS validator if you want to run your code through there.

On my end, I was only able to see the html not the css portion. When I opened up your editor you have a link to an external stylesheet but the styles still didn’t show up for me. I think it might be better to just copy and paste your CSS straight into the codepen editor.

1 Like
3

Hey Ben,

nice to see you again!

Great job so far! :clap:

My ideas:

  • 13 of 17 tests pass, great work, only 4 left! :clap:

  • when you use codepen (only there!), you only have to add the code that belongs into the body; so you can remove:

<!DOCTYPE html>
<html>
<link rel="stylesheet" href="Surveyform.css">

  • your link goes to Surveyform.css, in codepen you can put this into the CSS box

  • HTML validation: I think there are two unnecessary </div>s you have to delete and one </div> is missing at the bottom

  • CSS validation: :arrow_left: there is actually a tool for it!

  • you can increase the readability of your code by:

    1. clicking on the small arrow on the right side of the code box and
    2. clicking Format HTML/CSS

If you add your CSS, we can give you additional feedback on your design and styling, looking forward to seeing it! :slightly_smiling_face:

4

Ok sorry I forgot to update the codepen by clicking “save” lol the most current code should be in place by now so please disregard my past codepen and critique this new one. Just click on the codepen and it should be good

Thank you for your patience,
Ben/Cy499_studios

5

BTW now you should find a passing website with all 17 tests checked off and with css to accompany the HTML. If you find otherwise, please alert me.

6

The css works for me now. Thanks for making those changes. I think it looks good. The only thing that I noticed was that the first yellow sentence was a little hard to read. So maybe choose a different color like black or maybe add a transparent background like you did for your BenTechCode text.

Happy coding!

7

Thanks so much! Will do :slightly_smiling_face::+1:

8

Alright Ben,

great work!

My ideas:

  • you can increase the overall readability of your page by adding some more spacing, e.g. between the different questions; you can read more about it in principles of design

  • the background image seems to be very low quality, it is very pixelated

  • the yellow-on-yellow is very hard to read for me:
    Screenshot_2020-09-23_08-53-51

  • when I decrease the width of my browser, the content gets cut off; a horizontal scrollbar is mostly something you want to avoid; this is important for people who read your page on a smartphone:
    Screenshot_2020-09-23_08-54-59

Looking forward to seeing your next steps! :slightly_smiling_face: