Comprehensive HTML5 Development

HTML-108 (5 Days)

Request Pricing for Comprehensive HTML5 Development

HTML5 Training Overview

Accelebrate's Comprehensive HTML5 Development Training teaches attendees everything they need to know to build interactive web pages using the latest version of HTML. Students take their skills to the next level with powerful APIs to leverage device orientation, audio and video, drag and drop, speech recognition, geolocation, the onboard battery, vibrations, and much more. This course is current to version 5.2.

Location and Pricing

Most Accelebrate courses are taught as private, customized training for 3 or more attendees at our clients' sites worldwide. In addition, we offer live, private online classes for teams who may be in multiple locations or wish to save on travel costs. Please visit our client list for organizations for whom we have delivered onsite training. To receive a customized proposal and price quote for private on-site or online training, please contact us.

In addition, some courses are available as live, online classes for individuals. See a schedule of online courses.

HTML5 Training Objectives

All students will learn how to:

  • Learn how to write well-formed HTML using proper syntax
  • Understand the basic structure of a web page
  • Create lists
  • Incorporate images
  • Use HTML5 elements and templates
  • Create HTML5 Forms
  • Incorporate audio and video
  • Use the Canvas element and API
  • Obtain the charge status of a device’s battery
  • Gain end users’ attention via their sense of touch
  • Send the end user notifications that appear outside the web browser
  • Tap into the device’s physical orientation
  • Make portions of your web page editable by the end user
  • Display portions of the web page so that they occupy the users’ entire screen
  • Implement voice recognition and speech synthesis
  • Leverage the new media elements (audio and video)
  • Work with the new <form> elements and attributes
  • Work with the WebStorage API
  • Send and receive messages from web pages, including web pages from a different domain
  • Associate HTML elements with data
  • Make any object on the web page draggable
  • Use the new features of XMLHttpRequest (XHR) level 2
  • Open full duplex connections from client to server with the WebSocket specification
  • Create single unidirectional channels between the server and the client
  • Create a 2D drawing surface with the <canvas> element and "draw” on the canvas with JavaScript.
  • Use geolocation information in your applications
  • Use web workers to boost the performance of your web applications

HTML5 Training Outline

Expand All | Collapse All | Printer-Friendly

Introduction
  • HTML5 summary
  • Abbreviated syntax guide to writing HTML5
  • Best practices
Syntax
  • HTML Elements: how to write HTML tags
  • Syntax rules
  • Page structure
  • Basic structure of a web page
  • The HTML5 syntax summary
Structure
  • Introduction to the structure of HTML documents
  • The HTML Content Models
  • The Content Models
  • Deprecated elements
  • Elements with new meanings
  • Deprecated attributes
  • Structural and semantic elements
  • Overview of lists
  • Overview of links
  • Images
  • The remaining HTML5 elements
  • Using HTML5 templates
  • Using the HTML5 boilerplate and mobile boilerplate
Elements
  • What are the new elements?
  • How do I use the new elements?
  • HTML5 new attributes
Forms
  • Introduction form elements and attributes
  • New form input types
  • New form attributes
  • New form elements
  • When do I use the new elements?
Video and Audio
  • Introduction to HTML5 media elements
  • Audio and Video
HTML5 Canvas
  • What are the new elements
  • Why use the Canvas element and API?
BatteryStatus API
  • Why use the BatteryStatus API?
  • How does the BatteryStatus API work?
  • The BatteryStatus API
    • BatteryStatus API methods
    • BatteryManager properties
    • BatteryManager events
  • Browser support
Vibration API
  • Why use the Vibration API?
  • How does the Vibration API work?
  • Vibration methods
Notifications API
  • Why use the Notifications API?
  • How does the Notifications API work?
  • Notifications API
    • Notification object attributes
    • Notification events
    • Notification API methods
