Establishing a Development Environment

Course: 15 Minutes

• Course Introduction
• Choosing an Editor for HTML5
• Setting up a Development Environment for HTML5
• Verifying Document Validity with HTML5

HTML5 Syntax

Course: 11 Minutes

• Using Markup to Create an HTML5 Document
• Using Tags in an HTML5 Document

Introduction to HTML5 Structure

Course: 22 Minutes

• Adding a !DOCTYPE Declaration to an HTML5 Document
• Creating the Structure for an HTML5 Document
• Adding a Head Section in an HTML5 Document
• Adding a Body Section in an HTML5 Document

HTML5 Meta Tags and Comments

Course: 18 Minutes

• Creating a Basic HTML5 Document Structure
• Using Meta Tags in HTML5
• Using the New Meta Tags Introduced in HTML5
• Using Comments in HTML5

Basic HTML5 Tags

Course: 15 Minutes

• Using the Paragraph Tag in HTML5
• Using the P and BR Tags in an HTML5 Document
• Using the Heading Tags in HTML5

HTML5 Coding Best Practices

Course: 14 Minutes

• Using Coding Best Practices for HTML5
  Using Code Spacing and Formatting in HTML5

HTML5 Hyperlinks

Course: 24 Minutes

• Creating Hyperlinks in HTML5
• Using Hyperlinks in an HTML5 Document
• Creating In-Site Hyperlinks in HTML5
• Creating an E-mail Link in HTML5
• Using Absolute vs. Relative Links in HTML5

Fonts and Special Characters

Course: 11 Minutes

• Manipulating Font Styling Using Tags in HTML5
• Using Special Characters in an HTML5 Document

Practice: Working with HTML5

Course: 20 Minutes

• Exercise: Generating Web Pages Using HTML520

HTML5 Page Objects

Course: 20 Minutes

• Course Introduction
• Using Block Level vs. Inline Elements in HTML5
• Using the Div Tag in HTML5
• Using Object Positioning in an HTML5 Document
• Using Logical Divisions and Spans in HTML5

Basic HTML5 Structure

Course: 9 Minutes

• Creating the Basic Structure of an HTML5
• Creating the Basic Format of an HTML5

HTML5 Lists

Course: 15 Minutes

• Creating a List with HTML5
• Using Lists in an HTML5 Document
• Configuring a List in HTML5

HTML5 Tables

Course: 17 Minutes

• Creating a Table with HTML5
• Using Tables in an HTML5 Document
• Configuring a Table in HTML5

HTML5 Basic Formatting

Course: 11 Minutes

• Using Color with HTML5
• Creating Clickable Hotspots on Images with HTML5

Working with Images

Course: 15 Minutes

• Inserting Images in an HTML5 Document
• Resizing Images in an HTML5 Document
• Wrapping Text Around Images in HTML5

Articles and Sections

Course: 29 Minutes

• Using the Article and Section Tags in HTML5
• Using Semantic and Structural Elements in HTML5
• Changes to the Address and Cite Tags in HTML5
• Using the Details and Summary Tags in HTML5
• Using the Header and Footer Tags in HTML5
• Using the Figure and Figcaption Tags in HTML5
• Using the Nav Tag in HTML5

Inserting Video with HTML5

Course: 10 Minutes

• Using Videos in an HTML5 Document
• Using Flash Files in an HTML5 Document

CSS3 Border Styles

Course: 10 Minutes

• Creating Borders Using CSS3 in HTML5
• Creating Rounded Borders Using CSS3 in HTML5

Practice: Working with HTML

Course: 20 Minutes

• Exercise: Creating a HTML5 Basic Layout

The HTML5 Form Tag

Course: 21 Minutes

• Course Introduction
• Using the Form Tag in HTML5
• Adding the Form Tag to an HTML5 Document
• Manipulating Form Field Attributes in HTML5
• Setting the Value and Name Attributes in HTML5

Selection Form Fields

Course: 16 Minutes

• Using the Password and Textarea Form Fields
• Creating Radio Buttons in HTML5
• Creating Checkboxes in HTML5
• Creating Dropdown Lists in HTML5

HTML5 Form Input Types

Course: 37 Minutes

• Using the Color Chooser Attribute in HTML5
• Using Number Fields in HTML5
• Using Color Fields in HTML5
• Using Color Pickers in HTML5
• Adding a Number Chooser Field to an HTML5 Document
• Adding a Range Slider to an HTML5 Document
• Setting a Numerical Range in HTML5
• Using a Range Slider in HTML5
• Using a Calendar in a Form in HTML5
• Setting Date Forms in HTML5

Submitting Form Data

Course: 10 Minutes

• Submitting Form Data in HTML5
• Submitting a File to a Server in HTML5

