Introduction
This Developing Web
sites with HTML 4.0 course is designed for developers who want to
get the most out of the HTML markup language. This course focuses on
creating highly effective and interactive Web pages as well as on
the essential building blocks of an HTML document.
Audience
This course is
intended for:
|
• |
Web developers
who need to implement Web-based solutions and work in a HTML
document environment |
|
• |
Webmasters who want working knowledge of HTML to create and
maintain Web sites. |
|
• |
Project
Managers who must have a basic understanding of what is
possible to accomplish with HTML and related technologies. |
At Course
Completion
After completing
this course, students will be able to:
|
• |
Be familiar
with the building blocks of the HTML 4.0 markup language. |
|
• |
Understand how to design and layout Web pages. |
|
• |
Be able to
create tables and frames. |
|
• |
Understand how to develop Web pages to get user information. |
|
• |
Have a working
knowledge of Cascading Style Sheets and the formatting power
they can bring to your Web pages. |
|
• |
Be familiar
with the scripting languages JavaScript and VBScript and how
to use them to create highly interactive Web pages. |
|
• |
Understand how to implement some of the Dynamic HTML (DHTML)
features to generate very dynamic, interactive, and
entertaining Web sites. |
Prerequisites
Before attending
this course, students must have:
|
• |
A basic
familiarity with PC’s and Windows 95, 98, NT, or 2000. |
|
• |
A basic
understanding of how the Internet works. |
|
• |
A basic
understanding of the concepts relating to databases (what is
a table, field, etc.). |
Course Outline
Module 1:
Introduction to HTML
This module
includes the World Wide Web, understanding HTML and Internet
terminology, the building blocks of a Web page and creating a simple
page using HTML.
Lessons
|
• |
The Internet |
|
• |
The History of
HTML |
|
• |
The Building
Blocks of a Web Page |
|
• |
A simple HTML
Document |
Lab 1: Introduction
to HTML
|
• |
Overview |
|
• |
Creating a
Simple HTML Document |
|
• |
Adding META
Tags |
|
• |
Testing Your
Web Page |
After completing
this module, students will be able to:
|
• |
Create a
simple HTML document |
|
• |
Add META Tags |
|
• |
Test a Web
page |
Module 2:
Formatting Text
This module
explains how to properly format the text on a Web page, understand
how HTML deals with spacing and line break and difference between
ordered and unordered lists.
Lessons
|
• |
Modifying the
appearance of Text |
|
• |
Text Alignment |
|
• |
Creating Lists |
Lab 2: Formatting
text
|
• |
Defining
Layouts with Text |
|
• |
Working with
Fonts |
|
• |
Adding a
Bullet List |
After completing
this module, students will be able to:
|
• |
Understand the tags necessary to properly format the text on
a Web page. |
|
• |
Create ordered
and unordered lists |
Module 3:
Graphics, Color and Animation
This module
explains how to create and add images to Web pages, work with colors
in HTML, understand layout principles with images, support old
browsers and use sound.
Lessons
|
• |
Working with
Images |
|
• |
Using Images
with HTML |
|
• |
Custom
Backgrounds |
|
• |
Animation |
|
• |
Adding Sound |
Lab 3: Graphics,
Color and Animation
|
• |
Overview |
|
• |
Working with
Images |
|
• |
Adding a
background |
|
• |
Using Sound |
After completing
this module, students will be able to:
|
• |
Create and add
images to Web pages |
|
• |
Work with
colors in HTML |
|
• |
Understand layout principles with images |
|
• |
Learn how to
support old browsers |
|
• |
Enhance your
site with sound |
Module 4:
Advanced Layout with Tables
This module
explains how to create and work with tables in a Web page.
Lessons
|
• |
Creating
Tables |
|
• |
Advanced
Layouts with Tables |
|
• |
Grouping Rows
and Columns |
|
• |
Tips and
Tricks |
Lab 4: Advanced
Layout with Tables
|
• |
Overview |
|
• |
Working with
Tables |
|
• |
Using Tables
for Layout |
After completing
this module, students will be able to:
|
• |
Create tables |
|
• |
Group rows and
columns |
Module 5:
Hypertext Links
This module
explains the URL structure, creating hypertext links and image maps.
Lessons
|
• |
Anatomy of a
URL |
|
• |
Working with
Anchors |
|
• |
Linking to Web
Pages |
|
• |
Other
Hypertext Links |
|
• |
Image Maps |
Lab 5: Hypertext
Links
|
• |
Overview |
|
• |
Creating
Hyperlinks |
|
• |
Using Named
Anchors |
|
• |
Working with
Image Maps |
After completing
this module, students will be able to:
|
• |
Learn about
the URL structure |
|
• |
Understand how to create a hypertext link |
|
• |
Learn how to
create image maps |
Module 6: Frames
This module
explains the advantages of implementing frames and how to create
frames.
Lessons
|
• |
What are
Frames? |
|
• |
Creating a
Frameset Document |
|
• |
Frame
Attributes |
|
• |
Using
Hyperlinks |
|
• |
Frame Layout |
Lab 6: Frames
|
• |
Overview |
|
• |
Creating
Frames |
|
• |
Adding
Hyperlinks |
|
• |
Creating
Floating Frames |
After completing
this module, students will be able to:
|
• |
Understand the advantages of implementing frames |
|
• |
Understand how frames are created |
|
• |
Be familiar
with many features of frames |
Module 7:
Cascading Style Sheets
This module
explains how to create a simple CSS style sheet and explains CSS
formatting layout styles.
Lessons
|
• |
Cascading
Style Sheets Overview |
|
• |
Using Style
Sheets |
|
• |
Formatting and Layout |
|
• |
Advanced
Techniques |
Lab 7: Cascading
Style Sheets
|
• |
Overview |
|
• |
Use CSS for
Text Formatting |
|
• |
Use CSS for
Positioning |
After completing
this module, students will be able to:
|
• |
Understand the purpose of CSS as it relates to HTML |
|
• |
Create a
simple CSS style sheet |
|
• |
Be aware of
the limited support of both Level 1 and Level 2 CSS |
|
• |
Understand the many selector in the CSS specifications |
|
• |
Understand the <SPAN> and <DIV> tags |
Module 8: HTML
Forms
This module
explains how to accept user input on a Web page, the purpose of the
<FORM> tag and how to find the numerous control available for
gathering information.
Lessons
|
• |
Introduction to Forms |
|
• |
Form Controls |
|
• |
Implementing Forms |
|
• |
Advanced Form
Design |
Lab 8: HTML Forms
|
• |
Overview |
|
• |
Simple Form |
|
• |
Complex Form |
After completing
this module, students will be able to:
|
• |
Learn how to
accept user input on your Web site |
|
• |
Understand the purpose and proper use of the >FORM< tag |
|
• |
Investigate the numerous controls available for gathering
information |
|
• |
See how data
is processed on the Web server |
Module 9: Creating Interactive Web Pages
This module
explains how to make pages interactive, add Java Applets and ActiveX
Controls.
Lessons
|
• |
Introduction to Scripting |
|
• |
JavaScript |
|
• |
Performing Field Validation |
|
• |
VBScript |
|
• |
Using Java
Applets |
|
• |
Using ActiveX
Controls |
Lab 9: Creating
Interactive Web Pages
|
• |
Overview |
|
• |
Simple Field
Validation |
|
• |
Web Calculator |
After completing
this module, students will be able to:
|
• |
Make pages
interactive through scripting |
|
• |
Understand the JavaScript and VBScript language |
|
• |
Add Java
Applets and ActiveX Controls |
|
• |
Understand simple form validation |
|
• |
Create
browser-aware Web pages |
Module 10: DHTML
This module
explains how to understand the current state of DHTML and DOM,
create interactive pages with classes, alter content from the
browser and perform simple animation.
Lessons
|
• |
What is HTML? |
|
• |
Document
Object Model (DOM) |
|
• |
Dynamic Styles |
|
• |
Dynamic
Classes |
|
• |
Dynamic
Content |
Lab 10: DHTML
|
• |
Overview |
|
• |
Creating
Dynamic Buttons |
|
• |
Event Bubbling |
After completing
this module, students will be able to:
|
• |
Understand the current state of DHTML |
|
• |
Understand the Document Object Model (DOM) |
|
• |
Create
interactive pages with classes |
|
• |
Alter content
from the browser |
|
• |
Perform simple
animation |