DeviceOrientation Event API
  • Why use the DeviceOrientation API?
  • DeviceOrientation Event API
    • DeviceOrientation events
    • How does the DeviceOrientation Event API work?
    • DeviceOrientation
    • DeviceMotion
    • DeviceOrientation Event API
Fullscreen API
  • Why use the Fullscreen API?
  • The Fullscreen API
    • Fullscreen API methods
    • Fullscreen API properties
    • Fullscreen API events
  • Notes on the fullscreen view
Speech APIs
  • Speech Recognition and Speech Synthesis
  • Speech Synthesis
    • SpeechUtterance object
    • SpeechUtterance object properties
    • SpeechUtterance object events
  • Speech Recognition
HTML5 Media elements and API
  • Audio and Video
    • The media elements
    • What are the new elements used for?
    • Browser support for the new media elements
    • <audio> element attributes
    • <video> element attributes
    • Browser support <video>
    • Browser support Ogg/Theora video format*
    • Browser support WebM/VP8 video format*
    • Browser support MPEG-4/H.264video format*
    • Browser support audio codec
    • When do I use these new elements?
  • Video and Audio APIs
    • Video/audio methods
    • Video/audio object properties
    • Video/audio object events
Forms/Constraint Validation API
  • New form input types
  • What are the new input types?
    • New attributes for input elements
    • New form elements
  • When do I use the new elements?
    • The placeholder attribute
    • The autocomplete attribute
    • The autofocus attribute
    • The list attribute and the datalist element
    • The spellcheck attribute
  • HTML5 form validation
    • Preventing default validation from occurring
  • Constraint Validation API
    • Form properties
    • Form control methods
    • Form controls validity and validityState
WebStorage API
  • Browser support for WebStorage API
  • WebStorage API
    • The Storage Object
  • When
  • Cookies vs. session storage vs. local storage
Web Messaging API
  • Web messaging’s postMessage() method
    • Establishing trust between domains
    • The origin
  • What is cross-origin resource sharing?
    • CORS support and the server
  • Ports and channel messaging
    • MessagePort methods
    • The Message event object properties
Dataset API
  • data-* syntax rules
  • The dataset API
Drag and Drop API
  • What is drag and drop?
    • What is drag and drop used for?
    • Browser support for drag and drop
    • Understanding drag and drop
    • The draggable attribute
    • Drag and drop with a data “payload”
  • Drag events
  • Drop events
XMLHttpRequest Level 2 API
  • Objectives
  • The XMLHTTPRequest object
  • XHR API
    • What is XHR used for?
    • Benefits of XHR level 2
    • The XHR object: readyState property
  • The XHR object
    • The XHR object: Events
    • The XHR Object: Methods
    • The XHR object: Properties
Web Sockets API
  • HTTP
    • WebSocket properties
    • WebSocket event handlers
    • WebSocket methods
  • Using a WebSocket server with the WebSocket API
Server-sent Events API
  • The server messages
  • Creating an EventSource
    • The EventSource properties
    • The EventSource events
    • The advantages of server-sent events
    • The disadvantages of server-sent events
    • Server-sent events summary
Canvas API
  • What are the new elements?
  • Why use the Canvas API?
  • Canvas quick summary
  • Uses for the new Canvas API
  • Canvas Demos
Geolocation API
  • What is the Geolocation API used for?
  • Browser support for Geolocation
  • The Geolocation API
    • Geolocation object methods
    • Position object properties
    • Position interface attributes
Web Workers API
  • Features available to Web Workers
  • Why use Web Workers?
  • When should Web Workers be used?
  • How do Web Workers work?
  • The Web Worker API
    • The abstractWorkerk interface properties
    • The WorkerGlobalScope object
    • The WorkerGlobalScope object properties
    • The WorkerGlobalScope object methods
    • The WorkerGlobalScope events
  • Browser support for Web Workers
  • Types of Web Workers
    • Dedicated Worker
    • Shared Worker
  • Creating Shared Workers
Conclusion
Request Pricing for Comprehensive HTML5 Development