Validation and Completion Attributes

Course: 35 Minutes

• Using the Novalidate Form Attribute in HTML5
• Using Placeholders in Forms in HTML5
• Using Required and Placeholder in Forms in HTML5
• Using the Autocomplete Form Attribute in HTML5
• Using the Datalist Tag in HTML5
• Adding a Datalist to a Form in HTML5
• Using Email Form Field Validation in HTML5
• Using Regular Expressions in HTML5
• Using Regular Expressions with Inputs in HTML5

Form Input Attributes

Course: 22 Minutes

• Using the Autofocus Input Attribute in HTML5
• Using the Form Input Tag in HTML5
• Using the Form Action Input Attribute in HTML5
• Using the Form Target Input Attribute in HTML5
• Using the Min and Max Input Attributes in HTML5

Practice: Working with HTML5 Forms

Course: 20 Minutes

• Exercise: Enhance Forms

APIs, Elements, and Selectors

Course: 33 Minutes

• Course Introduction
• Using the Drag and Drop from the File API in HTML5
• Using Geolocation with HTML5
• Finding HTML5 Elements Using querySelector
• Finding HTML5 Elements Using querySelectorAll
• Finding the First Instance of an Element in HTML5
• Finding Multiple Elements Using Selectors in HTML5

Web Storage and Files

Course: 18 Minutes

• Using Session Storage with HTML5
• Using Local Storage Objects with HTML5
• Selecting Files Using the File API with HTML5

Working with XML

Course: 30 Minutes

• Using XML with HTML5
• Using AJAX with HTML5
• Enhancing HTML5 with the XMLHttpRequest API
• Inserting Server Files into an HTML5 Web Page
• Swap HTML5 Pages Using XMLHttpRequest

HTML5 Debugging

Course: 22 Minutes

• Using Browser Best Practices with HTML5
• Verifying HTML5 Browser Support
• Debugging HTML5

Working with Media in HTML

Course: 25 Minutes

• Playing Audio Files in HTML5
• Playing Video Files in HTML5
• Manipulating the Source Attribute in HTML5
• Using the Audio and Video APIs in HTML5
• Obtaining Time-Related Information in HTML5

Advanced Media Techniques in HTML

Course: 21 Minutes

• Configure Media Events in HTML5
• Preloading, Looping, and Muting Media with HTML5
• Sourcing Dynamic Audio and Video Content in HTML5
• Configuring Audio and Video MIME Types in HTML5
• Accessing Playhead Position in HTML5 Media

Practice: Web Page Development Using HTML5

Course: 20 Minutes

• Exercise: Using HTML5 APIs and Media

Introduction to CSS3

Course: 37 Minutes

• Course Introduction
• Creating Web Pages with CSS3 Formatting in HTML5
• Using CSS3 Syntax in an HTML5 Document
• Using Inline CSS3 Styles in an HTML5 Document
• Adding Attachments in an HTML5 Document
• Creating a CSS3 Style Sheet for an HTML5 Document
• Using Basic CSS3 Syntax for an HTML5 Document

Basic CSS3 Usage

Course: 29 Minutes

• Using Inline CSS3 in an HTML5 Document
• Adding a Style Sheet to an HTML5 Document
• Choosing to Use an Attached Style Sheet in HTML5
• Modifying HTML5 Tags with CSS3
• Alternating HTML5 Table Row Colors Using CSS3

Block Elements

Course: 26 Minutes

• Using Block Elements in HTML5
• Manipulating HTML5 Lists with CSS3
• Manipulating DIVs with CSS3 in an HTML Document
• Modifying HTML5 List Bullets Using CSS3
• Using Spans and CSS3 in an HTML5 Document

Referencing HTML Objects

Course: 23 Minutes

• Using ID and Class in an HTML5 Document
• Applying CSS3 Styles to IDs in HTML5 Documents
• Applying CSS3 Styles to Classes in HTML5 Documents
• Modifying Hyperlinks Using CSS3 in HTML5
• Setting the Hover and Visited States in HTML5

Overriding CSS3 Styles

Course: 18 Minutes

• Setting the Color of Visited Links in HTML5
• Applying Styles to Child Elements Using CSS3
• Overriding CSS3 Styles in HTML5
• Manipulating Objects to Display or Hide in HTML5

Practice: Creating an HTML Page Using CSS

Course: 10 Minutes

• Exercise: Formatting an HTML page with CSS1

Changing the Direction of Text

Course: 16 Minutes

• Course Introduction
• Setting the Text Direction in an HTML5 Document
• Rotating Text with CSS3 in an HTML5 Document
• Rotating Divs with CSS3 in an HTML5 Document

Manipulation Techniques Using CSS3

Course: 25 Minutes

