CSC 223 — Authoring for the Web

Contact Form

Overview

In this assignment you'll use HTML forms to create a rather appalling-looking contact page:

Example Contact Form

The way browsers render forms by default isn't very impressive. We'll make this look better with some CSS in a couple of weeks.

Since processing HTML forms data normally requires server-side code, which we won't be covering in this course, we'll use a 3rd party organization called FormSpree to handle the processing for us.

Assignment

  1. Create a new html page in your assignments folder. (You can name the assignment files whatever you want, as long as they are unique, end in .html, and don't contain spaces)

  2. Add the necessary HTML to create a contact form. At the minimum, it should contain fields for the name and email address of the person who wants to contact you, as well as a textarea to allow them to send you a message. Every form also needs a submit button.

  3. Make sure every field has a name attribute.

  4. Make sure every field has a corresponding label tag.

  5. Set your form's action attribute according to the instructions on the FormSpree home page. Also, make sure you've set the method attribute on your form to POST.

  6. Modify your index.html if necessary so that your assignment list correctly links to the new page.

  7. Use git or GitHub Desktop to commit those changes and push them to GitHub.

  8. Wait a minute or so after pushing your changes and verify that your changes appear on your GitHub Pages site.

  9. Test your form and validate it according to the instructions on the FormSpree home page. Note: You must post your form to GitHub and test it from the GitHub Pages site. FormSpree won't allow you to test from a local file on your computer.

  10. After completing the validation, test your form again, to make sure the validation worked.

  11. Submit the url to your github pages site to MySVU. (This should be something like https://USERNAME.github.io/REPOSITORYNAME).