Lecture percentage

40%

Lecture/Demo

Lab percentage

60%

Lab

Course Number:

HTML-108

Duration:

5 Days

Prerequisites:

All attendees must be fluent in HTML 4 and have practical experience with the basics of CSS and JavaScript. Prior knowledge of JSON, DOM, and Ajax is helpful but not required.

Training Materials:

All students receive comprehensive courseware covering all topics in the course.

Software Requirements:

  • Web or text editor of your choice
  • Web browsers - a recent version of one or more of the following:
    • Google Chrome
    • Mozilla Firefox
    • Internet Explorer (9 or later)
    • Safari (5 or later)
    • Opera
  • If space on a web server is available, students may also wish to bring their mobile devices so they can test how pages appear on these devices.

Contact Us:

Accelebrate’s training classes are available for private groups of 3 or more people at your site or online anywhere worldwide.

Don't settle for a "one size fits all" public class! Have Accelebrate deliver exactly the training you want, privately at your site or online, for less than the cost of a public class.

For pricing and to learn more, please contact us.

Contact Us Train For Us

Toll-free in US/Canada:
877 849 1850
International:
+1 678 648 3113

Toll-free in US/Canada:
866 566 1228
International:
+1 404 420 2491

925B Peachtree Street, NE
PMB 378
Atlanta, GA 30309-3918
USA

Subscribe to our Newsletter:

Never miss the latest news and information from Accelebrate:

Microsoft Gold Partner

Please see our complete list of
Microsoft Official Courses

Recent Training Locations

Alabama

Birmingham

Huntsville

Montgomery

Alaska

Anchorage

Arizona

Phoenix

Tucson

Arkansas

Fayetteville

Little Rock

California

Los Angeles

Oakland

Orange County

Sacramento

San Diego

San Francisco

San Jose

Colorado

Boulder

Colorado Springs

Denver

Connecticut

Hartford

DC

Washington

Florida

Fort Lauderdale

Jacksonville

Miami

Orlando

Tampa

Georgia

Atlanta

Augusta

Savannah

Hawaii

Honolulu

Idaho

Boise

Illinois

Chicago

Indiana

Indianapolis

Iowa

Ceder Rapids

Des Moines

Kansas

Wichita

Kentucky

Lexington

Louisville

Louisiana

New Orleans

Maine

Portland

Maryland

Annapolis

Baltimore

Frederick

Hagerstown

Massachusetts

Boston

Cambridge

Springfield

Michigan

Ann Arbor

Detroit

Grand Rapids

Minnesota

Minneapolis

Saint Paul

Mississippi

Jackson

Missouri

Kansas City

St. Louis

Nebraska

Lincoln

Omaha

Nevada

Las Vegas

Reno

New Jersey

Princeton

New Mexico

Albuquerque

New York

Albany

Buffalo

New York City

White Plains

North Carolina

Charlotte

Durham

Raleigh

Ohio

Akron

Canton

Cincinnati

Cleveland

Columbus

Dayton

Oklahoma

Oklahoma City

Tulsa

Oregon

Portland

Pennsylvania

Philadelphia

Pittsburgh

Rhode Island

Providence

South Carolina

Charleston

Columbia

Greenville

Tennessee

Knoxville

Memphis

Nashville

Texas

Austin

Dallas

El Paso

Houston

San Antonio

Utah

Salt Lake City

Virginia

Alexandria

Arlington

Norfolk

Richmond

Washington

Seattle

Tacoma

West Virginia

Charleston

Wisconsin

Madison

Milwaukee

Alberta

Calgary

Edmonton

British Columbia

Vancouver

Manitoba

Winnipeg

Nova Scotia

Halifax

Ontario

Ottawa

Toronto

Quebec

Montreal

Puerto Rico

San Juan

© 2013-2019 Accelebrate, Inc. All Rights Reserved. All trademarks are owned by their respective owners.
This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.