• Aligning Text with CSS3 in an HTML5 Document
• Positioning Text with CSS3 in an HTML5 Document
• Positioning Objects with CSS3 in an HTML5 Document
• Setting HTML5 Divs to Overlap Using CSS3
• Using CSS3 Relative Positioning in HTML5 Documents
• Using CSS3 to Overlap Text on an HTML5 Image

Modifying Divs Using CSS3

Course: 32 Minutes

• Using Nested Divs to Create an HTML5 Navigation Bar
• Adding Basic Animation to HTML5 Divs Using CSS3
• Using CSS3 to Turn HTML5 Divs into Buttons
• Configuring HTML5 Divs to be Placed Side by Side
• Using CSS3 to Center an HTML5 Div Layout
• Modifying HTML5 Hyperlinks Using CSS3 Styles
• Setting Vertical Alignment for Div Contents

How to Create a Dropdown Menu

Course: 39 Minutes

• Adding a Basic Navigation Menu with Divs in HTML5
• Formatting a Navigation Menu Using CSS3 in HTML5
• Adding a Background Image to a Div Menu in HTML5
• Changing the Mouse Cursor Using CSS3 in HTML5
• Animating a Div Image on Mouse Hover in HTML5
• Using the HTML5 Nav Tag
• Creating Flyout Menus Using HTML5 Lists and CSS3
• Applying a Gradient Fill to HTML5 Lists

Practice: Manipulate and Format the HTML5 Objects

Course: 20 Minutes

• Exercise: Design an Effective Layout on a Web Page

The CSS3 Transform Property

Course: 33 Minutes

• Course Introduction
• Rotating Objects Using the Transform Property
• Distorting Objects Using the Transform Matrix
• Applying 3D Transformations
• Positioning Objects Using Transform
• Scaling Objects Using Transform
• Skewing Objects Using Transform
• Adding Perspective Using Transform

Animating with CSS3

Course: 33 Minutes

• Creating Animation with CSS3
• Animating a Picture Using CSS3
• Using CSS3 Animation Keyframes
• Cycling the Color of a DIV Using CSS3 Animation
• Rotating Objects Using CSS3 Animation
• Using Advanced CSS3 Animation Techniques

Modifying a Document Using CSS3

Course: 15 Minutes

• Changing a Website's Background Color Using CSS3
• Changing a Website's Background Image Using CSS3
• Modifying Background Images Using CSS3 Styles

Columns and Image Alignment

Course: 9 Minutes

• Creating Columns and Flow Text Using CSS3
• Using Image Alignment

Advanced CSS3 Techniques

Course: 47 Minutes

• Using CSS3 Pseudo Selectors
• Adding CSS3 Pseudo Selectors
• Creating Drop Shadows Using CSS3
• Creating Linear Gradients Using CSS3
• Creating Radial Gradients Using CSS3
• Creating Gradient Text Using CSS3
• Making Items Transparent Using CSS3
• Changing the Range Slider Style Using CSS3
• Drawing Triangles Using CSS3

Practice: HTML5 and Advanced CSS3

Course: 20 Minutes

• Exercise: Creating HTML5 Animations with CSS3

Introduction to JavaScript

Course: 22 Minutes

• Course Introduction
• Using JavaScript Tag
• Navigating to a URL with a Button
• Popping up a Window with JavaScript
• Describing JavaScript Alert, Confirm, and Prompt Pop-Ups
• Debugging JavaScript

JavaScript Syntax

Course: 22 Minutes

• Using JavaScript Punctuation
• Using External vs. Internal JavaScript
• Inserting Javascript Code in HTML5
• Using JavaScript in HTML Tags
• Formatting JavaScript in HTML5

JavaScript Basics

Course: 49 Minutes

• Using JavaScript Variables
• Using JavaScript Math Operators
• Using Conditional Statements
• Using JavaScript For and While Loops
• Controlling Loops Using Break and Continue
• Using Labels with JavaScript Statements
• Using Substrings with JavaScript
• JavaScript Functions
• Passing Values to JavaScript Functions
• Passing HTML Object Information to JavaScript Functions

Fundamental JavaScript Implementation

Course: 24 Minutes

• Reading the Content of HTML Objects
• Change the Content of HTML Objects
• Accessing HTML Classes
• Changing the Class of HTML Objects
• Modifying CSS3 Styles Using JavaScript
• Accessing and Changing HTML Tags

Practice: Create an Interactive Web Page

Course: 20 Minutes

• Exercise: Formatting an HTML Page Using JavaScript

HTML5 SVG Graphics

Course: 32 Minutes

