To register online click here, or call
800-413-0939
Our Registrars will be happy to assist you.

HTML Training Course

Menu

Web Site Development with HTML/JavaScript

Duration: 5 days | Price: $2595 *California residents and government employees call for pricing.

Class Dates:

Click here for information regarding remote access training.

Students Will Learn:

  • HTML Fundamentals
  • Developing and Using Cascading Style Sheets (CSS)
  • Building Forms and Tables
  • Displaying Images on a Webpage
  • Defining Lists and Hyperlinks
  • Document Object Model (DOM)
  • JavaScript Syntax
  • Form Validation
  • Event Handling
  • Ajax and JSON Fundamentals

Course Description: This hands on Web programming class provides a thorough introduction into the creation of a Website using HTML, CSS and JavaScript. Starting with thorough coverage of HTML and Cascading Style Sheets (CSS), the course progresses to the implementation of dynamic client-side content using JavaScript. HTML topics include use of HTML5 semantic tags, block-level and inline elements, creating links, different types of lists, creation of tables and forms. Students will learn to attach CSS to a page using several different techniques, CSS selectors and pseudo-classes, CSS box model, and a variety of CSS2.1 properties.

JavaScript topics include adding JavaScript to a Webpage, use of dialogs to interact with the user and JavaScript intrinsic objects such as Date, Array and Math. Students will also be introduced to the Document Object Model (DOM), creation of functions, event handling, form validation, JSON and Ajax. Comprehensive hands on exercises are integrated throughout to reinforce learning and develop real competency.

Students who already have an understanding of HTML and CSS should register for the 3-day course JavaScript Programming.

Course Prerequisites: Basic personal computer skills and basic Internet knowledge.

Follow-up Courses: Developing Rich Internet Applications Using HTML5, CSS3 and jQuery, PHP Programming

Web Site Development with HTML/JavaScript Course Overview:

HTML Fundamentals
  • HTTP Requests and Responses
  • Static vs. Dynamic Pages
  • Tag and Attribute Fundamentals
  • Document Structure
    • Understanding <DOCTYPE>
    • Creating a Page Title
    • Indicating the Character Set
    • <head> and <body> Tags
Structuring an HTML Document
  • Adding Headings
  • Adding Paragraphs
  • Working with the <div> Tag
  • Adding Quotes to a Page
  • HTML5 Semantic Tags
    • <header>, <footer>, <nav>, <article>, <section>
  • Defining Hyperlinks
Formatting Text
  • Using Inline Tags
    • <b>, <i>, <strong>, <em>
  • Using the <span> and <mark> Tags
  • Defining Inline Styles
    • Changing Text Color
    • Changing Font Characteristics
    • Changing Horizontal Alignment
  • Using Character Entities
Introduction to Cascading Style Sheets (CSS)
  • Overview of Cascading Style Sheets (CSS)
  • Creating CSS Rules
  • Setting CSS Properties
    • Working with Colors
    • Units of Measurement (px, em, %)
    • Working with Fonts
  • Defining Type Selectors
  • Defining Class and ID Selectors
  • Using Attribute Selectors
  • Grouping and Combining Selectors
  • Linking to External Style Sheets
  • Embedded Style Sheets
  • Overriding Styles with !important
Controlling Text and Backgrounds with CSS
  • Text-Related Properties
    • text-decoration, color, line-height
  • Font-Related Properties
    • font-family, font-size, font-weight
  • Background-Related Properties
    • background-color, background-image, background-position
CSS Box Model
  • Positioning Elements
    • Static, Absolute and Relative
    • Controlling z-index
    • Floating and Clearing Elements
  • Visual Effects
    • Setting visibility and display
    • Using overflow and clip Properties
    • Setting Vertical Alignment
  • Box-Related Properties
    • margin, padding, border
  • Setting the Size of an Element
Additional CSS Topics
  • Relational Selectors
    • Descendant
    • Direct-Child
    • General Sibling
    • Adjacent Sibling
  • Pseudo-Classes and Elements
    • Styling Links with :link, :visited, :active, :hover
    • Adding Content with :before and :after
  • Creating Printer-Friendly Pages
Working with Lists
  • Types of Lists
    • Ordered Lists
    • Unordered Lists
    • Description Lists
  • Creating List Items Using the <li> Tag
  • Creating Nested Lists
  • Using CSS to Style a List
  • Using Lists to Create a Navigation Menu
Adding Images to a Page
  • Discussion of Common Image Formats
  • Displaying Images on a Web Page
    • Using src and alt Attributes
    • Sizing an Image using width and height Attributes
  • Common Uses of Images
    • Image Thumbnails
    • Favicons
    • Image Rollovers
  • Working with Client-Side Image Maps
