Today we continue to explore forms. Many of you in this class will be professional communicators. Forms are kind of a big deal to you. Books don’t have them. Nor do radio and television. But our websites do. What power! Forms are a doorway; they make the web a two-way street. Your words go out, and their words come back.
Doorway might not be a good term. Funnel might be a better term. For other humans to fit themselves into your system, they must contort themselves into the shape imposed on them by your form. If you require a first name, middle name, and last name, you are assuming that all humans have this amount of names. If you ask for a 5-digit ZIP code, you are assuming that all humans live in the United States. If you allow only ten characters for a first name, you are microagressing.
If you find yourself designing forms in the future, please be a sensitive person. Do not pigeonhole your users into being people just like you.
There’s a lot of really fascinating differences between people, things that aren’t even contentious! Like our favorite flavor of ice cream. Speaking of, let’s jump into our lab activities for the day.
Here’s your TODO list:
failsand describe your criticism in a sentence or two. Make sure we can access it without an account. Use sites that weren’t mentioned in your readings.
See you next time!
First create a
lab19 directory. Add a
partners.html and include your first names and last initials.
icecream.html a form that looks like this:
Observe the following requirements:
text-align: rightto push everything to the right. That won’t work here, as neither the checkbox or button are right-aligned. See that strong line running down between the labels and the elements? We want to align to that. Make it happen through this standard form-styling idiom:
selectfor the lists. Consult MDN to see how to make it display multiple options.
rangeinput for the slider. (This input helps the server determine how many napkins to provide.) Limit it to the range [0, 3].
quiz.html a quiz on a subject matter of your choosing. Observe these requirements: