Learning Goal #5
Students will be able to construct complex web pages and understand the purpose of every HTML element, attribute, and value that was written into their code.
PART 1: Deadlines
Read More
Below are your deadlines for Learning Goal #5: Mastering the Foundations of HTML. If you complete approximately 1.5 lessons per week, you should be able to keep up with the deadlines.
- January 11, 2019:
Getting Started – Lesson 5.0 - February 1, 2019:
5 Lessons Complete (5.1 through 5.5) - February 4, 2019:
Quarter Quiz #1 (Questions from 5.1 through 5.5 Only) - March 1, 2019:
6 Lessons Complete (5.6 through 5.11) - March 4, 2019:
Quarter Quiz #2 (Questions from 5.1 through 5.11) - March 4 to March 13, 2019:
Learning Goal Project (Grading on March 13)
REMINDER: In order to earn an A for each lesson, you need to complete each assignment within the lessons. At the end of each lesson, you will take a short quiz on eCampus and confirm that you have done all the assignments. If you only do some of the assignments, you can still do okay, but it is in your best interest to complete them all. Your grade depends on how much you get done within the time you are given.
PART 2: Overview
Read More
When you signed into this lesson, you typed a password into a box and pressed SUBMIT. This is called an input form because you just enter input (name, password, age, email, etc) into a form. Building these forms are easier than making them work, but that doesn’t mean the designs are easy. Be patient with this lesson and go back over the tips and resources as many times as you need to be successful. Your goal is to learn the basic design of an input form.
Below are some helpful tips and resources that you can use during and after this lesson is over.
Important Points to Remember
- An input form is the part of a webpage that allows the user to fill in content (like name, address, comments, etc) or answer questions.
- Input forms are built with two primary tags that are easy to remember: form and input.
- Once you know to design them, input forms are fun to build and great to include on your webpages because they create user interaction.
- So what happens to the information someone inputs after they press submit? For a new web designer, the only downside of adding an input form is that you cannot find or retrieve the user “input” without some programming knowledge. HTML, CSS, and JavaScript are only used to format, style, and set up the input form. They have nothing to do with getting the input back.
- To get the input back, web designers would need some knowledge of .asp, .php, or something similar and this class will not cover them.
PART 3: Assignments
Read More
Assignment #1 (1 Point): SoloLearn Lessons
Log into your SoloLearn account and find the Course called HTML Fundamentals. Inside of this course, watch the following lesson (you will need your headphones), but when you finish, be sure to make note of how many SoloLearn points you have earned. Points are based on how many slides you complete and how many questions you answer correctly after each slide segment. This is a difficult concept to understand, so pay attention and experiment as much as you can.
- Forms
- Blog Project: Contact Form
Assignment #2 (1 Point): Design Project
Open a new document with Notepad or Notepad++ and save it as “5-5_clubform.html” in your WD2 Folder. Imagine that your school was a much smaller school and you needed to make an online club form that every student could use to select their club for the next year. You can make up the club names or use some of the ones you know from our school. Your webpage must include: (1) A title and a favicon, (2) two boxes for name and grade, (3) 10 radio buttons with 10 club names, and (4) a submit button at the end. The rest of your page can be boring if you choose, but you MUST have these four things on your page to be considered complete.
Below are some resources that can help to get you started, but don’t forget about all the elements and attributes you learned how to use in Lessons 5.1, 5.2, 5.3, and 5.4:
- Elements:
form, input, select, option, textarea, datalist, label, fieldset - Attributes:
type, value, action
Here is an example of what your page could look like.
Assignment #3 (1 Point): Form Submission
The teacher must be able to fill out your form and submit. If your form is working, it shouldn’t take longer than 20 seconds, so make sure that you’ve tested it out yourself. If the teacher is busy with other students, simply let him know that you need your form submitted and he’ll know exactly what you need.
Assignment #4 (1 Point): Update Your Index
In the last lesson, you created an Index Page with links to your first three page designs. And now that you’ve created another new page (5-5_clubform.html), the time has come to update your “index.html” with a screenshot and a link to this new design.
Assignment #5 (1 Point): Review and Quiz
Look over the 5.5 Review Sheet. Read over the vocabulary terms. Look over the questions. Make sure you know how to answer each question. Then go to eCampus, find the quiz for Lesson 5.5, and take it. This is a way for you to show the teacher that you have finished this lesson.
If you have finished the assignments in this lesson, you will need a new password so that you can enter Lesson 5.6. Feel free to ask the teacher and don’t be afraid to raise your hand or go up to ask. If you are actually finished with a lesson, you will get an answer.