Displaying Information in Tables
  • Adding Tables to a Page
  • Working with <table>, <tr>, <td>, <th> and <caption> Elements
  • Creating Nested Tables
  • Using CSS to Style a Table
    • Controlling Table Borders
    • border-collapse and border-spacing Properties
  • Using rowspan and colspan Attributes
Working with HTML Forms
  • Defining a Form
  • Common Form Attributes
    • action
    • method
    • enctype
  • Understanding Form Submission
  • Adding <label> and <fieldset> Elements
  • Single-line and Multi-line Text Fields
  • Radio Buttons and Checkboxes
  • Dropdown and Selection Lists
  • Submit, Reset and Push Buttons
  • Controlling Form Layout Using CSS and Tables
Overview of Client-Side JavaScript
  • Including JavaScript in a Page
    • Using the <script> Tag
    • Referencing an External Script File
    • Using an Event Handler
    • Using a URL
  • Evolution of the JavaScript Language
  • Common Misconceptions About JavaScript
JavaScript Fundamentals
  • Adding Comments
  • Debugging JavaScript Code
  • Declaring Variables with and without var
  • Local vs. Global Variables
  • Using JavaScript Primitive Types
    • String, Number and Boolean
    • undefined
    • null
  • Performing Data Conversions
  • Interacting with the User
    • alert
    • prompt
    • confirm
  • Using Strict Mode
  • Working with JavaScript Operators
    • Arithmetic Operators
    • Assignment Operators
  • Using the Math and Date Objects
Controlling Flow
  • Conditional Constructs
    • if else
    • switch
  • Looping Contructs
    • do while
    • while
    • for
    • for in
  • Branching Statements
    • break
    • continue
  • Equality and Identity Operators
  • Logical and Comparison Operators
Working with Strings, Numbers and Arrays
  • Creating String Objects
  • Using String Methods
    • Searching within a String
    • Returning a Substring
    • Converting Character Case
  • Creating Number Objects
  • Formatting Numbers
  • Creating Arrays
    • Using the Array Constructor
    • Using Literal Notation
  • Accessing Array Elements
  • Common Array Methods
  • Defining and Using Associative Arrays
  • Predefined Object Arrays
Implementing Functions
  • Declaring Functions
  • Invoking Functions
  • Named and Anonymous Functions
  • Passing Arguments
  • Local vs. Global Variables
  • Returning Values from a Function
  • The this Keyword
  • Explaining Closures
Browser Object Model
  • Overview of the Browser Object Model
  • Using the window Object
    • Opening and Closing Windows
    • Using Timers
    • Passing Data Between Windows
  • Using the document Object
    • Writing to the Webpage
    • Accessing Properties of the Document
  • navigator Object
  • location Object
  • screen Object
Introduction to the Document Object Model (DOM)
  • Selecting DOM Elements
    • getElementById
    • getElementsByTagName
    • getElementsByName
    • getElementsByClassName
    • querySelector
    • querySelectorAll
  • Modifying Page Content with the DOM
  • Manipulating CSS using JavaScript
Event Handling in JavaScript
  • Overview of JavaScript Events
    • Identifying Differences Between Browsers
    • The event Object
    • Event Capturing and Bubbling
  • Adding Event Handlers
    • Traditional (Inline) Model
    • Registering Events in JavaScript
    • addEventListener
    • attachEvent
  • Mouse and Keyboard Events
  • Preventing Default Behavior
  • Cancelling Events
Working with Forms
  • Accessing Forms from JavaScript
  • Working with Form Elements
  • Validating Form Fields
    • Checking Required Fields
    • Checking Length of Input
  • Cancelling Form Submission
Using Regular Expressions
  • Overview of Regular Expressions
  • Using Regular Expressions in JavaScript
    • Creating an RegExp Object
    • Using i and g Flags
  • Validating Strings with Regular Expressions
  • Using Backreferences
Working with JavaScript Objects and JSON
  • Understanding Objects
  • Defining Custom Objects
    • Object Literal Notation
    • Defining Properties and Methods
    • Creating a Constructor
  • Extending an Existing Object with prototype
  • Using the in and instance of Operators
  • Overview of JSON
  • Using JSON.stringify and JSON.parse
Using Ajax
  • Overview of Ajax
  • The XMLHttpRequest Object
  • Configuring an Ajax Request
  • Handling Errors on readystatechange
  • Using JSON with Ajax
  • Creating a "Hint" Feature with Ajax
 

Student Testimonials

"This was a great workshop. HOTT was very accommodating with my travel necessities. Very impressive. I am sincerely looking forward to my next workshop (PHP) in a couple of weeks."
– K.M., Medtexx Medical Corporation


"Instructor was highly knowledgeable. Handouts were excellent! Course exceeded expectations."
– M.H., United States Air Force - Cryptologic Systems Group

Multiple Training Locations - Convenience and Cost Control

Regularly Scheduled Courses in more than 100 Cities Across North America and the United Kingdom