PROJECTS are to be completed and DUE by the due date.

Jan 10

Overview, Expectations, HTML Basics

LESSON OBJECTIVES

1. Student Learning Outcomes (SLO) - Course Introduction
2. HTML1: w3schools.com - The World's Largest Web Developer Site
   • Click on HTML Introduction
   • Click on HTML Editor - USE Notepad
   • Click on HTML Basics
   • Click on HTML Headings
   • Click on HTML Paragraphs

IN-CLASS Exercise (To Be Graded In Class):

1. Create your Folder on the Desktop.
2. Saving your files. Use a Flash, or create a CS211 folder in your Google Drive to save your work.
3. Reply to my Syllabus Received Email
4. Email Me: First HTML Document (first.html)
   • TO: yvonne.flores@guamcc.edu
   • CC: your email address
   • Subj: CS211 First HTML

Attach the first.html file.

HTML Basics

LESSON OBJECTIVES

1. REVIEW
   • HTML Page Structure
   • Introductory HTML tags
2. w3schools.com, Test Yourself with Exercises!:
   • Click on HTML Headings scroll down (Exercises 1 - 4)
   • Click on HTML Paragraphs scroll down (Exercise 1 - 4)
3. HTML2: w3schools.com
   • Click on HTML Basics (continued)
     • Read under HTML Links section.
     • Read under HTML Images section.
     • Read under HTML Buttons section.
     • Read under HTML Lists section.

IN-CLASS Exercise (To Be Graded In Class):

1. Create your Folder on the Desktop.
2. Save your file as first2.html.
   • 3 Working Links
   • Unordered List of Taco Bell locations.
   • Ordered List of your favorite restaurants
   • 3 Images
   • A button
3. Email Me first2.html
   • TO: yvonne.flores@guamcc.edu
   • CC: your email address
   • Subj: CS211 2nd HTML

Attach the first2.html file.

HTML Basics (continued)

LESSON OBJECTIVES

1. HTML3: w3schools.com
   • Click on and read HTML Attributes web page.
   • Click on and read HTML Colors web page.
   • Click on and read HTML Styles web page.
   • Click on and read HTML Lists web page.
   • Click on and read HTML Links web page.
2. Test Yourself with Exercises!:
   • HTML Attributes (Exercises 1 - 5)
   • HTML Styles (Exercises 1 - 6)
   • HTML Lists (Exercises 1 - 5)

IN-CLASS Exercise (To Be Graded In Class):

1. Create your Folder on the Desktop.
2. Save your file as first3.html.
   • Change your web page to a different BACKGROUND color.
   • A large HEADING with the following attributes
     • color
     • font
     • alignment
     • size
   • A PARAGRAPH with the following attributes
     • color
     • font
     • alignment
     • size
   • Unordered List of Payless location
     • different style of bullets.
   • Ordered List of 3 Items
     • different list item marker besides numbers.
   • Description List of 3 terms.
   • 2 Links that open up to a new page.
3. Email Me first3.html
   • TO: yvonne.flores@guamcc.edu
   • CC: your email address
   • Subj: CS211 3rd HTML

Attach the first3.html file.

HTML Attributes - comes in name="value" pairs

LESSON OBJECTIVES

1. HTML4: w3schools.com
   • Click on and read HTML Formatting web page.
   • Click on and read HTML Quotation web page.
2. Test Yourself with Exercises!:
   • HTML Formatting (Exercises 1 - 5)
   • HTML Quotations(Exercises 1 - 4)

Project 1 (HTML Letter): letter.html

1. Download File: Click Here to Link to Google Drive for letter.txt file
   • You must log in using your guamcc email address.
   • Download to your folder.
2. OPEN the file in NOTEPAD, SAVE AS:
   • letterfinal.html
   • Save as type: All files
   • Encoding: UTF-8
3. Click Here to view the Project Briefs.
• MARKUP the file using the HTML tags and attributes you have learn so far.
• Make sure your are SAVING your file periodically.
4. Click Here to view the OUTPUT.
5. Email Me letterfinal.html
• TO: yvonne.flores@guamcc.edu
• CC: your email address
• Subj: CS211 HTML Project 1

Attach the letterfinal.html file.

HTML Formatting

HTML Quotations

LESSON OBJECTIVES

1. HTML5: w3schools.com
   • Click on and read HTML Links.
     • target attribute
     • Image as a Link
     • Create a Bookmark
   • Click on and read HTML Blocks.
   • Click on and read HTML Tables.

IN-CLASS Exercise (To Be Graded In Class):

1. first4.html - Click Here for Instructions
2. Email Me first4.html
   • TO: yvonne.flores@guamcc.edu
   • CC: your email address
   • Subj: CS211 4th html

Attach the first4.html file.

HTML Blocks

HTML Tables

LESSON OBJECTIVES

1. HTML6: w3schools.com
   • Click on and read HTML Forms.
   • Click on and read HTML Form Elements.
   • Click on and read HTML Input Types.
   • Click on and read HTML Input Attributes.
2. Test Yourself with Exercises!:
• HTML Forms (Exercises 1 - 4)
• HTML Form Elements (Exercises 1 - 3)
• HTML Input Types (Exercises 1 - 5)

IN-CLASS Exercise (To Be Graded In Class):

1. firstforms.html - Click Here for Instructions
2. Email Me firstforms.html
   • TO: yvonne.flores@guamcc.edu
   • CC: your email address
   • Subj: CS211 HTML Forms

Attach the firstforms.html file.

HTML Form