• Course Introduction
• Using Scalable Vector Graphics (SVG) in HTML5
• Drawing Lines Using SVG in HTML5
• Drawing Rectangles Using SVG in HTML5
• Creating Rounded Corners Using SVG in HTML5
• Drawing Circles and Ellipses Using SVG in HTML5
• Drawing Polylines Using SVG in HTML5
• Creating SVG Text in HTML5
• Rotating SVG Graphics in HTML5
• Placing Text on a Path Using SVG in HTML5
• Using Transparency with SVG in HTML5

The HTML5 Canvas

Course: 21 Minutes

• Using the Canvas in an HTML5 Document
• Setting up the HTML5 Canvas
• Sizing the Canvas to the Screen in HTML5
• Moving the Canvas in an HTML5 document
• Rotating the Canvas in an HTML5 document

Basic Canvas Drawing

Course: 23 Minutes

• Drawing Lines on the HTML5 Canvas
• Rendering Text on the HTML5 Canvas
• Drawing Rectangles on the HTML5 Canvas
• Drawing Arcs and Curves on the HTML5 Canvas
• Drawing Circles with the HTML5 Canvas
• Loading and Displaying Bitmaps on the HTML5 Canvas

Color and the HTML5 Canvas

Course: 16 Minutes

• Setting the Canvas Color in HTML5
• Placing an Image on the HTML5 Canvas
• Creating Gradients on the HTML5 Canvas
• Clearing the HTML5 Canvas

Canvas Tracking and Animating

Course: 17 Minutes

• Tracking Objects on the HTML5 Canvas
• Tracking Mouse Coordinates on the HTML5 Canvas
• Creating Basic Canvas Animations in HTML5
• Rotating Objects on an HTML5 Canvas

Practice: Creating a Graphic in HTML5

Course: 15 Minutes

• Exercise: Working with HTML5 Graphics

Making Web Elements Editable

Course: 26 Minutes

• Course Introduction
• Manipulating User Editing of HTML5 Form Elements
• Working with Editable Content in HTML5
• Using CSS3 and Sprites to Animate an HTML5 Menu
• Using the CSS3 Box-sizing Property to Fit HTML5 Boxes
• Creating a Dropdown Menu with CSS3 and HTML5

Browser Functionality and Detection

Course: 27 Minutes

• Using HTML5 to Detect the Browser Type
• Detecting HTML5 Features
• Checking for HTML5 Video Support
• Detecting HTML5 Video Format Support
• Detecting Canvas Support in HTML53
• Detecting Canvas Text Support in HTML5

HTML5 and Mobile Devices

Course: 10 Minutes

• Designing HTML5 Web Sites for Mobile Devices
• Detecting a Browser's Screen Resolution in HTML5
• Detecting and Changing Screen Orientation in HTML5

HTML5 Tags

Course: 15 Minutes

• Using the Date and Time Tags in HTML5
• Highlighting Text Using the HTML5 Mark Tag
• Using the Keygen Tag in HTML5
• Using the Wbr Tag in HTML5
• Using the Dialog Tag in HTML5

Working with Storage and Files

Course: 18 Minutes

• Using HTML5 Web Storage Objects
• Checking for File API Support in HTML5
• Reading Files Using the HTML5 File API5
• Displaying Image Thumbnails with HTML5 FileReader

Practice: Web Development for Mobile Use

Course: 20 Minutes

• Exercise: Creating a Web Site Using Advanced HTML5

JavaScript Implementation

Course: 35 Minutes

• Course Introduction
• Displaying Time with JavaScript in HTML5
• Creating a Countdown Timer in an HTML5 Document
• How to Use JavaScript Timers in an HTML5 Document
• Creating a Scrolling Marquee in HTML5
• Confirming User Input Using Confirm in HTML5
• Capturing User Input from a Prompt in HTML5
• Using Drag and Drop in HTML5

JavaScript and Forms

Course: 20 Minutes

• Accessing Form Data
• Validating Form Data
• Adding HTML Elements to a Web Page
• Modifying Form Elements

Manipulating Forms with CSS3

Course: 16 Minutes

• Modifying HTML5 Form Inputs Using CSS3
• Styling HTML5 Submit Buttons Using CSS3
• Inserting Images in HTML5 Form Fields Using CSS3
• Changing the Style of an HTML5 Form Using CSS3

HTML5 Events and Event Listeners

Course: 23 Minutes

• Using HTML5 Event Properties
• Using the Browser Event Model in an HTML5 Document
• Using an Event Object in HTML5
• Creating Second Generation Listeners in HTML5

HTML5 Meters and Progress

Course: 16 Minutes

• Using the Meter Tag in an HTML5 Document
• Using the Progress Tag in an HTML5 Document
• Customizing Progress Bars in HTML5 Using CSS3

Practice: Form Validation and Feedback

Course: 1 Minute

• Exercise: Working with Form Validation and Feedback