MS50564

Ladda ner som PDF

Introduction to HTML5

This two-day instructor-ledcourse provides students with the knowledge and skills to work with HTML5.

Målgrupp

This course is intended for students who have experience with HTML 4, basic CSS, and basic Java Script. Students will start by getting their hands dirty and jumping right into HTML5 code. They will learn about the new HTML5 structural, semantic, and form tags, how to use Canvas to create drawings natively in the browser, how to work with HTML5 audio and video, the new methods for storing variables client-side, and how to build applications that work offline. Along the way, they will learn about the current state of browser support for HTML5 and the theory behind all the changes that have been made.

Förkunskaper

  • HTML 4
  • Basic CSS

Basic Java Script Experience in the following areas is beneficial:

  • JSON
  • DOM
  • Ajax

Kursmaterial

Microsofts officiella elektroniska kursmaterial på engelska ingår.

Objectives:

  • Start building HTML5 pages.
  • Understand the major benefits of HTML5.
  • Understand the difference between HTML5 and HTML 4.
  • Be familiar with HTML5's new elements and attributes.
  • Work with audio and video in HTML5.
  • Work with HTML5's new Canvas element to create code-based drawings.
  • Use Web Storage for offline applications.
  • Use all the cool new HTML5 form elements.
  • Understand the current state of browser support for HTML5 and how to make HTML5 sites degrade gracefully.

Course outline:

Module 1: Laying out a Page with HTML5

  • Page Structure
  • New HTML5 Structural Tags
  • Page Simplification
  • Lab : Converting an HTML 4 Page to an HTML5 Page

Module 2: HTML5 - How We Got

  • The Problems HTML 4 Addresses
  • The Problems XHTML Addresses
  • The New, More Flexible Approach of HTML5 - Paving the Cowpaths
  • New Features of HTML5
  • The HTML5 Spec(s)
  • Current State of Browser Support

Module 3: Sections and Articles

  • The section Tag
  • The article Tag
  • Outlining
  • Lab : Using section and article Elements
  • Lab : Determining the Outline

Module 4: HTML5 Audio and Video

  • Supported Media Types
  • The audio Element
  • The video Element
  • Accessibility
  • Scripting Media Elements
  • Dealing with Non-Supporting Browsers
  • Lab : Video - Multiple Sources
  • Lab : Media API

Module 5: HTML5 Forms

  • Modernizr
  • New Input Types
  • HTML5 New Form Attributes
  • Some Other New Form Field... Läs mer

Objectives:

  • Start building HTML5 pages.
  • Understand the major benefits of HTML5.
  • Understand the difference between HTML5 and HTML 4.
  • Be familiar with HTML5's new elements and attributes.
  • Work with audio and video in HTML5.
  • Work with HTML5's new Canvas element to create code-based drawings.
  • Use Web Storage for offline applications.
  • Use all the cool new HTML5 form elements.
  • Understand the current state of browser support for HTML5 and how to make HTML5 sites degrade gracefully.

Course outline:

Module 1: Laying out a Page with HTML5

  • Page Structure
  • New HTML5 Structural Tags
  • Page Simplification
  • Lab : Converting an HTML 4 Page to an HTML5 Page

Module 2: HTML5 - How We Got

  • The Problems HTML 4 Addresses
  • The Problems XHTML Addresses
  • The New, More Flexible Approach of HTML5 - Paving the Cowpaths
  • New Features of HTML5
  • The HTML5 Spec(s)
  • Current State of Browser Support

Module 3: Sections and Articles

  • The section Tag
  • The article Tag
  • Outlining
  • Lab : Using section and article Elements
  • Lab : Determining the Outline

Module 4: HTML5 Audio and Video

  • Supported Media Types
  • The audio Element
  • The video Element
  • Accessibility
  • Scripting Media Elements
  • Dealing with Non-Supporting Browsers
  • Lab : Video - Multiple Sources
  • Lab : Media API

Module 5: HTML5 Forms

  • Modernizr
  • New Input Types
  • HTML5 New Form Attributes
  • Some Other New Form Field Attributes
  • New Form Elements
  • Lab : An HTML5 Quiz

Module 6: HTML5 Web Storage

  • Overview of HTML5 Web Storage
  • Web Storage
  • Other Storage Methods
  • Lab : Creating a Quiz Application

Module 7: HTML5 Canvas

  • Getting Started with Canvas
  • Drawing Lines
  • Color and Transparency
  • Rectangles
  • Circles and Arcs
  • Quadratic and Bzier Curves
  • Images
  • Text
  • Lab : Drawing a Sailboat
  • Lab : Drawing a Snowman
  • Lab : Images and Text

Module 8: Integrated APIs

  • Offline Application API
  • Drag and Drop API

Utbildningen levereras i samarbete med

Kurs-ID: MS50564
Längd: 2 dagar
Kan betalas med:
TRAINING CARD SA-VOUCHER

Lämna dina kontaktuppgifter om du önskar en företagsintern utbildning.