HTML Images, Tables, and Forms

Topic Overview

Image Integration

Images in HTML Saving for Web The <img> Tag Source Alt Title Width and Height The <img> Element TODO

Table Structure

Tables in HTML The <table> Tags Rows Cells Headings The <table> Element TODO

Intro to Forms

Web Forms The <form> Tags Action Method ID and Class The <form> Element TODO

Form Input Elements

Asking for Input The <iput> Tag Type Name ID The <input> Element TODO

Text Types

Text Input Plain Text Password Text Area Maxlength Columns and Rows Placeholder Size Value Autofocus TODO

Selection Types

Selection Input Radio Buttons The Checkbox Element The Select Box (AKA Dropdown Select) TODO

Button Types

Buttons The Upload Button The Submit Button The Image Button The Button Element TODO

Form Management

Keeping Track Labels and IDs Fieldsets and Legends TODO

HTML5 Inclusions

New in HTML5 Validation Date E-Mail Search Figure and Figcaption TODO

Web Forms

Forms and form elements are used by web developers to collect data & information from users on websites. This can include:

drop-down boxes (multiple choices)
text entry (usernames, real names, phone numbers, e-mails, etc)
radio checkmarks/buttons (select all-that-apply)
password input (hidden text)
buttons (used for submitting information and navigating to new pages)
file uploads

This semester, we will not use forms very much, as they inherently require a more robust language to handle their collection and transmission. This is one of the roles of JavaScript, which will be discussed more in the second Web course (“MART 441 Web Technologies”). However, some services will allow us to create forms for websites that can do the front-end and back-end lifting/handling of the data.

The most common example of a form in use is a search box, such as Google or YouTube.